|
|
|
|
@ -4,17 +4,68 @@
|
|
|
|
|
<el-col :span="2" align="left">
|
|
|
|
|
<img v-if="logo" :src="logo" class="sidebar-logo"/>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="22" align="right" style="margin-top: 10px">
|
|
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
<el-form :model="formData" class="order-el-form" ref="formData" label-width="120px" style="margin-top: 5px">
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
<el-form-item prop="workPlaceCode" class="query-form-item" label="当前工位:">
|
|
|
|
|
<el-select
|
|
|
|
|
v-model="formData.workPlaceCode"
|
|
|
|
|
placeholder="当前工位"
|
|
|
|
|
style="width: 90%"
|
|
|
|
|
disabled
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in curWorkPlaces"
|
|
|
|
|
:key="item.workplaceId"
|
|
|
|
|
:label="item.workplaceName"
|
|
|
|
|
:value="item.workplaceId"
|
|
|
|
|
>
|
|
|
|
|
<span style="float: left">{{ item.workplaceName }}</span>
|
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{
|
|
|
|
|
item.workplaceId
|
|
|
|
|
}}</span>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
<el-form-item prop="busType" class="query-form-item" label="当前业务类型:" >
|
|
|
|
|
<el-select v-model="formData.busType"
|
|
|
|
|
filterable
|
|
|
|
|
remote
|
|
|
|
|
reserve-keyword
|
|
|
|
|
disabled
|
|
|
|
|
placeholder="请选择业务类型" clearable style="width: 55%">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in busTypeList"
|
|
|
|
|
:key="item.documentTypeCode"
|
|
|
|
|
:label="item.busName"
|
|
|
|
|
:value="item.documentTypeCode"
|
|
|
|
|
>
|
|
|
|
|
<span style="float: left">{{ item.busName }}</span>
|
|
|
|
|
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.documentTypeCode }}</span>
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
|
|
|
|
|
<el-button type="primary" @click="toggleBusType" style="margin-left: 5px">切换业务</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
<el-col :span="6">
|
|
|
|
|
<el-form-item>
|
|
|
|
|
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<el-col :span="4" align="right" style="margin-top: 10px">
|
|
|
|
|
<div class="inv-hos-title">
|
|
|
|
|
<span
|
|
|
|
|
style="margin: 10px;color: #2d8cf0;font-size: 14px;"
|
|
|
|
|
>部门 : {{ this.userInfo.deptName }}</span>
|
|
|
|
|
|
|
|
|
|
<!--<span style="font-weight: 500;color:rgb(51 48 48); font-size: 14px;">用户 : -->
|
|
|
|
|
<!-- {{-->
|
|
|
|
|
<!-- this.userInfo.companyName-->
|
|
|
|
|
<!-- }}-->
|
|
|
|
|
<!--</span>-->
|
|
|
|
|
<span
|
|
|
|
|
style="font-weight: 500;color:rgb(51 48 48); font-size: 14px; margin-right: 20px"
|
|
|
|
|
>    (用户 : {{
|
|
|
|
|
@ -22,6 +73,7 @@
|
|
|
|
|
}})</span>
|
|
|
|
|
</div>
|
|
|
|
|
</el-col>
|
|
|
|
|
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<el-row class="tac">
|
|
|
|
|
@ -68,7 +120,7 @@
|
|
|
|
|
|
|
|
|
|
<el-col :span="22">
|
|
|
|
|
<el-tabs v-model="editableTabsValue" type="card" closable @tab-remove="removeTab"
|
|
|
|
|
@tab-click="upodateMenuActive" >
|
|
|
|
|
@tab-click="upodateMenuActive" @contextmenu.native.prevent="handleContextMenu">
|
|
|
|
|
<el-tab-pane
|
|
|
|
|
v-for="(item, index) in editableTabs"
|
|
|
|
|
:key="item.name"
|
|
|
|
|
@ -76,14 +128,72 @@
|
|
|
|
|
:name="item.name"
|
|
|
|
|
|
|
|
|
|
>
|
|
|
|
|
<component v-if="showChild" :is="item.component" v-bind="item.componentProps" :reset-key="resetKeys[item.name]" @parent-method="parentMethod"/>
|
|
|
|
|
<div >
|
|
|
|
|
<component v-if="showChild" :is="item.component" v-bind="item.componentProps" :reset-key="resetKeys[item.name]" @parent-method="parentMethod" />
|
|
|
|
|
</div>
|
|
|
|
|
</el-tab-pane>
|
|
|
|
|
|
|
|
|
|
<!-- 自定义的上下文菜单（这里只是一个占位符，你需要实现它） -->
|
|
|
|
|
<div v-if="showContextMenu" class="context-menu" :style="contextMenuStyle">
|
|
|
|
|
<button @click="closeCurrentTab">关闭当前</button>
|
|
|
|
|
<button @click="closeOtherTabs">关闭其他</button>
|
|
|
|
|
<button @click="closeAllTabs">关闭所有</button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-tabs>
|
|
|
|
|
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
title="选择业务类型"
|
|
|
|
|
:visible.sync="selectBusTypeDisabled"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:close-on-press-escape="false"
|
|
|
|
|
:show-close="false"
|
|
|
|
|
v-if="selectBusTypeDisabled"
|
|
|
|
|
width="65%"
|
|
|
|
|
append-to-body
|
|
|
|
|
>
|
|
|
|
|
<el-row>
|
|
|
|
|
<!-- <el-button v-for="(item, index) in busTypeList" :key="index" type="primary" plain @click="selectBusType(item.code)">{{ item.name }}</el-button>-->
|
|
|
|
|
|
|
|
|
|
<el-col v-for="(info, index) in busTypeList" :key="index" :xs="12" :sm="8" :md="8" :lg="6">
|
|
|
|
|
<el-card :body-style="{margin:'20px'}"
|
|
|
|
|
style="margin:20px 20px 20px 20px;height: 200px;background-color: #e1f3fb;border-radius: 12px; position: relative;"
|
|
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
|
|
<div
|
|
|
|
|
style="display: flex; justify-content: space-between; align-items: center; height: 46px; /* 约为 200px 的 1/3 */"
|
|
|
|
|
@click="selectBusType(info.documentTypeCode)">
|
|
|
|
|
<p style="font-size: 20px;background-color: #e1f3fb;font-weight: bold;">{{ info.busName }}</p>
|
|
|
|
|
<!-- 假设你的信息对象中包含一个title属性 -->
|
|
|
|
|
<!-- <div style="width: 60px; height: 60px; display: flex; justify-content: center; align-items: center;">-->
|
|
|
|
|
<!-- <!– 二维码占位，这里用灰色方块代替 –>-->
|
|
|
|
|
<!--<!– <span>QR</span>–>-->
|
|
|
|
|
<!-- <div ref="qrcode" :id="'qrcode-'+index" style="width: 60px;height: 60px;"></div>-->
|
|
|
|
|
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
</div>
|
|
|
|
|
<div style="flex: 1; display: flex; flex-direction: column; justify-content: flex-end; padding-top: 10px;"
|
|
|
|
|
>
|
|
|
|
|
<!-- 假设这里有一些信息内容 -->
|
|
|
|
|
<p style="font-size: 14px;background-color: #e1f3fb" @click="selectBusType(info.documentTypeCode)">{{ info.remark }}</p>
|
|
|
|
|
<el-button type="primary" style="position: absolute; bottom: 20px; right: 20px;" icon="el-icon-thumb"
|
|
|
|
|
@click="selectBusType(info.documentTypeCode)">开始作业
|
|
|
|
|
</el-button>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-card>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
@ -96,6 +206,8 @@ import IoCreateOrderOut from '@/views/collect/IoCreateOrder.vue'
|
|
|
|
|
import ioSplitFifoCode from '@/views/collect/ioSplitFifoCode.vue'
|
|
|
|
|
import CollectOrderUpload from '@/views/collect/CollectOrderUpload.vue'
|
|
|
|
|
import IoDestroyOrder from '@/views/collect/IoDestroyOrder.vue'
|
|
|
|
|
import {listPage} from "@/api/basic/workPlace/sysWorkplaceManage";
|
|
|
|
|
import {getWorkBindBusTypes, removeBusTypeById} from '@/api/basic/workPlace/sysWorkplaceDocuments'
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
@ -111,6 +223,18 @@ export default {
|
|
|
|
|
name: 'CollectOrderTabs',
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
showContextMenu: false, // 控制上下文菜单的显示
|
|
|
|
|
contextMenuPosition: { x: 0, y: 0 }, // 上下文菜单的位置
|
|
|
|
|
selectBusTypeDisabled: false,
|
|
|
|
|
busQuery: {
|
|
|
|
|
busKey: '',
|
|
|
|
|
workplaceCode: null,
|
|
|
|
|
page: 1,
|
|
|
|
|
limit: 100
|
|
|
|
|
},
|
|
|
|
|
formData: {},
|
|
|
|
|
curWorkPlaces:[],
|
|
|
|
|
busTypeList:[],
|
|
|
|
|
logo: logoImg,
|
|
|
|
|
isLinkDisabled: false,
|
|
|
|
|
showChild: true,
|
|
|
|
|
@ -210,6 +334,25 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
toggleBusType(){
|
|
|
|
|
//隐藏下拉框内容
|
|
|
|
|
// this.$refs.selectHeadEmpId.blur();
|
|
|
|
|
this.selectBusTypeDisabled = true
|
|
|
|
|
},
|
|
|
|
|
selectBusType(val) {
|
|
|
|
|
this.formData.busType = val
|
|
|
|
|
let newQuery = { ...this.$route.query };
|
|
|
|
|
delete newQuery.billNo;
|
|
|
|
|
newQuery.busType = val
|
|
|
|
|
this.$router.push({ query: newQuery, path: this.$route.path });
|
|
|
|
|
this.editableTabs = []
|
|
|
|
|
this.clickMenuItem(0)
|
|
|
|
|
this.showChild = false;
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.showChild = true;
|
|
|
|
|
});
|
|
|
|
|
this.selectBusTypeDisabled = false
|
|
|
|
|
},
|
|
|
|
|
parentMethod(data) {
|
|
|
|
|
const foundTab = this.findAllTabByName(data)
|
|
|
|
|
this.clickMenuItem(foundTab.number)
|
|
|
|
|
@ -277,11 +420,92 @@ export default {
|
|
|
|
|
|
|
|
|
|
this.editableTabsValue = activeName
|
|
|
|
|
this.editableTabs = tabs.filter(tab => tab.name !== targetName)
|
|
|
|
|
},
|
|
|
|
|
//获取当前货位
|
|
|
|
|
findCurWorkPlaces(val) {
|
|
|
|
|
let query = {
|
|
|
|
|
key: val,
|
|
|
|
|
status: 1,
|
|
|
|
|
// invCode: this.formData.invCode,
|
|
|
|
|
page: 1,
|
|
|
|
|
limit: 100,
|
|
|
|
|
}
|
|
|
|
|
listPage(query).then((res) => {
|
|
|
|
|
this.curWorkPlaces = res.data.list || [];
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
getWorkBindBusTypes(workplaceId) {
|
|
|
|
|
this.busQuery.workplaceCode = workplaceId
|
|
|
|
|
getWorkBindBusTypes(this.busQuery).then(res => {
|
|
|
|
|
if (res.code == 20000) {
|
|
|
|
|
this.busTypeList = res.data.list
|
|
|
|
|
this.busTypeTotal = res.data.total
|
|
|
|
|
|
|
|
|
|
if (this.$route.query.busType != null){
|
|
|
|
|
this.formData.busType = this.$route.query.busType
|
|
|
|
|
}else if (this.busTypeList.length == 1) {
|
|
|
|
|
this.formData.busType = this.busTypeList[0].documentTypeCode
|
|
|
|
|
this.selectBusTypeDisabled = false
|
|
|
|
|
} else {
|
|
|
|
|
this.selectBusTypeDisabled = true
|
|
|
|
|
this.formData.busType = null
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
return
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
handleContextMenu(event, tabItem) {
|
|
|
|
|
console.log("右击")
|
|
|
|
|
this.showContextMenu = true;
|
|
|
|
|
this.contextMenuPosition = { x: event.clientX, y: event.clientY };
|
|
|
|
|
// 这里可以显示一个自定义的菜单，例如使用 Element UI 的 Dialog 或 Popover
|
|
|
|
|
// 假设你有一个名为 showContextMenu 的方法来显示菜单，并传递 tabItem 作为参数
|
|
|
|
|
this.showContextMenu(tabItem, event.clientX, event.clientY);
|
|
|
|
|
},
|
|
|
|
|
showContextMenu(tabItem, x, y) {
|
|
|
|
|
// 显示你的自定义菜单逻辑，这里只是示例
|
|
|
|
|
this.contextMenuVisible = true;
|
|
|
|
|
this.contextMenuPosition = { x, y };
|
|
|
|
|
this.selectedTabItem = tabItem;
|
|
|
|
|
},
|
|
|
|
|
// 其他菜单操作的方法，如 closeCurrent, closeOthers, closeAll
|
|
|
|
|
closeCurrent() {
|
|
|
|
|
// 关闭当前标签页的逻辑
|
|
|
|
|
const index = this.editableTabs.findIndex(tab => tab.name === this.selectedTabItem.name);
|
|
|
|
|
if (index !== -1) {
|
|
|
|
|
this.editableTabs.splice(index, 1);
|
|
|
|
|
this.editableTabsValue = this.editableTabs[this.editableTabs.length - 1]?.name || '';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
closeOthers() {
|
|
|
|
|
// 关闭其他标签页的逻辑
|
|
|
|
|
this.editableTabs = this.editableTabs.filter(tab => tab.name === this.selectedTabItem.name);
|
|
|
|
|
this.editableTabsValue = this.selectedTabItem.name;
|
|
|
|
|
},
|
|
|
|
|
closeAll() {
|
|
|
|
|
// 关闭所有标签页的逻辑
|
|
|
|
|
this.editableTabs = [];
|
|
|
|
|
this.editableTabsValue = '';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
computed: {
|
|
|
|
|
contextMenuStyle() {
|
|
|
|
|
return {
|
|
|
|
|
left: `${this.contextMenuPosition.x}px`,
|
|
|
|
|
top: `${this.contextMenuPosition.y}px`,
|
|
|
|
|
// 你可以添加更多的样式来美化你的上下文菜单
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.findCurWorkPlaces();
|
|
|
|
|
if (this.$route.query.workplaceId != null) {
|
|
|
|
|
this.isLinkDisabled = true
|
|
|
|
|
this.formData.workPlaceCode = Number(this.$route.query.workplaceId);
|
|
|
|
|
this.getWorkBindBusTypes(this.formData.workPlaceCode);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@ -294,4 +518,9 @@ export default {
|
|
|
|
|
vertical-align: middle;
|
|
|
|
|
margin-left: 25px;
|
|
|
|
|
}
|
|
|
|
|
.context-menu {
|
|
|
|
|
position: absolute;
|
|
|
|
|
z-index: 1000; /* 确保它在其他内容之上 */
|
|
|
|
|
/* 其他样式... */
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
chenhc
10 months ago