|
@@ -0,0 +1,292 @@
|
|
|
+<template>
|
|
|
+ <div class="form">
|
|
|
+ <van-nav-bar
|
|
|
+ title="工序管理"
|
|
|
+ left-text="返回"
|
|
|
+ left-arrow
|
|
|
+ @click-left="onClickLeft"
|
|
|
+ >
|
|
|
+ </van-nav-bar>
|
|
|
+
|
|
|
+ <testForm
|
|
|
+ v-model="formData.data"
|
|
|
+ :formOption="formOption"
|
|
|
+ :formConfig="formConfig"
|
|
|
+ :rules="rules"
|
|
|
+ @onSubmit="onSubmit"
|
|
|
+ ref="formDom"
|
|
|
+ >
|
|
|
+ <template #processRouteList>
|
|
|
+ <div class="row">
|
|
|
+ <div class="col" style="width: 50%">
|
|
|
+ <van-checkbox-group
|
|
|
+ v-model="formData.data.processRouteList"
|
|
|
+ >
|
|
|
+ <van-checkbox
|
|
|
+ :name="i.id"
|
|
|
+ v-for="i in processRouteListData"
|
|
|
+ :key="i.id"
|
|
|
+ >{{ i.name }}</van-checkbox
|
|
|
+ >
|
|
|
+ </van-checkbox-group>
|
|
|
+ </div>
|
|
|
+ <div class="col" style="width: 50%">
|
|
|
+ <div v-for="(i, index) in formData.data.processRouteList" draggable="true">
|
|
|
+ <van-icon name="arrow-up" @click="sortUp(i)" />
|
|
|
+ <van-icon name="arrow-down" @click="sortdown(i)" />
|
|
|
+ <span style="margin-right: 10px">{{
|
|
|
+ index + 1
|
|
|
+ }}</span>
|
|
|
+ {{ getName2(i) }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template #applicableProductsList>
|
|
|
+ <div
|
|
|
+ style="color: #999; width: calc(100vw - 32px)"
|
|
|
+ @click="show = true"
|
|
|
+ >
|
|
|
+ 请选择
|
|
|
+ </div>
|
|
|
+ <div class="selectd" @click="show = true">
|
|
|
+ <div>
|
|
|
+ <van-tag
|
|
|
+ v-for="i in formData.data.applicableProductsList"
|
|
|
+ :key="i"
|
|
|
+ closeable
|
|
|
+ size="medium"
|
|
|
+ type="primary"
|
|
|
+ @close="deleteTag(i.id)"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ >
|
|
|
+ {{ getName(i) }}
|
|
|
+ </van-tag>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </testForm>
|
|
|
+ <van-popup
|
|
|
+ v-model:show="show"
|
|
|
+ closeable
|
|
|
+ position="bottom"
|
|
|
+ :style="{ height: '60%' }"
|
|
|
+ >
|
|
|
+ <div style="height: 50px; width: 100px"></div>
|
|
|
+ <van-checkbox-group v-model="formData.data.applicableProductsList">
|
|
|
+ <van-cell-group inset v-for="i in productInfoData" :key="i.id">
|
|
|
+ <van-cell clickable :title="i.name">
|
|
|
+ <template #right-icon>
|
|
|
+ <van-checkbox :name="i.id"></van-checkbox>
|
|
|
+ </template>
|
|
|
+ </van-cell>
|
|
|
+ </van-cell-group>
|
|
|
+ </van-checkbox-group>
|
|
|
+ </van-popup>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, getCurrentInstance, onMounted, reactive } from 'vue'
|
|
|
+import { showSuccessToast, showToast } from 'vant'
|
|
|
+import { useRoute } from 'vue-router'
|
|
|
+import { getUserInfo } from '@/utils/auth'
|
|
|
+import testForm from '@/components/testForm/index.vue'
|
|
|
+
|
|
|
+const proxy = getCurrentInstance().proxy
|
|
|
+const route = useRoute()
|
|
|
+const show = ref(false)
|
|
|
+const typeModal = ref(false)
|
|
|
+const unitModal = ref(false)
|
|
|
+const classification = ref([])
|
|
|
+const formData = reactive({
|
|
|
+ data: {
|
|
|
+ checked: [],
|
|
|
+ },
|
|
|
+})
|
|
|
+const formDom = ref(null)
|
|
|
+const formOption = reactive({
|
|
|
+ readonly: false, //用于控制整个表单是否只读
|
|
|
+ disabled: false,
|
|
|
+ labelAlign: 'top',
|
|
|
+ scroll: true,
|
|
|
+ labelWidth: '62pk',
|
|
|
+ // hiddenSubmitBtn: true,
|
|
|
+})
|
|
|
+let selected = ref([])
|
|
|
+
|
|
|
+const sortUp = (id) => {
|
|
|
+ let index = formData.data.processRouteList.findIndex((i) => i === id)
|
|
|
+ if (index === 0) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let temp = formData.data.processRouteList[index]
|
|
|
+ formData.data.processRouteList[index] = formData.data.processRouteList[index - 1]
|
|
|
+ formData.data.processRouteList[index - 1] = temp
|
|
|
+}
|
|
|
+
|
|
|
+const sortdown = (id) => {
|
|
|
+ let index = formData.data.processRouteList.findIndex((i) => i === id)
|
|
|
+ if (index === formData.data.processRouteList.length - 1) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ let temp = formData.data.processRouteList[index]
|
|
|
+ formData.data.processRouteList[index] = formData.data.processRouteList[index + 1]
|
|
|
+ formData.data.processRouteList[index + 1] = temp
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+const deleteTag = (id) => {
|
|
|
+ let index = formData.data.applicableProductsList.findIndex((i) => i.id === id)
|
|
|
+ formData.data.applicableProductsList.splice(index, 1)
|
|
|
+}
|
|
|
+
|
|
|
+const getName = (id) => {
|
|
|
+ let name = ''
|
|
|
+ productInfoData.value.forEach((i) => {
|
|
|
+ if (i.id === id) {
|
|
|
+ name = i.name
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return name
|
|
|
+}
|
|
|
+
|
|
|
+const getName2 = (id) => {
|
|
|
+ let name = ''
|
|
|
+ processRouteListData.value.forEach((i) => {
|
|
|
+ if (i.id === id) {
|
|
|
+ name = i.name
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return name
|
|
|
+}
|
|
|
+
|
|
|
+const formConfig = reactive([
|
|
|
+ {
|
|
|
+ type: 'input',
|
|
|
+ itemType: 'text',
|
|
|
+ label: '车间名称',
|
|
|
+ prop: 'name',
|
|
|
+ clearable: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'slot',
|
|
|
+ label: '工艺线路',
|
|
|
+ slotName: 'processRouteList',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 'slot',
|
|
|
+ label: '适用产品',
|
|
|
+ slotName: 'applicableProductsList',
|
|
|
+ },
|
|
|
+])
|
|
|
+const rules = {
|
|
|
+ name: [{ required: true, message: '车间类型不能为空' }],
|
|
|
+ fileList: [{ required: true, message: '请上传工序文件' }],
|
|
|
+}
|
|
|
+const unitList = ref([])
|
|
|
+let processRouteListData = ref([])
|
|
|
+const getUserList = () => {
|
|
|
+ proxy.get('/system/user/list?pageNum=1&pageSize=10000', {}).then((res) => {
|
|
|
+ formConfig[2].data = res.rows
|
|
|
+ })
|
|
|
+}
|
|
|
+getUserList()
|
|
|
+const fileList = ref([])
|
|
|
+const onOversize = () => {
|
|
|
+ showToast('文件大小不能超过 5MB')
|
|
|
+}
|
|
|
+const onClickLeft = () => history.back()
|
|
|
+const onSubmit = () => {
|
|
|
+ console.log(formData)
|
|
|
+ formData.data.productList = formData.data.applicableProductsList.map(item=>{
|
|
|
+ return {
|
|
|
+ productId:item
|
|
|
+ }
|
|
|
+ })
|
|
|
+ proxy
|
|
|
+ .post('/technology/' + route.query.type, formData.data)
|
|
|
+ .then(() => {
|
|
|
+ showSuccessToast(
|
|
|
+ route.query.type === 'add' ? '添加成功' : '修改成功'
|
|
|
+ )
|
|
|
+ setTimeout(() => {
|
|
|
+ history.back()
|
|
|
+ }, 500)
|
|
|
+ })
|
|
|
+}
|
|
|
+const treeToList = (arr) => {
|
|
|
+ let res = [] // 用于存储递归结果(扁平数据)
|
|
|
+ // 递归函数
|
|
|
+ let fn = (source) => {
|
|
|
+ source.forEach((el) => {
|
|
|
+ res.push(el)
|
|
|
+ el.children && el.children.length > 0 ? fn(el.children) : '' // 子级递归
|
|
|
+ })
|
|
|
+ }
|
|
|
+ fn(arr)
|
|
|
+ return res
|
|
|
+}
|
|
|
+const getDtl = (id) => {
|
|
|
+ proxy
|
|
|
+ .post('/productionProcesses/page', { id: route.query.id })
|
|
|
+ .then((resDetail) => {
|
|
|
+ processRouteListData.value = resDetail.data.rows
|
|
|
+ console.log(processRouteListData.value)
|
|
|
+ })
|
|
|
+ proxy
|
|
|
+ .post('/productInfo/page', { pageNum: 1, pageSize: 10000 })
|
|
|
+ .then((resDetail) => {
|
|
|
+ productInfoData.value = resDetail.data.rows
|
|
|
+ })
|
|
|
+}
|
|
|
+let productInfoData = ref([])
|
|
|
+onMounted(() => {
|
|
|
+ if (route.query.id) {
|
|
|
+ proxy
|
|
|
+ .post('/technology/detail', { id: route.query.id })
|
|
|
+ .then((resDetail) => {
|
|
|
+ formData.data = {
|
|
|
+ ...resDetail.data,
|
|
|
+ processRouteList: resDetail.data.processRouteList.map(
|
|
|
+ (item) => item.id
|
|
|
+ ),
|
|
|
+ applicableProductsList: resDetail.data.applicableProductsList.map(
|
|
|
+ (item) => item.id
|
|
|
+ ),
|
|
|
+
|
|
|
+ }
|
|
|
+ getDtl()
|
|
|
+ })
|
|
|
+ }else{
|
|
|
+ getDtl()
|
|
|
+ }
|
|
|
+
|
|
|
+})
|
|
|
+</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+.row {
|
|
|
+ overflow: hidden;
|
|
|
+ width: calc(100vw - 32px);
|
|
|
+ .col {
|
|
|
+ width: 50%;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 10px;
|
|
|
+ overflow: hidden;
|
|
|
+ .van-icon-arrow-down,
|
|
|
+ .van-icon-arrow-up {
|
|
|
+ display: inline-block;
|
|
|
+ height: 18px;
|
|
|
+ margin: 1px 3px;
|
|
|
+ line-height: 18px;
|
|
|
+ background: #1989fa;
|
|
|
+ width: 18px;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 9px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|