Author | SHA1 | Message | Date |
---|---|---|---|
juzi | 916f99a852 |
Merge pull request 'projects/mes-zhp' (#395) from projects/mes-zhp into projects/mes-test
Reviewed-on: http://git.picaiba.com/mt-fe-group/yudao-dev/pulls/395 |
1 week ago |
‘937886381’ | 9581d91c52 | 生产 | 1 week ago |
‘937886381’ | c847ba1595 | 生产管理 | 1 week ago |
‘937886381’ | 2ab8a99ff5 | Merge branch 'projects/mes-test' into projects/mes-zhp | 2 weeks ago |
‘937886381’ | d65dcb8712 | 修改 | 2 weeks ago |
‘937886381’ | 2213b93f0a | Merge branch 'projects/mes-test' into projects/mes-zhp | 1 month ago |
‘937886381’ | d6acfa4fd7 | 新增 | 1 month ago |
@@ -1,7 +1,7 @@ | |||
### | |||
# @Author: Do not edit | |||
# @Date: 2023-08-29 09:40:39 | |||
# @LastEditTime: 2024-07-31 14:57:31 | |||
# @LastEditTime: 2024-09-02 09:07:05 | |||
# @LastEditors: zhp | |||
# @Description: | |||
### | |||
@@ -22,7 +22,7 @@ VUE_APP_TITLE = MES系统 | |||
# VUE_APP_BASE_API = 'http://192.168.1.56:48082' | |||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080' | |||
# VUE_APP_BASE_API = 'http://192.168.1.64:48082' | |||
VUE_APP_BASE_API = 'http://192.168.1.99:48082' | |||
VUE_APP_BASE_API = 'http://192.168.1.20:48082' | |||
@@ -165,3 +165,34 @@ export function orderVoid(data) { | |||
data | |||
}) | |||
} | |||
export function orderSplit(data) { | |||
return request({ | |||
url: '/base/order/split', | |||
method: 'post', | |||
data | |||
}) | |||
} | |||
export function getDetailTree(data) { | |||
return request({ | |||
url: 'base/order/getDetailTree', | |||
method: 'get', | |||
params: data | |||
}) | |||
} | |||
export function getDetailTreeInfo(data) { | |||
return request({ | |||
url: 'base/order/getDetailTreeInfoById', | |||
method: 'get', | |||
params: data | |||
}) | |||
} | |||
export function orderStop(data) { | |||
return request({ | |||
url: 'base/order/stop', | |||
method: 'post', | |||
params: data | |||
}) | |||
} |
@@ -0,0 +1,27 @@ | |||
<?xml version="1.0" encoding="UTF-8"?> | |||
<svg width="72px" height="72px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | |||
<title>rollback</title> | |||
<defs> | |||
<filter x="-1.1%" y="-5.8%" width="102.1%" height="115.3%" filterUnits="objectBoundingBox" id="filter-1"> | |||
<feOffset dx="0" dy="5" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset> | |||
<feGaussianBlur stdDeviation="6" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur> | |||
<feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.0926573427 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix> | |||
<feMerge> | |||
<feMergeNode in="shadowMatrixOuter1"></feMergeNode> | |||
<feMergeNode in="SourceGraphic"></feMergeNode> | |||
</feMerge> | |||
</filter> | |||
</defs> | |||
<g id="页面" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | |||
<g id="页内多种导航方式" transform="translate(-1914.000000, -745.000000)" fill-rule="nonzero"> | |||
<g id="编组-16" filter="url(#filter-1)" transform="translate(94.000000, 641.000000)"> | |||
<g id="编组-3备份" transform="translate(1816.000000, 96.000000)"> | |||
<g id="rollback" transform="translate(16.000000, 15.000000)"> | |||
<rect id="矩形" fill="#000000" opacity="0" x="0" y="0" width="20" height="20"></rect> | |||
<path d="M11.390625,3.78125 L5.71875,3.78125 L5.71875,2.625 C5.71875,2.5203125 5.5984375,2.4625 5.5171875,2.5265625 L3.2984375,4.2765625 C3.234375,4.3265625 3.234375,4.4234375 3.2984375,4.4734375 L5.5171875,6.2234375 C5.5984375,6.2875 5.71875,6.2296875 5.71875,6.125 L5.71875,4.96875 L11.203125,4.96875 C11.7554097,4.96875 12.203125,5.41646525 12.203125,5.96875 L12.203125,11.3125 C12.203125,11.8647847 11.7554097,12.3125 11.203125,12.3125 L2.93775156,12.3125 L2.93775156,12.3125 C2.55569144,12.3125 2.36466138,12.4938859 2.36466138,12.8566576 C2.36466138,13.5 2.93775156,13.5 2.93775156,13.5 C2.93775156,13.5 5.75537604,13.5 11.390625,13.5 C13,13.5 13.390625,12.8986083 13.390625,11.9909216 L13.390625,4.96875 C13.390625,4.06071182 13,3.78125 11.390625,3.78125 Z" id="路径" fill="#0B58FF"></path> | |||
</g> | |||
</g> | |||
</g> | |||
</g> | |||
</g> | |||
</svg> |
@@ -1,41 +1,23 @@ | |||
<!-- | |||
* @Date: 2020-12-14 09:07:03 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2023-11-14 10:11:09 | |||
* @LastEditTime: 2024-09-05 09:50:14 | |||
* @FilePath: \mt-bus-fe\src\views\OperationalOverview\components\baseTable.vue | |||
* @Description: | |||
--> | |||
<template> | |||
<div class="visual-base-table-container"> | |||
<el-table | |||
v-loading="isLoading" | |||
:header-cell-style="{background:'rgba(4, 74, 132, .19)',color:'#fff'}" | |||
:row-style="setRowStyle" | |||
:data="renderData" | |||
border | |||
style="width: 100%; background: transparent" | |||
> | |||
<el-table-column | |||
v-if="page && limit && showIndex" | |||
prop="_pageIndex" | |||
:label="'tableHeader.index' | i18nFilter" | |||
:width="70" | |||
align="center" | |||
/> | |||
<el-table-column | |||
v-for="item in renderTableHeadList" | |||
:key="item.prop" | |||
:show-overflow-tooltip="showOverflow" | |||
v-bind="item" | |||
> | |||
<el-table v-loading="isLoading" | |||
:header-cell-style="{background:'rgba(4, 74, 132, .19)',color:'#fff'}" :row-style="setRowStyle" :data="renderData" | |||
border style="width: 100%; background: transparent"> | |||
<el-table-column v-if="page && limit && showIndex" prop="_pageIndex" :label="'tableHeader.index' | i18nFilter" | |||
:width="70" align="center" /> | |||
<el-table-column v-for="item in renderTableHeadList" :key="item.prop" :show-overflow-tooltip="showOverflow" | |||
v-bind="item"> | |||
<template slot-scope="scope"> | |||
<component | |||
:is="item.subcomponent" | |||
v-if="item.subcomponent" | |||
:inject-data="{...scope.row, ...item}" | |||
@emitData="emitData" | |||
/> | |||
<component :is="item.subcomponent" v-if="item.subcomponent" :inject-data="{...scope.row, ...item}" | |||
@emitData="emitData" /> | |||
<span v-else>{{ scope.row[item.prop] | commonFilter(item.filter) }}</span> | |||
</template> | |||
@@ -5,13 +5,10 @@ | |||
<el-form-item label="工单名称" prop="name" v-if='!isBind'> | |||
<el-input v-model="form.name"></el-input> | |||
</el-form-item> | |||
<el-form-item label="工单名称" prop="workOrderId" v-if='isBind'> | |||
<el-select v-model="form.workOrderId" placeholder="请选择" style="width: 100%;" filterable @change="getWorkOrderMsg"> | |||
<el-option | |||
v-for="item in workOrderList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-form-item label="工单名称" prop="workOrderId" v-if='isBind'> | |||
<el-select v-model="form.workOrderId" placeholder="请选择" style="width: 100%;" filterable | |||
@change="getWorkOrderMsg"> | |||
<el-option v-for="item in workOrderList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -23,11 +20,8 @@ | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="产品名称" prop="planProductId"> | |||
<el-select v-model="form.planProductId" placeholder="请选择" disabled style="width: 100%;"> | |||
<el-option | |||
v-for="item in productList" | |||
:key="item.id" | |||
:label="item.name+' | '+item.specifications" | |||
<el-select v-model="form.planProductId" placeholder="请选择" disabled style="width: 100%;"> | |||
<el-option v-for="item in productList" :key="item.id" :label="item.name+' | '+item.specifications" | |||
:value="item.id"> | |||
<span style="float: left">{{ item.name }}</span> | |||
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.specifications }}</span> | |||
@@ -37,13 +31,8 @@ | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="计划开始时间"> | |||
<el-date-picker | |||
v-model="planStartTime" | |||
type="datetime" | |||
value-format="yyyy-MM-dd HH:mm:ss" | |||
style="width: 100%;" | |||
placeholder="选择日期" | |||
:disabled="isBind"> | |||
<el-date-picker v-model="planStartTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" | |||
style="width: 100%;" placeholder="选择日期" :disabled="isBind"> | |||
</el-date-picker> | |||
</el-form-item> | |||
</el-col> | |||
@@ -51,34 +40,27 @@ | |||
<el-row :gutter="20"> | |||
<el-col :span='6'> | |||
<el-form-item label="计划完成时间"> | |||
<el-date-picker | |||
v-model="planFinishTime" | |||
type="datetime" | |||
value-format="yyyy-MM-dd HH:mm:ss" | |||
style="width: 100%;" | |||
placeholder="选择日期" | |||
:disabled="isBind"> | |||
<el-date-picker v-model="planFinishTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" | |||
style="width: 100%;" placeholder="选择日期" :disabled="isBind"> | |||
</el-date-picker> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="计划投入数量" prop="planAssignQuantity"> | |||
<el-input-number v-model="form.planAssignQuantity" :min="0" :max="9999999999999" :disabled="isBind" style="width: 100%;"></el-input-number> | |||
<el-input-number v-model="form.planAssignQuantity" :min="0" :max="9999999999999" :disabled="isBind" | |||
style="width: 100%;"></el-input-number> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="计划生产数量" prop="planQuantity"> | |||
<el-input-number v-model="form.planQuantity" :min="0" :max="9999999999999" :disabled="isBind" style="width: 100%;"></el-input-number> | |||
<el-input-number v-model="form.planQuantity" :min="0" :max="9999999999999" :disabled="isBind" | |||
style="width: 100%;"></el-input-number> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="关联工艺" prop="processFlowId"> | |||
<el-select v-model="form.processFlowId" placeholder="请选择" disabled style="width: 100%;"> | |||
<el-option | |||
v-for="item in processFlowList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-option v-for="item in processFlowList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -96,10 +78,7 @@ | |||
<el-col :span='6'> | |||
<el-form-item label="优先级" prop="priority"> | |||
<el-select v-model="form.priority" placeholder="请选择" style="width: 100%;" :disabled="isBind"> | |||
<el-option | |||
v-for="item in getDictDatas(DICT_TYPE.ORDER_PRIORITY)" | |||
:key="item.value" | |||
:label="item.label" | |||
<el-option v-for="item in getDictDatas(DICT_TYPE.ORDER_PRIORITY)" :key="item.value" :label="item.label" | |||
:value="item.value"> | |||
</el-option> | |||
</el-select> | |||
@@ -108,11 +87,7 @@ | |||
<el-col :span='6'> | |||
<el-form-item label="工单类型" prop="type"> | |||
<el-select v-model="form.type" placeholder="请选择" style="width: 100%;" :disabled="isBind"> | |||
<el-option | |||
v-for="item in workOrderTypeList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-option v-for="item in workOrderTypeList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -120,11 +95,7 @@ | |||
<el-col :span='6'> | |||
<el-form-item label="关联产线" prop="productLineId"> | |||
<el-select v-model="form.productLineId" placeholder="请选择" multiple style="width: 100%;" :disabled="isBind"> | |||
<el-option | |||
v-for="item in productLineList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-option v-for="item in productLineList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -136,9 +107,18 @@ | |||
<el-input v-model="form.workers" :disabled="isBind"></el-input> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="负责部门" prop="deptId"> | |||
<el-select v-model="form.deptId" placeholder="请选择关联产线" style="width: 100%;"> | |||
<el-option v-for="item in deptList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="计划分配订单量" prop="planAssignmentQuantity"> | |||
<el-input-number v-model="form.planAssignmentQuantity" :min="0" :max="9999999999999" style="width: 100%;"></el-input-number> | |||
<el-input-number v-model="form.planAssignmentQuantity" :min="0" :max="9999999999999" style="width: 100%;"> | |||
</el-input-number> | |||
</el-form-item> | |||
</el-col> | |||
</el-row> | |||
@@ -148,6 +128,7 @@ | |||
import { getProductAll } from '@/api/base/product' | |||
import { getProcessFlowList, getWorkOrderCode, orderIssue, workOrderList, getWorkOrderById } from '@/api/base/orderManage' | |||
import { getLineAll } from '@/api/base/productionLine' | |||
import { listDept } from '@/api/system/dept'; | |||
import moment from 'moment' | |||
export default { | |||
name: 'AddWorkOrder', | |||
@@ -162,6 +143,7 @@ export default { | |||
planStartTime: '', | |||
planFinishTime: '', | |||
planAssignQuantity: 0, | |||
deptId:undefined, | |||
planQuantity: 0, | |||
processFlowId: '', | |||
materialMethod: 1, | |||
@@ -171,6 +153,7 @@ export default { | |||
workers: '', | |||
planAssignmentQuantity: '' | |||
}, | |||
deptList:[], | |||
rules: { | |||
name: [{ required: true, message: "工单名称不能为空", trigger: "blur" }], | |||
planProductId: [{ required: true, message: "产品名称不能为空", trigger: "change" }], | |||
@@ -209,6 +192,9 @@ export default { | |||
} | |||
}, | |||
getList() { | |||
listDept().then(res => { | |||
this.deptList = res.data || [] | |||
}) | |||
// 产品 | |||
getProductAll().then(res => { | |||
this.productList = res.data || [] | |||
@@ -254,11 +240,11 @@ export default { | |||
let name = this.form.name | |||
_this.$emit('addWorkOrderSubmit') | |||
// 询问是否添加预使用主原料 | |||
_this.$modal.confirm('是否添加预使用主原料信息?').then(function() { | |||
_this.$router.push({ | |||
path: '/core/core-work-order?workOrderName='+encodeURI(name) | |||
}) | |||
}) | |||
// _this.$modal.confirm('是否添加预使用主原料信息?').then(function() { | |||
// _this.$router.push({ | |||
// path: '/core/core-work-order?workOrderName='+encodeURI(name) | |||
// }) | |||
// }) | |||
} | |||
}) | |||
} | |||
@@ -0,0 +1,37 @@ | |||
<template> | |||
<div class="tableInner"> | |||
<el-input v-model="list[itemProp]" @blur="changeInput" /> | |||
</div> | |||
</template> | |||
<script> | |||
export default { | |||
name: 'InputArea', | |||
props: { | |||
injectData: { | |||
type: Object, | |||
default: () => ({}) | |||
}, | |||
itemProp: { | |||
type: String | |||
} | |||
}, | |||
data() { | |||
return { | |||
list: this.injectData | |||
} | |||
}, | |||
methods: { | |||
changeInput() { | |||
console.log(this.list) | |||
this.$emit('emitData', this.list) | |||
} | |||
} | |||
} | |||
</script> | |||
<style> | |||
.tableInner .el-input__inner { | |||
border: none; | |||
padding: 0; | |||
height: 33px; | |||
} | |||
</style> |
@@ -19,7 +19,7 @@ | |||
</el-col> | |||
<el-col :span='6'> | |||
<el-form-item label="产品名称" prop="planProductId"> | |||
<el-select v-model="form.planProductId" placeholder="请选择" style="width: 100%;" filterable> | |||
<el-select @change="getSpec" v-model="form.planProductId" placeholder="请选择" style="width: 100%;" filterable> | |||
<el-option v-for="item in productList" :key="item.id" :label="item.name+' | '+(item.specifications || '')" | |||
:value="item.id"> | |||
<span style="float: left">{{ item.name }}</span> | |||
@@ -64,6 +64,11 @@ | |||
<el-row :gutter="20"> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span='6'> | |||
<el-form-item label="产品规格" prop="specifications"> | |||
<el-input v-model="form.specifications"></el-input> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='12'> | |||
<el-form-item label="备注" prop="remark"> | |||
<el-input v-model="form.remark"></el-input> | |||
@@ -84,8 +89,10 @@ export default { | |||
id: '', | |||
name: '', | |||
code: '', | |||
grade:1, | |||
planQuantity: '', | |||
planProductId: '', | |||
specifications:undefined, | |||
price: '', | |||
customerId: '', | |||
priority: '', | |||
@@ -110,6 +117,14 @@ export default { | |||
} | |||
}, | |||
methods: { | |||
getSpec(val) { | |||
console.log(val) | |||
this.productList.forEach((ele) => { | |||
if (ele.id === val) { | |||
this.form.specifications = ele.specifications | |||
} | |||
}) | |||
}, | |||
init(id) { | |||
this.getList() | |||
if (id) { | |||
@@ -0,0 +1,37 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-09-06 14:44:06 | |||
* @LastEditTime: 2024-09-09 16:31:04 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<el-button @click="handleRoute" type="text"> {{ injectData.workOrderNum }} </el-button> | |||
</template> | |||
<script> | |||
import { orderAssignmentList } from '@/api/base/orderManage' | |||
export default { | |||
props: { | |||
injectData: { | |||
type: Object, | |||
default: () => ({}), | |||
}, | |||
}, | |||
methods: { | |||
async handleRoute() { | |||
const res = await orderAssignmentList({ orderIdList: [this.injectData.id] }) | |||
console.log(res.data); | |||
let arr = [] | |||
res.data[this.injectData.id].forEach((ele) => { | |||
arr.push(ele.workOrderId) | |||
}); | |||
let woIdString = arr.join(',') | |||
console.log(woIdString); | |||
this.$router.push({ | |||
path: '/produce/core-work-order-detail?woIdString=' + woIdString | |||
}) | |||
} | |||
}, | |||
}; | |||
</script> |
@@ -1,29 +1,102 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-08-01 16:27:30 | |||
* @LastEditTime: 2024-08-01 16:29:31 | |||
* @LastEditTime: 2024-09-04 15:56:53 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<el-form ref="orderAddForm" :rules="rules" label-width="130px" :model="form" label-position='top'> | |||
<el-row :gutter="20"> | |||
<el-col :span='6'> | |||
<el-form-item label="订单名称" prop="name"> | |||
<el-input v-model="form.name"></el-input> | |||
</el-form-item> | |||
</el-col> | |||
</el-row> | |||
<el-form ref="orderAddForm" :rules="rules" :model="form" :inline="true" class="demo-form-inline"> | |||
<!-- <el-row :gutter="20"> --> | |||
<!-- <el-col :span='6'> --> | |||
<el-form-item label="拆分数量" prop="attr3"> | |||
<el-input v-model.number="form.attr3" oninput="value=value.replace(/[^\d]/g,'')"></el-input> | |||
</el-form-item> | |||
<el-form-item> | |||
<el-button type="primary" @click="handleSplit">确定</el-button> | |||
</el-form-item> | |||
<!-- </el-col> --> | |||
<!-- </el-row> --> | |||
<base-table :table-props="tableProps" :table-data="list" :max-height="tableH"> | |||
<!-- <method-btn v-if="tableBtn.length" slot="handleBtn" :width="240" label="操作" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> --> | |||
</base-table> | |||
</el-form> | |||
</template> | |||
<script> | |||
import { getOrderCode, getOrderById, getProcessFlowList, orderUpdate, orderCreate } from '@/api/base/orderManage' | |||
import { getProductAll } from '@/api/base/product' | |||
import { getCustomerList } from '@/api/base/customer' | |||
import { getOrderCode, getOrderById, getProcessFlowList, orderUpdate, orderCreate, orderSplit } from '@/api/base/orderManage' | |||
import { parseTime } from '@/utils/ruoyi' | |||
import inputArea from './inputArea.vue' | |||
const tableProps = [ | |||
{ | |||
prop: 'name', | |||
label: '订单名称', | |||
minWidth: 120, | |||
showOverflowtooltip: true, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'code', | |||
label: '订单编码', | |||
minWidth: 180, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'productName', | |||
label: '产品', | |||
showOverflowtooltip: true, | |||
subcomponent: inputArea | |||
}, | |||
// { | |||
// prop: 'priority', | |||
// label: '优先级', | |||
// filter: publicFormatter('order_priority') | |||
// }, | |||
{ | |||
prop: 'planQuantity', | |||
label: '计划加工量', | |||
width: 100, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'deliveTime', | |||
label: '交货日期', | |||
filter: parseTime, | |||
minWidth: 160, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'customerId', | |||
label: '客户', | |||
showOverflowtooltip: true, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'price', | |||
label: '单价', | |||
width: 100, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'packSpec', | |||
label: '包装规格', | |||
width: 100, | |||
subcomponent: inputArea | |||
}, | |||
{ | |||
prop: 'remark', | |||
label: '备注', | |||
width: 100, | |||
subcomponent: inputArea | |||
}, | |||
] | |||
export default { | |||
name: 'OrderAdd', | |||
data() { | |||
return { | |||
tableProps, | |||
list: [], | |||
tableH: this.tableHeight(260), | |||
form: { | |||
id: '', | |||
name: '', | |||
@@ -32,6 +105,7 @@ export default { | |||
planProductId: '', | |||
price: '', | |||
customerId: '', | |||
attr3:undefined, | |||
priority: '', | |||
packSpec: '', | |||
workers: '', | |||
@@ -42,10 +116,7 @@ export default { | |||
planStartTime: '', | |||
}, | |||
rules: { | |||
name: [{ required: true, message: "订单名称不能为空", trigger: "blur" }], | |||
code: [{ required: true, message: "订单号不能为空", trigger: "blur" }], | |||
planQuantity: [{ required: true, message: "计划加工数量不能为空", trigger: "blur" }], | |||
planProductId: [{ required: true, message: "产品名称不能为空", trigger: "change" }] | |||
attr3: [{ required: true, message: "拆分数量不能为空", trigger: "blur" }], | |||
}, | |||
productList: [], | |||
customerList: [], | |||
@@ -53,114 +124,133 @@ export default { | |||
isEdit: false //是否是编辑 | |||
} | |||
}, | |||
created () { | |||
window.addEventListener('resize', () => { | |||
this.tableH = this.tableHeight(260) | |||
}) | |||
}, | |||
methods: { | |||
init(id) { | |||
this.getList() | |||
if (id) { | |||
this.isEdit = true | |||
this.form.id = id | |||
getOrderById({id: this.form.id}).then(res => { | |||
if (res.code === 0) { | |||
this.form.name = res.data.name | |||
this.form.code = res.data.code | |||
this.form.planQuantity = res.data.planQuantity | |||
this.form.planProductId = res.data.planProductId | |||
this.form.price = res.data.price | |||
this.form.customerId = res.data.customerId | |||
this.form.priority = res.data.priority ? res.data.priority + '' : '' | |||
this.form.planStartTime = res.data.planStartTime ? res.data.planStartTime : null | |||
this.form.packSpec = res.data.packSpec ? res.data.packSpec+'' : '' | |||
this.form.workers = res.data.workers | |||
this.form.processFlowId = res.data.processFlowId | |||
this.form.materialMethod = res.data.materialMethod | |||
this.form.planFinishTime = res.data.planFinishTime ? res.data.planFinishTime : null | |||
this.form.remark = res.data.remark | |||
// this.form.description = res.data.description | |||
} | |||
}) | |||
} else { | |||
this.isEdit = false | |||
this.form.id = '' | |||
// 订单号 | |||
getOrderCode().then(res => { | |||
this.form.code = res.data || '' | |||
}) | |||
handleSplit() { | |||
let obj = { | |||
attr3: this.form.attr3, | |||
id:this.form.id | |||
} | |||
}, | |||
getList() { | |||
// 产品 | |||
getProductAll().then(res => { | |||
this.productList = res.data || [] | |||
}) | |||
// 客户 | |||
getCustomerList().then(res => { | |||
this.customerList = res.data || [] | |||
}) | |||
// 工艺 | |||
getProcessFlowList().then(res => { | |||
this.processFlowList = res.data || [] | |||
orderSplit(obj).then((res) => { | |||
this.list = res.data | |||
}) | |||
}, | |||
timeChange() { | |||
if (this.form.planStartTime && this.form.planFinishTime) { | |||
if (this.form.planStartTime > this.form.planFinishTime) { | |||
this.$modal.msgError('计划开始时间不能大于结束时间') | |||
} | |||
} | |||
}, | |||
// 工艺变更 | |||
materialMethodChange(val) { | |||
if (val === 2 && !this.form.processFlowId) { | |||
this.form.materialMethod = 1 | |||
this.$modal.msgError("请先选择关联工艺"); | |||
} | |||
}, | |||
// 工艺变更 | |||
processFlowIdChange(val) { | |||
console.log(val) | |||
if (!val) { | |||
this.form.materialMethod = 1 | |||
} | |||
init(obj) { | |||
// this.getList() | |||
// if (obj) { | |||
this.isEdit = true | |||
this.form = {} | |||
this.list = [] | |||
this.form.id = obj.id | |||
// getOrderById({id: this.form.id}).then(res => { | |||
// if (res.code === 0) { | |||
// this.form.name = res.data.name | |||
// this.form.code = res.data.code | |||
// this.form.planQuantity = res.data.planQuantity | |||
// this.form.planProductId = res.data.planProductId | |||
// this.form.price = res.data.price | |||
// this.form.customerId = res.data.customerId | |||
// this.form.priority = res.data.priority ? res.data.priority + '' : '' | |||
// this.form.planStartTime = res.data.planStartTime ? res.data.planStartTime : null | |||
// this.form.packSpec = res.data.packSpec ? res.data.packSpec+'' : '' | |||
// this.form.workers = res.data.workers | |||
// this.form.processFlowId = res.data.processFlowId | |||
// this.form.materialMethod = res.data.materialMethod | |||
// this.form.planFinishTime = res.data.planFinishTime ? res.data.planFinishTime : null | |||
// this.form.remark = res.data.remark | |||
// // this.form.description = res.data.description | |||
// } | |||
// }) | |||
// } else { | |||
// this.isEdit = false | |||
// this.form.id = '' | |||
// // 订单号 | |||
// getOrderCode().then(res => { | |||
// this.form.code = res.data || '' | |||
// }) | |||
// } | |||
}, | |||
// getList() { | |||
// // 产品 | |||
// getProductAll().then(res => { | |||
// this.productList = res.data || [] | |||
// }) | |||
// // 客户 | |||
// getCustomerList().then(res => { | |||
// this.customerList = res.data || [] | |||
// }) | |||
// // 工艺 | |||
// getProcessFlowList().then(res => { | |||
// this.processFlowList = res.data || [] | |||
// }) | |||
// }, | |||
// timeChange() { | |||
// if (this.form.planStartTime && this.form.planFinishTime) { | |||
// if (this.form.planStartTime > this.form.planFinishTime) { | |||
// this.$modal.msgError('计划开始时间不能大于结束时间') | |||
// } | |||
// } | |||
// }, | |||
// // 工艺变更 | |||
// materialMethodChange(val) { | |||
// if (val === 2 && !this.form.processFlowId) { | |||
// this.form.materialMethod = 1 | |||
// this.$modal.msgError("请先选择关联工艺"); | |||
// } | |||
// }, | |||
// // 工艺变更 | |||
// processFlowIdChange(val) { | |||
// console.log(val) | |||
// if (!val) { | |||
// this.form.materialMethod = 1 | |||
// } | |||
// }, | |||
submitForm() { | |||
this.$refs['orderAddForm'].validate((valid) => { | |||
if (valid) { | |||
if (this.form.planStartTime && this.form.planFinishTime) { | |||
if (this.form.planStartTime > this.form.planFinishTime) { | |||
this.$modal.msgError('计划开始时间不能大于结束时间') | |||
return false | |||
} | |||
} | |||
// console.log(this.form) | |||
if (this.isEdit) { | |||
//编辑 | |||
orderUpdate({ ...this.form }).then((res) => { | |||
if (res.code === 0) { | |||
this.$modal.msgSuccess("操作成功"); | |||
this.$emit('successSubmit') | |||
} | |||
}) | |||
} else { | |||
this.form.status = 1 | |||
this.form.triggerOrigin = 1 | |||
orderCreate({ ...this.form }).then((res) => { | |||
if (res.code === 0) { | |||
this.$modal.msgSuccess("操作成功"); | |||
this.$emit('successSubmit') | |||
} | |||
}) | |||
} | |||
} else { | |||
return false | |||
} | |||
}) | |||
Promise.all(this.list.map((ele) => { | |||
return orderCreate(ele); | |||
})).then((res) => { | |||
this.$modal.msgSuccess("操作成功"); | |||
this.$emit('splitWorkOrderSubmit'); | |||
}); | |||
// this.$refs['orderAddForm'].validate((valid) => { | |||
// if (valid) { | |||
// if (this.form.planStartTime && this.form.planFinishTime) { | |||
// if (this.form.planStartTime > this.form.planFinishTime) { | |||
// this.$modal.msgError('计划开始时间不能大于结束时间') | |||
// return false | |||
// } | |||
// } | |||
// // console.log(this.form) | |||
// if (this.isEdit) { | |||
// //编辑 | |||
// orderUpdate({ ...this.form }).then((res) => { | |||
// if (res.code === 0) { | |||
// this.$modal.msgSuccess("操作成功"); | |||
// this.$emit('successSubmit') | |||
// } | |||
// }) | |||
// } else { | |||
// this.form.status = 1 | |||
// this.form.triggerOrigin = 1 | |||
// orderCreate({ ...this.form }).then((res) => { | |||
// if (res.code === 0) { | |||
// this.$modal.msgSuccess("操作成功"); | |||
// this.$emit('successSubmit') | |||
// } | |||
// }) | |||
// } | |||
// } else { | |||
// return false | |||
// } | |||
// }) | |||
}, | |||
formClear() { | |||
this.$refs.orderAddForm.resetFields() | |||
this.form.materialMethod = 1 | |||
this.form.price = 0.00 | |||
this.form.planQuantity = 0 | |||
this.isEdit = false | |||
} | |||
} | |||
} | |||
@@ -1,64 +1,40 @@ | |||
<template> | |||
<div class="app-container"> | |||
<!-- 搜索工作栏 --> | |||
<search-bar | |||
:formConfigs="formConfig" | |||
ref="searchBarForm" | |||
@headBtnClick="buttonClick" | |||
/> | |||
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> | |||
<!-- 列表 --> | |||
<base-table | |||
:page="queryParams.pageNo" | |||
:limit="queryParams.pageSize" | |||
:table-props="tableProps" | |||
:table-data="list" | |||
:max-height="tableH" | |||
> | |||
<method-btn | |||
v-if="tableBtn.length" | |||
slot="handleBtn" | |||
:width="240" | |||
label="操作" | |||
:method-list="tableBtn" | |||
@clickBtn="handleClick" | |||
/> | |||
<base-table ref="table" @row-click="handleRowClick" row-key="id" | |||
:tree-props="{ children: 'children'}" | |||
:page="queryParams.pageNo" :limit="queryParams.pageSize" :table-props="tableProps" :table-data="list" | |||
:max-height="tableH"> | |||
<method-btn v-if="tableBtn.length" slot="handleBtn" :width="240" label="操作" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
<pagination | |||
:page.sync="queryParams.pageNo" | |||
:limit.sync="queryParams.pageSize" | |||
:total="total" | |||
@pagination="getList" | |||
/> | |||
<pagination :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize" :total="total" | |||
@pagination="getList" /> | |||
<!-- 新增&编辑 --> | |||
<base-dialog | |||
:dialogTitle="addOrEditTitle" | |||
:dialogVisible="centervisible" | |||
@cancel="handleCancel" | |||
@confirm="handleConfirm" | |||
:before-close="handleCancel" | |||
width='60%' | |||
> | |||
<base-dialog :dialogTitle="addOrEditTitle" :dialogVisible="centervisible" @cancel="handleCancel" | |||
@confirm="handleConfirm" :before-close="handleCancel" width='60%'> | |||
<order-add ref="orderAdd" @successSubmit="successSubmit" /> | |||
</base-dialog> | |||
<!-- 查看详情 --> | |||
<!-- 新增工单 --> | |||
<base-dialog | |||
:dialogTitle="workIssueTitle" | |||
:dialogVisible="addWorkOrdervisible" | |||
@cancel="addWorkOrderCancel" | |||
@confirm="addWorkOrderConfirm" | |||
:before-close="addWorkOrderCancel" | |||
width='70%' | |||
> | |||
<base-dialog :dialogTitle="workIssueTitle" :dialogVisible="addWorkOrdervisible" @cancel="addWorkOrderCancel" | |||
@confirm="addWorkOrderConfirm" :before-close="addWorkOrderCancel" width='70%'> | |||
<add-work-order ref="addWorkOrder" @addWorkOrderSubmit="addWorkOrderSubmit" /> | |||
</base-dialog> | |||
<base-dialog :dialogTitle="splitTitle" :dialogVisible="splitWorkOrdervisible" @cancel="splitWorkOrderCancel" | |||
@confirm="splitWorkOrderConfirm" :before-close="splitWorkOrderCancel" width='70%'> | |||
<order-split ref="splitWorkOrder" @splitWorkOrderSubmit="splitWorkOrderSubmit" /> | |||
</base-dialog> | |||
</div> | |||
</template> | |||
<script> | |||
import { parseTime } from '@/utils/ruoyi' | |||
import { getOrderPage, orderDelete, customerList, orderFinish, orderVoid } from '@/api/base/orderManage' | |||
import { getOrderPage, orderDelete, customerList, orderFinish, orderVoid, orderStop } from '@/api/base/orderManage' | |||
import OrderAdd from './components/orderAdd' | |||
import orderSplit from './components/orderSplit' | |||
import orderNum from './components/orderNum.vue' | |||
import AddWorkOrder from './components/addWorkOrder' | |||
import { publicFormatter } from '@/utils/dict' | |||
@@ -123,7 +99,8 @@ const tableProps = [ | |||
}, | |||
{ | |||
prop: 'workOrderNum', | |||
label: '工单数量' | |||
label: '工单数量', | |||
subcomponent: orderNum, | |||
} | |||
] | |||
export default { | |||
@@ -175,6 +152,8 @@ export default { | |||
plain: true | |||
} | |||
], | |||
splitTitle: '拆分订单', | |||
splitWorkOrdervisible:false, | |||
// 查询参数 | |||
queryParams: { | |||
pageNo: 1, | |||
@@ -328,17 +307,34 @@ export default { | |||
] | |||
} | |||
} | |||
: undefined, | |||
this.$auth.hasPermi('base:order-manage:stop') | |||
? { | |||
type: 'stop', | |||
btnName: '终止', | |||
// showParam: { | |||
// type: '&', | |||
// data: [ | |||
// { | |||
// type: 'equal', | |||
// name: 'status', | |||
// value: 1 | |||
// } | |||
// ] | |||
// } | |||
} | |||
: undefined | |||
].filter((v) => v), | |||
addOrEditTitle: '', | |||
centervisible: false, | |||
expandedRowKeys:[], | |||
priorityList: this.getDictDatas(this.DICT_TYPE.ORDER_PRIORITY), | |||
workIssueTitle: '', | |||
addWorkOrdervisible: false, | |||
orderDetailVisible: false | |||
} | |||
}, | |||
components: { OrderAdd, AddWorkOrder }, | |||
components: { OrderAdd, AddWorkOrder,orderSplit }, | |||
created() { | |||
window.addEventListener('resize', () => { | |||
this.tableH = this.tableHeight(260) | |||
@@ -346,11 +342,38 @@ export default { | |||
this.getList() | |||
}, | |||
methods: { | |||
async handleRowClick(row) { | |||
console.log(row) | |||
if (!row.children) { | |||
const queryParams = { | |||
pageNo: this.queryParams.pageNo, | |||
pageSize: this.queryParams.pageSize, | |||
name: this.queryParams.name, | |||
status: this.queryParams.status, | |||
lastIssuedTime: this.queryParams.lastIssuedTime, | |||
parentId: row.id | |||
} | |||
const response = await getOrderPage(queryParams) | |||
// row.children = response.data.records | |||
this.list.forEach((ele) => { | |||
if (ele.id === row.id) { | |||
this.$set(this.list[row._pageIndex-1], 'children', response.data.records); // 展开该行 | |||
} | |||
}) | |||
row.hasChildren = true; | |||
this.$set(row, 'expanded', true); // 展开该行 | |||
} else { | |||
row.expanded = !row.expanded; // 切换展开/折叠状态 | |||
} | |||
// this.$nextTick(() => { | |||
// const tableInstance = this.$refs.table.getTableRef(); | |||
// tableInstance.toggleRowExpansion(row); | |||
// }) | |||
}, | |||
getList() { | |||
getOrderPage({...this.queryParams}).then(res => { | |||
let arr = res.data.records || [] | |||
this.total = res.data.total || 0 | |||
console.log(11111); | |||
// if (arr.length > 0) { | |||
// customerList().then(result => { | |||
// let tempData = result.data || [] | |||
@@ -405,7 +428,7 @@ export default { | |||
this.handleDelete(val.data) | |||
break | |||
case 'detail': | |||
this.$router.push({path: '/order/base/order-manage/order-detail-data?orderId='+ val.data.id}) | |||
this.$router.push({path: 'order-detail-data?orderId='+ val.data.id}) | |||
break | |||
case 'add': | |||
this.workIssueTitle = '新增工单' | |||
@@ -419,6 +442,16 @@ export default { | |||
console.log(res) | |||
}) | |||
break | |||
case 'split': | |||
this.splitTitle = '拆分订单' | |||
this.splitWorkOrdervisible = true | |||
this.$nextTick(() => { | |||
this.$refs.splitWorkOrder.init(val.data) | |||
}) | |||
// orderVoid({ id: val.data.id }).then((res) => { | |||
// console.log(res) | |||
// }) | |||
break | |||
case 'bind': | |||
this.workIssueTitle = '绑定工单' | |||
this.addWorkOrdervisible = true | |||
@@ -429,6 +462,11 @@ export default { | |||
case 'complete': | |||
this.handleComplete(val.data) | |||
break | |||
case 'stop': | |||
orderStop({ id: val.data.id }).then((res) => { | |||
this.getList() | |||
}) | |||
break | |||
default: | |||
} | |||
}, | |||
@@ -474,6 +512,17 @@ export default { | |||
addWorkOrderSubmit() { | |||
this.addWorkOrderCancel() | |||
this.getList() | |||
}, | |||
splitWorkOrderCancel() { | |||
this.$refs.splitWorkOrder.formClear() | |||
this.splitWorkOrdervisible = false | |||
}, | |||
splitWorkOrderConfirm() { | |||
this.$refs.splitWorkOrder.submitForm() | |||
}, | |||
splitWorkOrderSubmit() { | |||
this.splitWorkOrderCancel() | |||
this.getList() | |||
} | |||
// bindWorkOrderCancel() { | |||
// this.$refs.bindWorkOrder.formClear() | |||
@@ -5,7 +5,9 @@ | |||
<span class="blueTitle"></span> | |||
<span>订单编码: {{orderMsg.code}}</span> | |||
</div> | |||
<el-button type="primary" plain size="small" style="float: right;" @click="returnOrderManage"><svg-icon icon-class="return"/> 返回</el-button> | |||
<el-button type="primary" plain size="small" style="float: right;" @click="returnOrderManage"> | |||
<svg-icon icon-class="return" /> 返回 | |||
</el-button> | |||
<div style="padding-left: 14px;"> | |||
<el-row> | |||
<el-col :span='3'> | |||
@@ -28,10 +30,11 @@ | |||
<div class="blodTip">包装规格</div> | |||
<div class="lightTip">{{ getDictDataLabel(DICT_TYPE.PACK_SPEC, orderMsg.packSpec)}}</div> | |||
</el-col> | |||
<el-col :span='3'> | |||
<!-- <el-col :span='3'> | |||
<div class="blodTip">物料计算方式</div> | |||
<div class="lightTip">{{orderMsg.materialMethod ? (orderMsg.materialMethod === 1 ? '产品基础' : '工艺扩展') : ''}}</div> | |||
</el-col> | |||
<div class="lightTip">{{orderMsg.materialMethod ? (orderMsg.materialMethod === 1 ? '产品基础' : '工艺扩展') : ''}} | |||
</div> | |||
</el-col> --> | |||
<el-col :span='3'> | |||
<div class="blodTip">创建时间</div> | |||
<div class="lightTip">{{ parseTime(orderMsg.createTime) }}</div> | |||
@@ -72,7 +75,7 @@ | |||
</el-col> | |||
<el-col :span='3'> | |||
<div class="blodTip">实际生产数量</div> | |||
<div class="lightTip">{{orderMsg.actualQuantity }}</div> | |||
<div class="lightTip">{{orderMsg.actualQuantity }}</div> | |||
</el-col> | |||
</el-row> | |||
<el-row> | |||
@@ -88,40 +91,34 @@ | |||
<div class="blodTip">负责人</div> | |||
<div class="lightTip">{{orderMsg.workers}}</div> | |||
</el-col> | |||
<el-col :span='3'> | |||
<!-- <el-col :span='3'> | |||
<div class="blodTip">关联工艺</div> | |||
<div class="lightTip">{{processFlowName}}</div> | |||
</el-col> | |||
</el-col> --> | |||
</el-row> | |||
</div> | |||
</div> | |||
<div class="box2"> | |||
<div class="boxTitle"> | |||
<!-- <div class="boxTitle"> | |||
<span class="blueTitle"></span> | |||
<span>工单信息</span> | |||
</div> --> | |||
<div class="toggleTabBox"> | |||
<div :class="{ active: activeModule === 'orderInfo' }" @click="toggleTab('orderInfo')">子订单信息</div> | |||
<!-- <div :class="{ active: activeModule === 'useInfo' }" @click="toggleTab('useInfo')">用料信息</div> --> | |||
</div> | |||
<!-- 列表 --> | |||
<base-table | |||
:page="queryParams.pageNo" | |||
:limit="queryParams.pageSize" | |||
:table-props="tableProps1" | |||
:table-data="list1" | |||
:max-height="tableH" | |||
/> | |||
</div> | |||
<div class="box3"> | |||
<div class="boxTitle"> | |||
<span class="blueTitle"></span> | |||
<span>预计用料信息</span> | |||
</div> | |||
<!-- 列表 --> | |||
<base-table | |||
:page="queryParams.pageNo" | |||
:limit="queryParams.pageSize" | |||
:table-props="tableProps2" | |||
:table-data="list2" | |||
:max-height="tableH" | |||
/> | |||
<el-row v-show="activeModule === 'orderInfo'"> | |||
<el-col :span="6"> | |||
<el-tree :data="treeData" :props="defaultProps" @node-click="handleNodeClick"></el-tree> | |||
</el-col> | |||
<el-col :span="18"> | |||
<base-table :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-props="tableProps1" | |||
:table-data="list1" :max-height="tableH" /> | |||
</el-col> | |||
</el-row> | |||
<!-- <base-table v-show="activeModule === 'useInfo'" :page="queryParams.pageNo" :limit="queryParams.pageSize" | |||
:table-props="tableProps2" :table-data="list2" :max-height="tableH" /> --> | |||
</div> | |||
</div> | |||
</template> | |||
@@ -129,6 +126,7 @@ | |||
import { parseTime } from '@/utils/ruoyi' | |||
import { publicFormatter } from '@/utils/dict' | |||
import { getProcessFlowList } from '@/api/base/orderManage' | |||
import { orderDetail, bomUseNum, getDetailTree, getDetailTreeInfo } from '@/api/base/orderManage' | |||
const tableProps1 = [ | |||
{ | |||
prop: 'issueTime', | |||
@@ -209,13 +207,14 @@ const tableProps2 = [ | |||
label: '剩余生产预计消耗' | |||
} | |||
] | |||
import { orderDetail, bomUseNum } from '@/api/base/orderManage' | |||
export default { | |||
name: 'OrderDetailData', | |||
data() { | |||
return { | |||
orderId: '', | |||
tableProps1, | |||
treeData:undefined, | |||
activeModule:'orderInfo', | |||
tableProps2, | |||
list1: [], | |||
list2: [], | |||
@@ -225,6 +224,10 @@ export default { | |||
pageNo: 1, | |||
pageSize: 500 | |||
}, | |||
defaultProps: { | |||
children: 'children', | |||
label: 'name' | |||
}, | |||
orderMsg: {}, | |||
processFlowName: '' | |||
} | |||
@@ -240,6 +243,18 @@ export default { | |||
$route: 'initData' | |||
}, | |||
methods: { | |||
toggleTab(val) { | |||
this.activeModule = val | |||
}, | |||
handleNodeClick(val) { | |||
console.log(val) | |||
getDetailTreeInfo({ | |||
id: val.id | |||
}).then(res => { | |||
this.list1 = res.data.order | |||
console.log(res) | |||
}) | |||
}, | |||
initData(to) { | |||
if (to.name === 'OrderDetailData') { | |||
this.orderId = location.href.split('?')[1].split('=')[1] | |||
@@ -268,6 +283,12 @@ export default { | |||
this.list2 = [] | |||
} | |||
}) | |||
getDetailTree({ | |||
id: this.orderId | |||
}).then(res => { | |||
console.log(res) | |||
this.treeData =res.data | |||
}) | |||
// 工艺 | |||
getProcessFlowList().then(res => { | |||
let arr = res.data || [] | |||
@@ -283,7 +304,7 @@ export default { | |||
}, | |||
// 返回 | |||
returnOrderManage() { | |||
this.$router.push({path: '/order/base/order-manage'}) | |||
this.$router.go(-1); | |||
} | |||
} | |||
} | |||
@@ -296,9 +317,23 @@ export default { | |||
border-radius: 9px; | |||
} | |||
.box2 { | |||
height: calc((100vh - 360px) / 2); | |||
height: calc((100vh - 360px)); | |||
padding: 12px 16px 0; | |||
margin: 8px 0; | |||
.toggleTabBox { | |||
display: inline-block; | |||
div { | |||
display: inline-block; | |||
padding: 0 8px 4px; | |||
color: rgba(102, 102, 102, 0.5); | |||
border-bottom: 2px solid rgba(242, 244, 249, 1); | |||
cursor: pointer; | |||
} | |||
.active { | |||
color: rgba(0, 0, 0, 0.85); | |||
border-bottom-color: #0B58FF; | |||
} | |||
} | |||
} | |||
.box1 { | |||
height: 215px; | |||
@@ -318,26 +353,5 @@ export default { | |||
margin-bottom: 12px; | |||
} | |||
} | |||
.box3 { | |||
padding: 16px; | |||
height: calc((100vh - 360px) / 2); | |||
} | |||
.boxTitle { | |||
display: inline-block; | |||
font-size: 16px; | |||
font-weight: 400; | |||
color: #000000; | |||
margin:0 10px 20px 0; | |||
} | |||
.blueTitle { | |||
content: ''; | |||
display: inline-block; | |||
width: 4px; | |||
height: 18px; | |||
background-color: #0B58FF; | |||
border-radius: 1px; | |||
margin-right: 8px; | |||
vertical-align: bottom; | |||
} | |||
} | |||
</style> | |||
</style> |
@@ -174,40 +174,40 @@ export default { | |||
} | |||
} | |||
: undefined, | |||
this.$auth.hasPermi('base:order-completion-monitoring:qualityDet') | |||
? { | |||
type: 'qualityDetail', | |||
btnName: '质量', | |||
showTip: '质量详情', | |||
showParam: { | |||
type: '&', | |||
data: [ | |||
{ | |||
type: 'more', | |||
name: 'workOrderNum', | |||
value: 1 | |||
} | |||
] | |||
} | |||
} | |||
: undefined, | |||
this.$auth.hasPermi('base:order-completion-monitoring:sendOut') | |||
? { | |||
type: 'sendOutDetail', | |||
btnName: '发货', | |||
showTip: '发货详情', | |||
showParam: { | |||
type: '&', | |||
data: [ | |||
{ | |||
type: 'more', | |||
name: 'workOrderNum', | |||
value: 1 | |||
} | |||
] | |||
} | |||
} | |||
: undefined | |||
// this.$auth.hasPermi('base:order-completion-monitoring:qualityDet') | |||
// ? { | |||
// type: 'qualityDetail', | |||
// btnName: '质量', | |||
// showTip: '质量详情', | |||
// showParam: { | |||
// type: '&', | |||
// data: [ | |||
// { | |||
// type: 'more', | |||
// name: 'workOrderNum', | |||
// value: 1 | |||
// } | |||
// ] | |||
// } | |||
// } | |||
// : undefined, | |||
// this.$auth.hasPermi('base:order-completion-monitoring:sendOut') | |||
// ? { | |||
// type: 'sendOutDetail', | |||
// btnName: '发货', | |||
// showTip: '发货详情', | |||
// showParam: { | |||
// type: '&', | |||
// data: [ | |||
// { | |||
// type: 'more', | |||
// name: 'workOrderNum', | |||
// value: 1 | |||
// } | |||
// ] | |||
// } | |||
// } | |||
// : undefined | |||
].filter((v) => v), | |||
chartList: [] | |||
} | |||
@@ -297,7 +297,7 @@ export default { | |||
switch (val.type) { | |||
case 'orderDetail': | |||
this.$router.push({ | |||
path: '/core/core-work-order-detail?woIdString='+val.data.woIdString | |||
path: '/produce/core-work-order-detail?woIdString='+val.data.woIdString | |||
}) | |||
break | |||
case 'qualityDetail': | |||
@@ -368,4 +368,4 @@ export default { | |||
vertical-align: bottom; | |||
} | |||
} | |||
</style> | |||
</style> |
@@ -13,12 +13,9 @@ | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="产品名称" prop="planProductId"> | |||
<el-select v-model="dataForm.planProductId" placeholder="请选择产品" style="width: 100%;" filterable @change="selectProduct"> | |||
<el-option | |||
v-for="item in productList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-select v-model="dataForm.planProductId" placeholder="请选择产品" style="width: 100%;" filterable | |||
@change="selectProduct"> | |||
<el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -32,23 +29,15 @@ | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="计划开始时间"> | |||
<el-date-picker | |||
v-model="dataForm.planStartTime" | |||
type="datetime" | |||
value-format="timestamp" | |||
style="width: 100%;" | |||
<el-date-picker v-model="dataForm.planStartTime" type="datetime" value-format="timestamp" style="width: 100%;" | |||
placeholder="请选择计划开始时间"> | |||
</el-date-picker> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="计划完成时间"> | |||
<el-date-picker | |||
v-model="dataForm.planFinishTime" | |||
type="datetime" | |||
value-format="timestamp" | |||
style="width: 100%;" | |||
placeholder="请选择计划完成时间"> | |||
<el-date-picker v-model="dataForm.planFinishTime" type="datetime" value-format="timestamp" | |||
style="width: 100%;" placeholder="请选择计划完成时间"> | |||
</el-date-picker> | |||
</el-form-item> | |||
</el-col> | |||
@@ -56,22 +45,21 @@ | |||
<el-row :gutter="20"> | |||
<el-col :span='8'> | |||
<el-form-item label="计划投入数量" prop="planAssignQuantity"> | |||
<el-input-number v-model="dataForm.planAssignQuantity" :min="0" :max="9999999999999" style="width: 100%;" placeholder="请输入计划投入数量"></el-input-number> | |||
<el-input-number v-model="dataForm.planAssignQuantity" :min="0" :max="9999999999999" style="width: 100%;" | |||
placeholder="请输入计划投入数量"></el-input-number> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="计划生产数量" prop="planQuantity"> | |||
<el-input-number v-model="dataForm.planQuantity" :min="0" :max="9999999999999" style="width: 100%;" placeholder="请输入计划生产数量"></el-input-number> | |||
<el-input-number v-model="dataForm.planQuantity" :min="0" :max="9999999999999" style="width: 100%;" | |||
placeholder="请输入计划生产数量"></el-input-number> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="关联工艺" prop="processFlowId"> | |||
<el-select v-model="dataForm.processFlowId" placeholder="请选择关联工艺" clearable filterable style="width: 100%;" @change="processFlowIdChange"> | |||
<el-option | |||
v-for="item in processFlowList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-select v-model="dataForm.processFlowId" placeholder="请选择关联工艺" clearable filterable style="width: 100%;" | |||
@change="processFlowIdChange"> | |||
<el-option v-for="item in processFlowList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -84,7 +72,8 @@ | |||
<el-radio :label="1">产品基础BOM</el-radio> | |||
<el-radio :label="2">工艺扩展BOM</el-radio> | |||
</el-radio-group> --> | |||
<el-select v-model="dataForm.materialMethod" placeholder="请选择物料计算方式" style="width: 100%;" @change="materialMethodChange"> | |||
<el-select v-model="dataForm.materialMethod" placeholder="请选择物料计算方式" style="width: 100%;" | |||
@change="materialMethodChange"> | |||
<el-option key="1" label="产品基础BOM" :value="1" /> | |||
<el-option key="2" label="工艺扩展BOM" :value="2" /> | |||
</el-select> | |||
@@ -93,10 +82,7 @@ | |||
<el-col :span='8'> | |||
<el-form-item label="优先级" prop="priority"> | |||
<el-select v-model="dataForm.priority" placeholder="请选择优先级" style="width: 100%;"> | |||
<el-option | |||
v-for="item in getDictDatas(DICT_TYPE.ORDER_PRIORITY)" | |||
:key="item.value" | |||
:label="item.label" | |||
<el-option v-for="item in getDictDatas(DICT_TYPE.ORDER_PRIORITY)" :key="item.value" :label="item.label" | |||
:value="item.value"> | |||
</el-option> | |||
</el-select> | |||
@@ -105,11 +91,7 @@ | |||
<el-col :span='8'> | |||
<el-form-item label="工单类型" prop="type"> | |||
<el-select v-model="dataForm.type" placeholder="请选择工单类型" style="width: 100%;"> | |||
<el-option | |||
v-for="item in workOrderTypeList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-option v-for="item in workOrderTypeList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -119,11 +101,15 @@ | |||
<el-col :span='8'> | |||
<el-form-item label="关联产线" prop="productLineIds"> | |||
<el-select v-model="dataForm.productLineIds" placeholder="请选择关联产线" multiple style="width: 100%;"> | |||
<el-option | |||
v-for="item in productLineList" | |||
:key="item.id" | |||
:label="item.name" | |||
:value="item.id"> | |||
<el-option v-for="item in productLineList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
</el-col> | |||
<el-col :span='8'> | |||
<el-form-item label="负责部门" prop="deptId"> | |||
<el-select v-model="dataForm.deptId" placeholder="请选择关联产线" style="width: 100%;"> | |||
<el-option v-for="item in deptList" :key="item.id" :label="item.name" :value="item.id"> | |||
</el-option> | |||
</el-select> | |||
</el-form-item> | |||
@@ -149,7 +135,7 @@ import { getProcessFlowList, workOrderList } from '@/api/base/orderManage' | |||
import { createCoreWO, updateCoreWO, getCode, getCoreWO } from '@/api/base/coreWorkOrder' | |||
import { getLineAll } from '@/api/base/productionLine' | |||
import basicAdd from '../../core/mixins/basic-add'; | |||
import { listDept } from '@/api/system/dept'; | |||
export default { | |||
name: 'AddWorkOrder', | |||
mixins: [basicAdd], | |||
@@ -167,6 +153,7 @@ export default { | |||
workOrderId: '', | |||
name: '', | |||
code: '', | |||
deptId:undefined, | |||
planProductId: '', | |||
specifications: '', | |||
planStartTime: '', | |||
@@ -192,6 +179,7 @@ export default { | |||
productList: [], | |||
processFlowList: [], | |||
productLineList: [], | |||
deptList:[], | |||
workOrderTypeList: [ | |||
{id: 1,name:'普通'}, | |||
{id: 2, name:'特殊'} | |||
@@ -236,7 +224,7 @@ export default { | |||
if (this.dataForm.priority !== undefined) { | |||
this.dataForm.priority = String(this.dataForm.priority) | |||
} | |||
this.dataForm.priority | |||
this.dataForm.priority | |||
}); | |||
} else { | |||
if (this.urlOptions.isGetCode) { | |||
@@ -275,7 +263,7 @@ export default { | |||
name: this.dataForm.name | |||
}); | |||
}).catch(() => { | |||
this.$emit("refreshDataList"); | |||
this.$emit("refreshDataList"); | |||
}); | |||
}); | |||
}); | |||
@@ -296,6 +284,9 @@ export default { | |||
getLineAll().then(res => { | |||
this.productLineList = res.data || [] | |||
}) | |||
listDept().then(res => { | |||
this.deptList = res.data || [] | |||
}) | |||
// 工艺 | |||
getProcessFlowList().then(res => { | |||
this.processFlowList = res.data || [] | |||
@@ -321,4 +312,4 @@ export default { | |||
} | |||
} | |||
} | |||
</script> | |||
</script> |
@@ -0,0 +1,100 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-09-11 10:07:42 | |||
* @LastEditTime: 2024-09-11 10:07:43 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div | |||
id="orderEnergyChart" | |||
style="width: 100%" | |||
:style="{ height: chartHeight + 'px' }" | |||
></div> | |||
</template> | |||
<script> | |||
import * as echarts from 'echarts' | |||
import resize from '@/utils/chartMixins/resize' | |||
export default { | |||
name: "BarChart", | |||
mixins: [resize], | |||
data() { | |||
return { | |||
chartDom: '', | |||
chart: '', | |||
chartHeight: this.tableHeight(430) | |||
} | |||
}, | |||
props: { | |||
chartData: { | |||
type: Array, | |||
required: true, | |||
default: () => { | |||
return [] | |||
} | |||
} | |||
}, | |||
watch: { | |||
chartData: function () { | |||
this.getChart() | |||
} | |||
}, | |||
mounted() { | |||
window.addEventListener('resize', () => { | |||
this.chartHeight = this.tableHeight(430) | |||
}) | |||
}, | |||
methods: { | |||
getChart() { | |||
if ( | |||
this.chart !== null && | |||
this.chart !== '' && | |||
this.chart !== undefined | |||
) { | |||
this.chart.dispose() // 页面多次刷新会出现警告,Dom已经初始化了一个实例,这是销毁实例 | |||
} | |||
this.chartDom = document.getElementById('orderEnergyChart') | |||
this.chart = echarts.init(this.chartDom) | |||
console.log(this.chartData) | |||
let xData = [] | |||
let yData = [] | |||
this.chartData && this.chartData.map(item =>{ | |||
xData.push(item.objName) | |||
yData.push(item.useNum) | |||
}) | |||
var option = { | |||
color:['#288AFF'], | |||
grid: { | |||
left: '2%', | |||
right: '1%', | |||
bottom: '1%', | |||
containLabel: true | |||
}, | |||
xAxis: { | |||
type: 'category', | |||
data: xData, | |||
axisLabel: { | |||
rotate: "45" | |||
} | |||
}, | |||
yAxis: { | |||
type: 'value' | |||
}, | |||
series: [ | |||
{ | |||
data: yData, | |||
type: 'bar', | |||
barMaxWidth: 20, | |||
label: { | |||
show: true, | |||
position: 'top' | |||
} | |||
} | |||
] | |||
}; | |||
option && this.chart.setOption(option); | |||
} | |||
} | |||
} | |||
</script> |
@@ -1,155 +1,175 @@ | |||
<!-- | |||
* @Author: zwq | |||
* @Date: 2021-11-18 14:16:25 | |||
* @LastEditors: DY | |||
* @LastEditTime: 2023-11-23 18:45:15 | |||
* @LastEditors: zhp | |||
* @LastEditTime: 2024-09-11 10:27:13 | |||
* @Description: | |||
--> | |||
<template> | |||
<!-- <el-drawer | |||
<!-- <el-drawer | |||
:visible.sync="visible" | |||
:show-close="false" | |||
:wrapper-closable="false" | |||
class="drawer" | |||
size="50%"> --> | |||
<div class="app-container"> | |||
<!-- <small-title slot="title" :no-padding="true"> | |||
{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }} | |||
</small-title> --> | |||
<el-button style="float: right" type="primary" @click="goback()">返回</el-button> | |||
<div v-show="workOrderButton.length"> | |||
<el-button v-for="(work, index) in workOrderButton" :key="index" type="primary" @click="init(work.id, true)">{{ work.name }}</el-button> | |||
</div> | |||
<div class="content"> | |||
<div> | |||
<h1>工单编码:{{ dataForm.code }}</h1> | |||
</div> | |||
<small-title | |||
style="margin: 16px 0; padding-left: 8px" | |||
:no-padding="true"> | |||
基本信息 | |||
</small-title> | |||
<div class="formContent"> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单名称:{{ dataForm.name }}</el-col> | |||
<el-col :span="8">工单来源:{{ dataForm.triggerOrigin === 1 ? 'MES' : dataForm.triggerOrigin === 2 ? 'ERP' : ''}}</el-col> | |||
<el-col :span="8">所属订单: | |||
<span v-for="(item, index) in orderList" :key="index" style="margin-right: 10px">{{ item.orderName }}</span> | |||
</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">产品名称:{{ dataForm.productName }}</el-col> | |||
<el-col :span="8">规 格:{{ dataForm.specifications }}</el-col> | |||
<el-col :span="8">计划生产数量:{{ dataForm.planQuantity }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">预计用时(小时):{{ dataForm.remainingTime }}</el-col> | |||
<el-col :span="8">计划投入数量:{{ dataForm.planAssignQuantity }}</el-col> | |||
<el-col :span="8">优先级:{{ fitlerP(dataForm.priority) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">负责人:{{ dataForm.workers }}</el-col> | |||
<el-col :span="8">关联产线: | |||
<span v-for="(item, index) in dataForm.productLineNames" :key="index" style="margin-right: 10px">{{ item }}</span> | |||
</el-col> | |||
<el-col :span="8">物料计算方式:{{ dataForm.materialMethod === 1 ? '产品基础' : dataForm.materialMethod === 2 ? '工艺扩展' : '' }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">关联工艺:{{ dataForm.processFlowName }}</el-col> | |||
</el-row> | |||
</div> | |||
<small-title | |||
style="margin: 16px 0; padding-left: 8px" | |||
:no-padding="true"> | |||
生产信息 | |||
</small-title> | |||
<div class="formContent"> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单创建时间:{{ parseTime(dataForm.createTime) }}</el-col> | |||
<el-col :span="8">计划开始时间:{{ parseTime(dataForm.planStartTime) }}</el-col> | |||
<el-col :span="8">计划完成时间:{{ parseTime(dataForm.planFinishTime) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">预计结束时间:{{ parseTime(dataForm.computeFinishTime) }}</el-col> | |||
<el-col :span="8">实际开始时间:{{ parseTime(dataForm.startProduceTime) }}</el-col> | |||
<el-col :span="8">实际完成时间:{{ parseTime(dataForm.finishProduceTime) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单状态:{{ fitlerS(dataForm.status) }}</el-col> | |||
<el-col :span="8">实际投入数量:{{ dataForm.assignQuantity }}</el-col> | |||
<el-col :span="8">实际生产数量:{{ dataForm.actualQuantity }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">废片数量:{{ dataForm.nokQuantity }}</el-col> | |||
<el-col :span="8">检测瑕疵数:{{ }}</el-col> | |||
</el-row> | |||
</div> | |||
<div class="status-timegraph-container" style="background: #f2f4f9; flex: 1; display: flex; flex-direction: column"> | |||
<el-row v-show="workOrderButton.length !== 0" class="" style=" | |||
margin-bottom: 4px; | |||
border-radius: 8px; | |||
"> | |||
<workOrderNav :id-list="workOrderButton" @getWorkOrderId="getId"> | |||
</workOrderNav> | |||
</el-row> | |||
<el-row class="" style=" | |||
height: 1px; | |||
flex: .3; | |||
margin-bottom: 12px; | |||
background: #fff; | |||
padding: 16px 16px px; | |||
border-radius: 8px; | |||
display: flex; | |||
flex-direction: column; | |||
"> | |||
<div class="content"> | |||
<div> | |||
<h1>工单编码:{{ dataForm.code }}</h1> | |||
</div> | |||
<small-title style="margin: 16px 0; padding-left: 8px" :no-padding="true"> | |||
基本信息 | |||
</small-title> | |||
<div class="formContent"> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单名称:{{ dataForm.name }}</el-col> | |||
<el-col :span="8">工单来源:{{ dataForm.triggerOrigin === 1 ? 'MES' : dataForm.triggerOrigin === 2 ? 'ERP' : ''}} | |||
</el-col> | |||
<el-col :span="8">所属订单: | |||
<span v-for="(item, index) in orderList" :key="index" style="margin-right: 10px">{{ item.orderName | |||
}}</span> | |||
</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">产品名称:{{ dataForm.productName }}</el-col> | |||
<el-col :span="8">规 格:{{ dataForm.specifications }}</el-col> | |||
<el-col :span="8">计划生产数量:{{ dataForm.planQuantity }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">预计用时(小时):{{ dataForm.remainingTime }}</el-col> | |||
<el-col :span="8">计划投入数量:{{ dataForm.planAssignQuantity }}</el-col> | |||
<el-col :span="8">优先级:{{ fitlerP(dataForm.priority) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">负责人:{{ dataForm.workers }}</el-col> | |||
<el-col :span="8">关联产线: | |||
<span v-for="(item, index) in dataForm.productLineNames" :key="index" style="margin-right: 10px">{{ item | |||
}}</span> | |||
</el-col> | |||
<el-col :span="8">物料计算方式:{{ dataForm.materialMethod === 1 ? '产品基础' : dataForm.materialMethod === 2 ? '工艺扩展' | |||
: | |||
'' }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">关联工艺:{{ dataForm.processFlowName }}</el-col> | |||
</el-row> | |||
</div> | |||
</div> | |||
</el-row> | |||
<el-row class="" style=" | |||
height: 1px; | |||
flex: 1; | |||
margin-bottom: 12px; | |||
background: #fff; | |||
padding: 16px 16px 32px; | |||
border-radius: 8px; | |||
display: flex; | |||
flex-direction: column; | |||
"> | |||
<el-tabs v-model="activeName" @tab-click="switchTab"> | |||
<el-tab-pane label="生产信息" name="produce"> | |||
<div class="formContent"> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单创建时间:{{ parseTime(dataForm.createTime) }}</el-col> | |||
<el-col :span="8">计划开始时间:{{ parseTime(dataForm.planStartTime) }}</el-col> | |||
<el-col :span="8">计划完成时间:{{ parseTime(dataForm.planFinishTime) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">预计结束时间:{{ parseTime(dataForm.computeFinishTime) }}</el-col> | |||
<el-col :span="8">实际开始时间:{{ parseTime(dataForm.startProduceTime) }}</el-col> | |||
<el-col :span="8">实际完成时间:{{ parseTime(dataForm.finishProduceTime) }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">工单状态:{{ fitlerS(dataForm.status) }}</el-col> | |||
<el-col :span="8">实际投入数量:{{ dataForm.assignQuantity }}</el-col> | |||
<el-col :span="8">实际生产数量:{{ dataForm.actualQuantity }}</el-col> | |||
</el-row> | |||
<el-row :gutter="20"> | |||
<el-col :span="8">废片数量:{{ dataForm.nokQuantity }}</el-col> | |||
<el-col :span="8">检测瑕疵数:{{ }}</el-col> | |||
</el-row> | |||
</div> | |||
</el-tab-pane> | |||
<el-tab-pane label="订单信息" name="order"> | |||
<base-table :max-height="tableH" :table-props="tableProps" :page="listQuery.pageNo" | |||
:limit="listQuery.pageSize" :table-data="orderList"> | |||
<method-btn v-if="!isdetail" slot="handleBtn" :width="120" label="操作" :method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
</el-tab-pane> | |||
<el-tab-pane label="预计用料信息" name="material"> | |||
<base-table :max-height="tableH" :table-props="tableProps1" :page="listQuery1.pageNo" | |||
:limit="listQuery1.pageSize" :table-data="materialList" /> | |||
</el-tab-pane> | |||
<el-tab-pane label="质量信息" name="quality"> | |||
<base-table :max-height="tableH" :table-props="tablePropsQuality" :table-data="qualityList" :page="1" | |||
:limit="10" /> | |||
</el-tab-pane> | |||
<el-tab-pane label="能源信息" name="energy"> | |||
<div class="toggleTabBox"> | |||
<div :class="{ active: activeModule === 'dataList' }" @click="toggleTab('dataList')">数据列表</div> | |||
<div :class="{ active: activeModule === 'barChart' }" @click="toggleTab('barChart')">柱状图</div> | |||
</div> | |||
<div> | |||
<div v-show="activeModule === 'dataList'"> | |||
<!-- 表格 --> | |||
<base-table :max-height="tableH" :table-props="tablePropsEnergy" :page="listQueryEnergy.pageNo" | |||
:limit="listQueryEnergy.pageSize" :table-data="energyList" /> | |||
</div> | |||
<!-- 图形 --> | |||
<div v-show="activeModule === 'barChart'"> | |||
<bar-chart ref="orderEnergyChart" :chartData="chartData" /> | |||
</div> | |||
</div> | |||
</el-tab-pane> | |||
</el-tabs> | |||
<div class="attr-list"> | |||
<small-title | |||
style="margin: 16px 0; padding-left: 8px" | |||
:no-padding="true"> | |||
订单相关信息 | |||
</small-title> | |||
<base-table | |||
:table-props="tableProps" | |||
:page="listQuery.pageNo" | |||
:limit="listQuery.pageSize" | |||
:table-data="orderList"> | |||
<method-btn | |||
v-if="!isdetail" | |||
slot="handleBtn" | |||
:width="120" | |||
label="操作" | |||
:method-list="tableBtn" | |||
@clickBtn="handleClick" /> | |||
</base-table> | |||
<!-- <pagination | |||
v-show="listQuery.total > 0" | |||
:total="listQuery.total" | |||
:page.sync="listQuery.pageNo" | |||
:limit.sync="listQuery.pageSize" | |||
:page-sizes="[5, 10, 15]" | |||
@pagination="getList" /> --> | |||
</div> | |||
</el-row> | |||
<div class="attr-list"> | |||
<small-title | |||
style="margin: 16px 0; padding-left: 8px" | |||
:no-padding="true"> | |||
预计用料信息 | |||
</small-title> | |||
<base-table | |||
:table-props="tableProps1" | |||
:page="listQuery1.pageNo" | |||
:limit="listQuery1.pageSize" | |||
:table-data="materialList" /> | |||
<!-- <pagination | |||
v-show="listQuery1.total > 0" | |||
:total="listQuery1.total" | |||
:page.sync="listQuery1.pageNo" | |||
:limit.sync="listQuery1.pageSize" | |||
:page-sizes="[5, 10, 15]" | |||
@pagination="getList" /> --> | |||
</div> | |||
<!-- <div class="drawer-body__footer"> | |||
<el-button type="primary" @click="goback()">关闭</el-button> | |||
</div> --> | |||
</div> | |||
</div> | |||
<!-- 对话框(添加 / 修改) --> | |||
<!-- <base-dialog dialogTitle="添加设备" :dialogVisible="open" width="500px" @close="open = false" @cancel="open = false" | |||
@confirm="submitForm"> | |||
<el-select v-if="open" style="width: 100%" filterable clearable v-model="queryParams.equipmentId" | |||
placeholder="请选择一个设备"> | |||
<el-option v-for="eq in eqList" :key="eq.id" :value="eq.id" :label="eq.name"></el-option> | |||
</el-select> | |||
</base-dialog> --> | |||
</div> | |||
</template> | |||
<script> | |||
// import basicAdd from '../../core/mixins/basic-add'; | |||
import { getCoreWO, getMaterialBomPage, getConOrderList, getCoreWOListById } from "@/api/base/coreWorkOrder"; | |||
import tableHeightMixin from '@/mixins/tableHeightMixin'; | |||
import { getOrderEnergyData } from "@/api/monitoring/orderEnergy"; | |||
// import { orderList } from "@/api/base/orderManage"; | |||
import { | |||
getStatisticalDataPage, | |||
} from '@/api/monitoring/statisticalData'; | |||
import { getProcessFlowList } from '@/api/base/orderManage' | |||
import SmallTitle from './SmallTitle'; | |||
import { publicFormatter } from "@/utils/dict"; | |||
import { parseTime } from '@/utils/ruoyi' | |||
import workOrderNav from './workOrderNav.vue' | |||
import BarChart from "./barChart" | |||
const tableBtn = [ | |||
{ | |||
type: 'edit', | |||
@@ -199,14 +219,101 @@ const tableProps1 = [ | |||
label: '剩余生产预计消耗' | |||
}, | |||
]; | |||
const tablePropsEnergy = [ | |||
{ | |||
prop: 'objName', | |||
label: '对象名称' | |||
}, | |||
{ | |||
prop: 'objCode', | |||
label: '对象编码', | |||
// filter: publicFormatter('unit_dict') | |||
}, | |||
{ | |||
prop: 'energyType', | |||
label: '能源类型', | |||
// filter: publicFormatter('unit_dict') | |||
}, | |||
{ | |||
prop: 'startNum', | |||
label: '工单开始值', | |||
// filter: publicFormatter('unit_dict') | |||
}, | |||
{ | |||
prop: 'endNum', | |||
label: '工单结束值/当前值' | |||
}, | |||
{ | |||
prop: 'useNum', | |||
label: '使用量' | |||
}, | |||
]; | |||
export default { | |||
components: { SmallTitle }, | |||
mixins: [tableHeightMixin], | |||
components: { SmallTitle, workOrderNav, BarChart }, | |||
computed: { | |||
tablePropsQuality() { | |||
return [ | |||
{ | |||
// width: 128, | |||
prop: 'workOrderName', | |||
label: '工单名称', | |||
}, | |||
{ | |||
// width: 128, | |||
prop: 'productionName', | |||
label: '产品', | |||
}, | |||
{ | |||
// width: 160, | |||
prop: 'inspectionContent', | |||
label: '检测内容', | |||
}, | |||
...this.dynamicProps, | |||
{ | |||
// width: 128, | |||
prop: 'sumScrap', | |||
label: '未检测总数', | |||
}, | |||
{ | |||
// width: 128, | |||
prop: 'scrapRatio', | |||
label: '比例(%)', | |||
// subcomponent: { | |||
// name: 'TextOnly', | |||
// props: { | |||
// injectData: { | |||
// type: Object, | |||
// default: () => ({}), | |||
// }, | |||
// }, | |||
// data() { | |||
// return { | |||
// text: '比例', | |||
// }; | |||
// }, | |||
// methods: { | |||
// handleEmit(payload) { | |||
// console.log('handleEmit', payload); | |||
// }, | |||
// }, | |||
// render(h) { | |||
// return h('el-button', { props: { type: 'text' } }, this.text); | |||
// }, | |||
// }, | |||
}, | |||
]; | |||
}, | |||
}, | |||
data() { | |||
return { | |||
tableBtn, | |||
tableProps, | |||
tableProps1, | |||
tableProps, | |||
heightNum: 236, | |||
tablePropsEnergy, | |||
tableProps1, | |||
activeModule:'dataList', | |||
workOrderId:undefined, | |||
addOrUpdateVisible: false, | |||
urlOptions: { | |||
infoURL: getCoreWO | |||
@@ -215,7 +322,13 @@ export default { | |||
pageSize: 10, | |||
pageNo: 1, | |||
total: 0, | |||
}, | |||
}, | |||
listQueryEnergy: { | |||
pageSize: 10, | |||
pageNo: 1, | |||
total: 0, | |||
}, | |||
activeName:'produce', | |||
listQuery1: { | |||
pageSize: 10, | |||
pageNo: 1, | |||
@@ -223,40 +336,120 @@ export default { | |||
}, | |||
dataForm: {}, | |||
orderList: [], | |||
materialList: [], | |||
materialList: [], | |||
energyList: [], | |||
qualityList: [], | |||
chartData:[], | |||
dynamicProps:[], | |||
// orderArray: [], | |||
visible: false, | |||
isdetail: false, | |||
workOrderButton: [], | |||
processFlowList: [] | |||
}; | |||
}, | |||
}, | |||
watch: { | |||
workOrderId(newValue, oldValue) { | |||
this.activeName = 'produce' | |||
this.init(newValue) | |||
this.dataForm.id = newValue | |||
} | |||
}, | |||
created() { | |||
this.getDict() | |||
}, | |||
mounted() { | |||
if (this.$route.query.woIdString && this.$route.query.woIdString !== 'undefined') { | |||
const idList = this.$route.query.woIdString.split(',') | |||
const idList = this.$route.query.woIdString.split(',') | |||
console.log(idList); | |||
getCoreWOListById(idList).then(res => { | |||
this.workOrderButton = res.data.map(work => { | |||
return { | |||
id: work.id, | |||
name: work.name | |||
} | |||
}) | |||
}) | |||
// console.log(this.workOrderButton); | |||
this.init(this.workOrderButton[0].id, true) | |||
}) | |||
} else { | |||
this.init(this.$route.query.id, true) | |||
} | |||
}, | |||
methods: { | |||
methods: { | |||
getId(val) { | |||
this.workOrderId = val | |||
}, | |||
async switchTab(val) { | |||
if (this.activeName === 'order') { | |||
getConOrderList({ | |||
workOrderId: this.dataForm.id, | |||
}).then((response) => { | |||
this.orderList = response.data; | |||
// this.listQuery.total = response.data.total; | |||
}); | |||
}else if (this.activeName === 'material') { | |||
getConOrderList({ | |||
workOrderId: this.dataForm.id, | |||
}).then((response) => { | |||
this.materialList = response.data; | |||
// this.listQuery.total = response.data.total; | |||
}); | |||
} else if (this.activeName === 'energy') { | |||
getOrderEnergyData({ | |||
workOrderId: this.dataForm.id, | |||
}).then((response) => { | |||
this.energyList = response.data | |||
this.chartData = response.data | |||
// this.listQuery.total = response.data.total; | |||
}); | |||
} else if (this.activeName === 'quality') { | |||
const { | |||
data: { data, otherList, otherMap, nameData }, | |||
} = await getStatisticalDataPage({ | |||
workOrderIdList:[this.dataForm,id] | |||
}) | |||
// console.log(this.queryParams); | |||
this.dynamicProps = this.filterNameData(nameData) | |||
this.qualityList = this.filterData(data); | |||
} | |||
}, | |||
getDict() { | |||
// 工艺 | |||
getProcessFlowList().then(res => { | |||
this.processFlowList = res.data || [] | |||
}) | |||
}, | |||
}, | |||
filterNameData(nameData) { | |||
const ndSet = new Set(); | |||
nameData.forEach((nd) => { | |||
ndSet.add(nd.name); | |||
}); | |||
return Array.from(ndSet.values()) | |||
.sort() | |||
.map((name) => ({ | |||
prop: name, | |||
label: name, | |||
})); | |||
}, | |||
filterData(data) { | |||
return data.map((item) => { | |||
const { data: innerData } = item; | |||
const keyValuePairs = {}; | |||
innerData.map((d) => { | |||
keyValuePairs[d.dynamicName] = d.dynamicValue; | |||
}); | |||
return { | |||
inspectionContent: item.inspectionContent, | |||
...keyValuePairs, | |||
sumInput: item.sumInput, | |||
productionName: item.productionName, | |||
workOrderId: item.workOrderId, | |||
scrapRatio: item.scrapRatio, | |||
}; | |||
}); | |||
}, | |||
fitlerP(val) { | |||
if (val) { | |||
if (val === 1) { | |||
@@ -318,24 +511,26 @@ export default { | |||
} else { | |||
this.addNew(raw.data.id); | |||
} | |||
}, | |||
}, | |||
toggleTab(val) { | |||
this.activeModule = val | |||
if (this.activeModule === 'barChart') { | |||
this.$nextTick((res) => { | |||
this.$refs.orderEnergyChart.getChart() | |||
}) | |||
} | |||
}, | |||
getList() { | |||
// 获取订单列表 | |||
getConOrderList({ | |||
workOrderId: this.dataForm.id, | |||
}).then((response) => { | |||
this.orderList = response.data; | |||
// this.listQuery.total = response.data.total; | |||
}); | |||
// 获取预使用原料列表 | |||
if (this.dataForm.planProductId) { | |||
getMaterialBomPage({ | |||
productId: this.dataForm.planProductId, | |||
}).then((response) => { | |||
this.materialList = response.data; | |||
// this.listQuery.total = response.data.length; | |||
}); | |||
} | |||
// if (this.dataForm.planProductId) { | |||
// getMaterialBomPage({ | |||
// productId: this.dataForm.planProductId, | |||
// }).then((response) => { | |||
// this.materialList = response.data; | |||
// // this.listQuery.total = response.data.length; | |||
// }); | |||
// } | |||
// 获取订单相关信息 | |||
// orderList({ | |||
// workOrderId: this.dataForm.id | |||
@@ -364,7 +559,7 @@ export default { | |||
}) | |||
} | |||
// 获取订单列表和用料列表 | |||
this.getList(); | |||
// this.getList(); | |||
}); | |||
} else { | |||
if (this.urlOptions.isGetCode) { | |||
@@ -373,10 +568,6 @@ export default { | |||
} | |||
}); | |||
}, | |||
goback() { | |||
this.$router.go(-1); | |||
// this.initData(); | |||
}, | |||
goEdit() { | |||
this.isdetail = false; | |||
}, | |||
@@ -390,7 +581,7 @@ export default { | |||
} | |||
}; | |||
</script> | |||
<style scoped> | |||
<style lang="scss" scoped> | |||
.drawer >>> .el-drawer { | |||
border-radius: 8px 0 0 8px; | |||
display: flex; | |||
@@ -453,4 +644,26 @@ export default { | |||
.add { | |||
color: #0b58ff; | |||
} | |||
.container{ | |||
/* background-color: #fff; */ | |||
border-radius: 8px; | |||
padding: 16px 16px 0 16px; | |||
margin: 8px 0 8px 0px; | |||
} | |||
.toggleTabBox { | |||
display: inline-block; | |||
div { | |||
display: inline-block; | |||
padding: 0 8px 4px; | |||
color: rgba(102, 102, 102, 0.5); | |||
border-bottom: 2px solid rgba(242, 244, 249, 1); | |||
cursor: pointer; | |||
} | |||
.active { | |||
color: rgba(0, 0, 0, 0.85); | |||
border-bottom-color: #0B58FF; | |||
} | |||
} | |||
</style> |
@@ -60,68 +60,9 @@ import { | |||
getConOrderList, | |||
getCoreWOList | |||
} from '@/api/base/coreWorkOrder'; | |||
import { listDept } from '@/api/system/dept'; | |||
const tableProps = [ | |||
{ | |||
prop: 'createTime', | |||
label: '创建时间', | |||
filter: parseTime, | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'name', | |||
label: '工单名称', | |||
minWidth: 120, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'code', | |||
label: '工单编码', | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'workers', | |||
label: '负责人', | |||
minWidth: 100, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'priority', | |||
label: '优先级', | |||
filter: (val) => ['', '低', '正常', '高'][val] | |||
}, | |||
{ | |||
prop: 'triggerOrigin', | |||
label: '来源', | |||
filter: (val) => ['', 'MES-手动', 'MES-订单下发', 'ERP'][val] | |||
}, | |||
{ | |||
prop: 'status', | |||
label: '工单状态', | |||
filter: (val) => ['', '等待', '激活', '暂停', '完成', '', '', '', '', '作废'][val] | |||
}, | |||
{ | |||
prop: 'planFinishTime', | |||
label: '计划完成时间', | |||
filter: parseTime, | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'planQuantity', | |||
label: '计划生产数量', | |||
minWidth: 120, | |||
}, | |||
{ | |||
prop: 'actualQuantity', | |||
label: '实际生产数量', | |||
minWidth: 120, | |||
} | |||
]; | |||
export default { | |||
mixins: [basicPage], | |||
components: { | |||
@@ -134,37 +75,38 @@ export default { | |||
urlOptions: { | |||
getDataListURL: getCoreWOPage, | |||
deleteURL: deleteCoreWO | |||
}, | |||
detailVisible: false, | |||
}, | |||
departments:[], | |||
detailVisible: false, | |||
departmentsLoaded: false, | |||
materialVisible: false, | |||
allocationVisible: false, | |||
tableProps, | |||
tableBtn: [ | |||
this.$auth.hasPermi(`base:core-work-order:material`) | |||
? { | |||
type: 'material', | |||
btnName: '原料信息', | |||
} | |||
: undefined, | |||
{ | |||
type: 'active', | |||
btnName: '激活', | |||
showParam: { | |||
type: '|', | |||
data: [ | |||
{ | |||
name: 'status', | |||
type: 'equal', | |||
value: 1 | |||
}, | |||
{ | |||
name: 'status', | |||
type: 'equal', | |||
value: 3 | |||
} | |||
] | |||
} | |||
}, | |||
// this.$auth.hasPermi(`base:core-work-order:material`) | |||
// ? { | |||
// type: 'material', | |||
// btnName: '原料信息', | |||
// } | |||
// : undefined, | |||
// { | |||
// type: 'active', | |||
// btnName: '激活', | |||
// showParam: { | |||
// type: '|', | |||
// data: [ | |||
// { | |||
// name: 'status', | |||
// type: 'equal', | |||
// value: 1 | |||
// }, | |||
// { | |||
// name: 'status', | |||
// type: 'equal', | |||
// value: 3 | |||
// } | |||
// ] | |||
// } | |||
// }, | |||
{ | |||
type: 'pause', | |||
btnName: '暂停', | |||
@@ -323,13 +265,88 @@ export default { | |||
}, | |||
], | |||
}; | |||
}, | |||
mounted() { | |||
}, | |||
computed: { | |||
tableProps() { | |||
return [ | |||
{ | |||
prop: 'createTime', | |||
label: '创建时间', | |||
filter: parseTime, | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'name', | |||
label: '工单名称', | |||
minWidth: 120, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'code', | |||
label: '工单编码', | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'deptId', | |||
label: '负责部门', | |||
minWidth: 100, | |||
showOverflowtooltip: true, | |||
filter: (val) => { | |||
if (this.departmentsLoaded) { | |||
const department = this.departments.find((dept) => dept.id === val); | |||
return department ? department.name : ''; | |||
} else { | |||
return ''; | |||
} | |||
}, | |||
}, | |||
{ | |||
prop: 'priority', | |||
label: '优先级', | |||
filter: (val) => ['', '低', '正常', '高'][val] | |||
}, | |||
{ | |||
prop: 'triggerOrigin', | |||
label: '来源', | |||
filter: (val) => ['', 'MES-手动', 'MES-订单下发', 'ERP'][val] | |||
}, | |||
{ | |||
prop: 'status', | |||
label: '工单状态', | |||
filter: (val) => ['', '等待', '激活', '暂停', '完成', '', '', '', '', '作废'][val] | |||
}, | |||
{ | |||
prop: 'planFinishTime', | |||
label: '计划完成时间', | |||
filter: parseTime, | |||
minWidth: 150, | |||
showOverflowtooltip: true | |||
}, | |||
{ | |||
prop: 'planQuantity', | |||
label: '计划生产数量', | |||
minWidth: 120, | |||
}, | |||
{ | |||
prop: 'actualQuantity', | |||
label: '实际生产数量', | |||
minWidth: 120, | |||
} | |||
]; | |||
} | |||
}, | |||
mounted() { | |||
console.log(this.$route.query.workOrderName) | |||
if (this.$route.query.workOrderName) { | |||
this.listQuery.name = this.$route.query.workOrderName; | |||
this.formConfig[0].defaultSelect = this.$route.query.workOrderName; | |||
} | |||
} | |||
listDept().then(res => { | |||
this.departments = res.data || [] | |||
this.departmentsLoaded = true; | |||
}) | |||
// this.getWorkOrder() | |||
this.getDataList() | |||
}, | |||
@@ -0,0 +1,151 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-09-09 15:39:08 | |||
* @LastEditTime: 2024-09-11 10:25:54 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<div> | |||
<div class="button-nav"> | |||
<!-- <div class="text-carousel"> --> | |||
<el-button style="flex: .1" type="text" @click="prevText" icon="el-icon-caret-left"></el-button> | |||
<button @click="handleChange(item.id)" v-for="(item,index) in idList" :key="item.id" | |||
:class="[item.id === currentMenu ? 'active' : '']">{{ item.name }} | |||
</button> | |||
<el-button style="flex: .1" type="text" @click="nextText" icon="el-icon-caret-right"></el-button> | |||
<button style="flex: .2;display: inline-block;" @click="goback()"> | |||
<svg-icon style="width: 20px; height: 20px" :icon-class=" 'back' " /> | |||
<span>返回</span> | |||
</button> | |||
</div> | |||
<!-- </div> --> | |||
</div> | |||
</template> | |||
<script> | |||
export default { | |||
props: { | |||
idList: { | |||
type: Array, | |||
default:[] | |||
} | |||
}, | |||
data() { | |||
return { | |||
currentMenu: undefined | |||
}; | |||
}, | |||
watch: { | |||
currentMenu(newValue,oldValue) { | |||
this.$emit('getWorkOrderId', newValue) | |||
}, | |||
idList(newValue, oldValue) { | |||
console.log(newValue); | |||
this.currentMenu = newValue[0].id | |||
} | |||
}, | |||
// created() { | |||
// if (this.currentMenu === undefined) { | |||
// console.log(this.idList); | |||
// this.$nextTick(() => { | |||
// this.currentMenu = this.idList[0]?.id | |||
// }) | |||
// } | |||
// }, | |||
// mounted() { | |||
// }, | |||
methods: { | |||
goback() { | |||
this.$router.go(-1); | |||
// this.initData(); | |||
}, | |||
handleChange(val) { | |||
this.currentMenu = val | |||
// this.$emit('getWorkOrderId',val) | |||
}, | |||
prevText() { | |||
const currentIndex = this.idList.findIndex((item) => item.id === this.currentMenu); | |||
const newIndex = (currentIndex - 1 + this.idList.length) % this.idList.length; | |||
this.currentMenu = this.idList[newIndex].id; | |||
// this.$emit('getWorkOrderId', val) | |||
}, | |||
nextText() { | |||
const currentIndex = this.idList.findIndex((item) => item.id === this.currentMenu); | |||
const newIndex = (currentIndex + 1) % this.idList.length; | |||
this.currentMenu = this.idList[newIndex].id; | |||
// this.$emit('getWorkOrderId', val) | |||
}, | |||
}, | |||
}; | |||
</script> | |||
<style scoped lang="scss"> | |||
.button-nav { | |||
width: 100%; | |||
padding: 12px 0; | |||
display: flex; | |||
// justify-content: space-around; | |||
gap: 12px; | |||
* { | |||
user-select: none; | |||
} | |||
button { | |||
cursor: pointer; | |||
appearance: none; | |||
outline: none; | |||
border: none; | |||
background: #fff; | |||
border-radius: 8px; | |||
border-bottom-left-radius: 5px; | |||
border-bottom-right-radius: 5px; | |||
padding: 20px; | |||
color: #888; | |||
letter-spacing: 2px; | |||
flex: 1; | |||
box-sizing: padding-box; | |||
position: relative; | |||
&::after { | |||
content: attr(data-text); | |||
position: absolute; | |||
top: 10px; | |||
left: 50%; | |||
font-size: 18px; | |||
font-weight: 500; | |||
transform: translate(-50%); | |||
} | |||
&.active { | |||
color: #111; | |||
border-bottom: 4px solid #0b58ff; | |||
} | |||
} | |||
} | |||
</style> | |||
<style scoped> | |||
.custom-tabs >>> .el-tabs__header { | |||
margin-bottom: 8px; | |||
display: inline-block; | |||
/* transform: translateY(-12px); */ | |||
} | |||
.custom-tabs >>> .el-tabs__item { | |||
padding-left: 0px !important; | |||
padding-right: 0px !important; | |||
line-height: 36px !important; | |||
height: 36px; | |||
} | |||
.custom-tabs >>> .el-tabs__content { | |||
height: calc(100% - 42px); | |||
} | |||
.custom-tabs >>> .el-tab-pane { | |||
box-sizing: border-box; | |||
height: 100%; | |||
padding: 20px; | |||
border: 10px solid #f002; | |||
} | |||
</style> |
@@ -1,3 +1,10 @@ | |||
<!-- | |||
* @Author: zhp | |||
* @Date: 2024-08-13 08:36:54 | |||
* @LastEditTime: 2024-09-11 09:35:12 | |||
* @LastEditors: zhp | |||
* @Description: | |||
--> | |||
<template> | |||
<base-table | |||
:table-props="tableProps" | |||