提交 409a32ba 编写于 作者: ibizdev's avatar ibizdev

lab_qyk 发布系统代码

上级 ddb2ab7d
......@@ -9,7 +9,7 @@
:key="item.path"
>
<span
v-if="item.redirect === 'noredirect' || index === breadcrumbs.length-1"
v-if="index === breadcrumbs.length-1"
class="no-redirect"
>{{ $t(item.meta.caption) }}</span>
<a
......@@ -22,64 +22,57 @@
</template>
<script lang="ts">
import { compile } from 'path-to-regexp'
import { Component, Vue, Watch, Prop } from 'vue-property-decorator'
import { RouteRecord, Route } from 'vue-router'
@Component({
name: 'Breadcrumb'
})
export default class extends Vue {
private breadcrumbs: RouteRecord[] = []
export default class Breadcrumb extends Vue {
private breadcrumbs: RouteRecord[] = []; //面包屑列表
@Prop() public defPSAppView?: any;
@Prop() public defPSAppView: any; //默认视图
/**
* 监听路由
*
* @memberof Breadcrumb
*/
@Watch('$route')
private onRouteChange(route: Route) {
// if you go to the redirect page, do not update the breadcrumbs
if (route.path.startsWith('/redirect/')) {
return
}
this.getBreadcrumb()
}
/**
* vue 生命周期
*
* @memberof Breadcrumb
*/
created() {
this.getBreadcrumb()
}
/**
* 获取面包屑数据
*
* @memberof Breadcrumb
*/
private getBreadcrumb() {
let matched = this.$route.matched.filter((item) => item.meta && item.meta.caption)
const first = matched[0]
if (!this.isDashboard(first)) {
matched = [{ path: "/index/:index?", meta: {
caption: 'app.views.index.caption',
viewType: 'APPINDEX',
parameters: [
{ pathName: 'index', parameterName: 'index' },
],
requireAuth: true, } } as RouteRecord].concat(matched)
}
this.breadcrumbs = matched.filter((item) => {
return item.meta && item.meta.caption && item.meta.breadcrumb !== false
})
}
private isDashboard(route: RouteRecord) {
const name = route && route.meta.parameters[0].pathName;
if (!name) {
return false
this.breadcrumbs = this.$route.matched.filter((item) => {
return item.meta && item.meta.caption
})
if(this.defPSAppView){
/**如果配置了默认视图,给面包屑第一级赋值默认视图为首页 */
}
return name.trim().toLocaleLowerCase() === 'index'.toLocaleLowerCase()
}
private pathCompile(item: any) {
const { params, path, query } = item;
return { params, path, query };
}
/**
* 单机面包屑
*
* @memberof Breadcrumb
*/
private handleLink(item: any) {
this.$router.push(this.pathCompile(item)).catch(err => {
this.$router.push(item).catch(err => {
console.warn(err);
});
}
......
......@@ -87,28 +87,96 @@
// opacity: 0;
// }
.ibiz-page-tag {
.el-tabs{
.el-tabs__nav{
padding:0px 10px;
border:none;
}
.el-tabs__item{
color:#ccc;
border:none;
}
.el-tabs__item:hover{
color:#409eff;
}
.is-active{
color:#409eff;
border-bottom:2px solid #409eff !important;
}
.el-tabs__nav-scroll{
background-color: white;
position: relative;
.contextmenu {
margin: 0;
background: #fff;
z-index: 3000;
position: absolute;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
&:hover {
background: #eee;
}
}
}
.left{
.el-tabs__header{
box-shadow: 0 1px 2px 0 rgba(0,0,0,.15);
margin:0 0 1 0;
padding-right:120px;
}
}
.right{
position: absolute;
right:0px;
top:0px;
width:120px;
margin:5px 0px;
display: flex;
justify-content: center;
}
>.tag-tabs{
background-color: #F0F0F0 !important;
.el-tabs{
.el-tabs__nav-scroll{
}
.el-tabs__nav{
padding:0px 10px;
border:none;
}
.el-tabs__active-bar{
background-color: transparent !important;
}
.el-tabs__item{
height: 32px;
line-height: 32px;
border: 1px solid #e8eaec!important;
color: #515a6e!important;
background: #fff!important;
padding: 0 12px;
display: inline-block;
margin: 4px 4px 4px 0;
border-radius: 3px;
font-size: 12px;
vertical-align: middle;
opacity: 1;
overflow: hidden;
.ivu-tag-dot-inner{
display: inline-block;
width: 12px;
height: 12px;
margin-right: 8px;
border-radius: 50%;
background: #e8eaec;
position: relative;
top: 1px;
}
}
.el-tabs__item:hover{
color:#409eff;
}
.is-active{
color:#409eff;
.ivu-tag-dot-inner{
background-color:#409eff !important;
}
border-bottom:2px solid transparent !important;
}
.el-tabs__header{
box-shadow: 0 1px 2px 0 rgba(0,0,0,.15);
margin:0 0 1 0;
}
}
}
}
\ No newline at end of file
<template>
<div class="ibiz-page-tag">
<el-tabs
type="card"
@tab-click="changePage"
v-model="editableTabsValue"
closable
@tab-remove="onClose"
<div class="tag-tabs left">
<el-tabs
type="card"
@tab-click="changePage"
v-model="editableTabsValue"
closable
@tab-remove="onClose"
@contextmenu.prevent.native="openMenu($event)"
>
<el-tab-pane
v-for="(meta, index) of $store.state.pageMetas"
:name="index+''"
:key="index+''"
>
<span slot="label"><span class="ivu-tag-dot-inner"></span>{{ getCaption(meta.caption, meta.info) }}</span>
</el-tab-pane>
</el-tabs>
</div>
<ul
v-show="visible"
:style="{left: left+'px', top: top+'px'}"
class="contextmenu"
>
<el-tab-pane
v-for="(meta, index) of $store.state.pageMetas"
:label="getCaption(meta.caption, meta.info)"
:name="index+''"
:key="index+''"
></el-tab-pane>
</el-tabs>
<li v-for="(item,index) in actions" @click="handlerClose(item)">
{{ $t(item.text) }}
</li>
</ul>
<div v-show="$store.state.pageMetas.length > 0" class="right">
<el-dropdown @command="handlerClose">
<el-button size="mini" type="primary">
更多<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="item" v-for="(item,index) in actions">{{ $t(item.text) }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</div>
</template>
......@@ -23,16 +47,49 @@ import { Environment } from "../../environments/environment";
@Component({})
export default class TabPageExp extends Vue {
@Provide()
public styleLeft: number = 0;
private visible = false; //右键菜单显示状态
private top = 0; //菜单距离顶部位置
private left = 0; //菜单距离左侧位置
@Provide()
public actions: any[] = [
{ text: "app.tabpage.closeall", value: "closeAll" },
{ text: "app.tabpage.closeother", value: "closeOther" }
];
public editableTabsValue: any = "";
/**
* 关闭tab页方法
*/
public handlerClose(item: any){
this.visible = false;
this.doTagAction(item.value);
}
/**
* 打开右键菜单
*/
private openMenu(e: MouseEvent) {
const menuMinWidth = 105;
const offsetLeft = this.$el.getBoundingClientRect().left;
const offsetWidth = (this.$el as HTMLElement).offsetWidth;
const maxLeft = offsetWidth - menuMinWidth;
const left = e.clientX - offsetLeft - 15;
if (left > maxLeft) {
this.left = maxLeft;
} else {
this.left = left;
}
this.top = e.clientY - 45;
this.visible = true;
}
public editableTabsValue: any = ""; //tabs页绑定值
@Watch("$route")
public onRouteChange(newVal: any) {
......
......@@ -101,7 +101,7 @@ export default class EditViewEngine extends ViewEngine {
* @memberof EditViewEngine
*/
public onFormLoad(arg: any): void {
this.view.model.dataInfo = Object.is(arg.srfuf, '1') ? arg.srfmajortext : '新建';
this.view.model.dataInfo = Object.is(arg.srfuf, '1') ? (this.majorPSDEField?arg[this.majorPSDEField]:arg.srfmajortext) : this.view.$t('app.local.new');
this.setTabCaption(this.view.model.dataInfo);
const newdata: boolean = !Object.is(arg.srfuf, '1');
......@@ -115,7 +115,7 @@ export default class EditViewEngine extends ViewEngine {
* @memberof EditViewEngine
*/
public onFormSave(arg: any): void {
this.view.model.dataInfo = Object.is(arg.srfuf, '1') ? arg.srfmajortext : '新建';
this.view.model.dataInfo = Object.is(arg.srfuf, '1') ? (this.majorPSDEField?arg[this.majorPSDEField]:arg.srfmajortext) : this.view.$t('app.local.new');
this.setTabCaption(this.view.model.dataInfo);
const newdata: boolean = !Object.is(arg.srfuf, '1');
......@@ -248,7 +248,7 @@ export default class EditViewEngine extends ViewEngine {
public setTabCaption(info: string): void {
let viewdata: any = this.view.model;
if (viewdata && info && !Object.is(info, '') && this.view.$tabPageExp && (viewdata.srfTitle.indexOf(" - ") === -1)) {
this.view.$tabPageExp.setCurPageCaption(viewdata.srfCaption, viewdata.srfTitle, info);
this.view.$tabPageExp.setCurPageCaption(viewdata.srfTitle, viewdata.srfTitle, info);
this.view.model.srfTitle = `${this.view.$t(viewdata.srfTitle)} - ${viewdata.dataInfo}`;
}
}
......
......@@ -26,7 +26,8 @@ vueApp.locale = () => { };
const i18n = new VueI18n({
locale: lang,
messages
messages,
silentTranslationWarn:true
});
export default i18n;
......@@ -25,6 +25,9 @@ export default {
ok: 'OK',
cancel: 'Cancel',
},
local:{
new: 'New'
},
gridpage: {
choicecolumns: 'Choice columns',
refresh: 'refresh',
......
......@@ -25,6 +25,9 @@ export default {
ok: '确认',
cancel: '取消',
},
local:{
new: '新建'
},
gridpage: {
choicecolumns: '选择列',
refresh: '刷新',
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册