|  |  | 
 |  |  |       <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> | 
 |  |  |     </el-row> | 
 |  |  |  | 
 |  |  |     <el-table v-loading="loading" :data="aps_shopList" @selection-change="handleSelectionChange"> | 
 |  |  |       <el-table-column type="selection" width="55" align="center" /> | 
 |  |  |       <el-table-column label="车间名称" align="center" prop="shopName" /> | 
 |  |  |       <el-table-column label="车间代码" align="center" prop="shopCode" /> | 
 |  |  |       <el-table-column label="工厂代码" align="center" prop="plantCode" /> | 
 |  |  |       <el-table-column label="启用状态" align="center" prop="status"> | 
 |  |  |         <template #default="scope"> | 
 |  |  |           <dict-tag :options="aps_plant_status" :value="scope.row.status"/> | 
 |  |  |         </template> | 
 |  |  |       </el-table-column> | 
 |  |  |       <el-table-column label="创建者" align="center" prop="createBy" /> | 
 |  |  |       <el-table-column label="创建时间" align="center" prop="createTime" /> | 
 |  |  |       <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> | 
 |  |  |         <template #default="scope"> | 
 |  |  |           <el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['shop:edit']">修改</el-button> | 
 |  |  |         </template> | 
 |  |  |       </el-table-column> | 
 |  |  |     </el-table> | 
 |  |  |     <HxlhTable | 
 |  |  |         style="width: 100%" | 
 |  |  |         :columns="columns" | 
 |  |  |         :data="aps_shopList" | 
 |  |  |         :loading="loading" | 
 |  |  |         :height="height" | 
 |  |  |         :page="page" | 
 |  |  |         @changePageNo="changePageNo" | 
 |  |  |         @changePageSize="changePageSize" | 
 |  |  |         @on-checkbox="handleCheckboxChange" | 
 |  |  |     > | 
 |  |  |       <template #buttons="{row}"> | 
 |  |  |         <vxe-button mode="text" @click="handleUpdate(row)" v-hasPermi="['plant:edit']" >编辑</vxe-button> | 
 |  |  |       </template> | 
 |  |  |     </HxlhTable> | 
 |  |  |      | 
 |  |  |     <pagination | 
 |  |  |       v-show="total>0" | 
 |  |  |       :total="total" | 
 |  |  |       v-model:page="queryParams.pageNum" | 
 |  |  |       v-model:limit="queryParams.pageSize" | 
 |  |  |       @pagination="getList" | 
 |  |  |     /> | 
 |  |  |  | 
 |  |  |     <!-- 添加或修改车间对话框 --> | 
 |  |  |     <el-dialog :title="title" v-model="open" width="500px" append-to-body> | 
 |  |  |       <el-form ref="aps_shopRef" :model="form" :rules="rules" label-width="80px"> | 
 |  |  |         <el-form-item label="车间名称" prop="shopName"> | 
 |  |  |           <el-input v-model="form.shopName" placeholder="请输入车间名称" /> | 
 |  |  |           <el-input v-model="form.shopName" placeholder="请输入车间名称" ref="shopNameInputRef"/> | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="车间代码" prop="shopCode"> | 
 |  |  |           <el-input v-model="form.shopCode" placeholder="请输入车间代码" :disabled=shopCodeDisabled  /> | 
 |  |  |           <el-input v-model="form.shopCode" placeholder="请输入车间代码" :disabled=shopCodeDisabled ref="shopCodeInputRef" /> | 
 |  |  |  | 
 |  |  |         </el-form-item> | 
 |  |  |         <el-form-item label="工厂编码" prop="plantCode"> | 
 |  |  | 
 |  |  | <script setup name="Aps_shop"> | 
 |  |  | import { listAps_shop, getAps_shop, delAps_shop, addAps_shop, updateAps_shop } from "@/api/basicData/shop"; | 
 |  |  | import { listAps_plant } from "@/api/basicData/plant"; | 
 |  |  | import { ref } from "vue"; | 
 |  |  | import HxlhTable from '@/components/HxlhTable' | 
 |  |  |  | 
 |  |  | const { proxy } = getCurrentInstance(); | 
 |  |  | const { aps_plant_status } = proxy.useDict('aps_plant_status'); | 
 |  |  |  | 
 |  |  | const height = ref(document.documentElement.clientHeight - 170 + "px;"); | 
 |  |  | const shopNameRules = ref(null); | 
 |  |  | const shopCodeRules = ref(null); | 
 |  |  | const plantCodeRules = ref(null); | 
 |  |  | const aps_shopList = ref([]); | 
 |  |  | const open = ref(false); | 
 |  |  | const loading = ref(true); | 
 |  |  | 
 |  |  |   rules: { | 
 |  |  |     shopName: [ | 
 |  |  |       { required: true, message: "车间名称不能为空", trigger: "blur" }, | 
 |  |  |       { | 
 |  |  |         validator: async (rule, value, callback) => { | 
 |  |  |           if (!value) { | 
 |  |  |             return callback(); | 
 |  |  |           } | 
 |  |  |           try { | 
 |  |  |             if(value === shopNameRules.value && plantCodeRules.value === form.value.plantCode){ | 
 |  |  |               callback(); | 
 |  |  |             }else{ | 
 |  |  |               const isExists = await checkShopNameExists(value); | 
 |  |  |               if (isExists) { | 
 |  |  |                 return callback(new Error('车间名称已存在,请更换')); | 
 |  |  |               } else { | 
 |  |  |                 callback(); | 
 |  |  |               } | 
 |  |  |             } | 
 |  |  |           } catch (error) { | 
 |  |  |             return callback(new Error('校验用户名时发生错误,请稍后重试')); | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         trigger: 'blur' | 
 |  |  |       } | 
 |  |  |     ], | 
 |  |  |     shopCode: [ | 
 |  |  |       { required: true, message: "车间编码不能为空", trigger: "blur" }, | 
 |  |  |       { | 
 |  |  |         validator: async (rule, value, callback) => { | 
 |  |  |           if (!value) { | 
 |  |  |             return callback(); | 
 |  |  |           } | 
 |  |  |           try { | 
 |  |  |             if(form.value.shopCode){ | 
 |  |  |               callback(); | 
 |  |  |             }else{ | 
 |  |  |               const isExists = await checkShopCodeExists(value); | 
 |  |  |               if (isExists) { | 
 |  |  |                 return callback(new Error('该车间编码已存在,请更换')); | 
 |  |  |               } else { | 
 |  |  |                 callback(); | 
 |  |  |               } | 
 |  |  |             } | 
 |  |  |           } catch (error) { | 
 |  |  |             return callback(new Error('校验用户名时发生错误,请稍后重试')); | 
 |  |  |           } | 
 |  |  |         }, | 
 |  |  |         trigger: 'blur' | 
 |  |  |       } | 
 |  |  |     ], | 
 |  |  |     plantCode: [ | 
 |  |  |       { required: true, message: "工厂编码不能为空", trigger: "blur" }, | 
 |  |  | 
 |  |  |  | 
 |  |  | const { queryParams, form, rules } = toRefs(data); | 
 |  |  |  | 
 |  |  | // 分页属性 | 
 |  |  | const page = ref({ | 
 |  |  |   total: 0, | 
 |  |  |   current: 1, | 
 |  |  |   size: 10 | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | // 表格配置  | 
 |  |  | const columns = ref([ | 
 |  |  |   { type: 'checkbox', width: 60, align:"center"}, | 
 |  |  |   { type: 'seq', title: '序号', width: 60 }, | 
 |  |  |   { | 
 |  |  |     title: '车间名称', | 
 |  |  |     field: 'shopName', | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: '车间代码', | 
 |  |  |     field: 'shopCode', | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: '工厂代码', | 
 |  |  |     field: 'plantCode', | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: '启用状态', | 
 |  |  |     field: 'status', | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: '创建者', | 
 |  |  |     field: 'createBy', | 
 |  |  |   }, | 
 |  |  |   { | 
 |  |  |     title: '创建时间', | 
 |  |  |     field: 'createTime', | 
 |  |  |   }, | 
 |  |  |   { title: '操作', width: 100, fixed:"right", slots: { default: 'buttons' } } | 
 |  |  | ]); | 
 |  |  |  | 
 |  |  | /** 查询车间列表 */ | 
 |  |  | function getList() { | 
 |  |  |   loading.value = true; | 
 |  |  |   listAps_shop(queryParams.value).then(response => { | 
 |  |  |     aps_shopList.value = response.rows; | 
 |  |  |     total.value = response.total; | 
 |  |  |     page.value.total = response.total; | 
 |  |  |     loading.value = false; | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  | 
 |  |  |     updateTime: null | 
 |  |  |   }; | 
 |  |  |   proxy.resetForm("aps_shopRef"); | 
 |  |  |   shopNameRules.value = null; | 
 |  |  |   shopCodeRules.value = null; | 
 |  |  |   plantCodeRules.value = null; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | /** 搜索按钮操作 */ | 
 |  |  | function handleQuery() { | 
 |  |  |   page.value.current = 1; | 
 |  |  |   queryParams.value.pageNum = 1; | 
 |  |  |   getList(); | 
 |  |  | } | 
 |  |  | 
 |  |  |     form.value = response.data; | 
 |  |  |     open.value = true; | 
 |  |  |     title.value = "修改车间"; | 
 |  |  |     shopNameRules.value = form.value.shopName; | 
 |  |  |     shopCodeRules.value = form.value.shopCode; | 
 |  |  |     plantCodeRules.value = form.value.plantCode; | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | 
 |  |  |     loading.value = false; | 
 |  |  |   }); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | /** 检查车间名字重复 */ | 
 |  |  | const checkShopNameExists = async (value) => { | 
 |  |  |   return new Promise((resolve) => { | 
 |  |  |     queryParams.value = {}; | 
 |  |  |     queryParams.value.shopName = value; | 
 |  |  |     queryParams.value.plantCode = form.value.plantCode; | 
 |  |  |     listAps_shop(queryParams.value).then(response => { | 
 |  |  |       console.log(response); | 
 |  |  |       if(response.total === 0){ | 
 |  |  |         resolve(false); | 
 |  |  |       }else{ | 
 |  |  |         resolve(true); | 
 |  |  |       } | 
 |  |  |     }); | 
 |  |  |     queryParams.value = {}; | 
 |  |  |   }); | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | /** 检查车间编码重复 */ | 
 |  |  | const checkShopCodeExists = async (value) => { | 
 |  |  |   return new Promise((resolve) => { | 
 |  |  |     queryParams.value = {}; | 
 |  |  |     queryParams.value.shopCode = value; | 
 |  |  |     queryParams.value.plantCode = form.value.plantCode; | 
 |  |  |     listAps_shop(queryParams.value).then(response => { | 
 |  |  |       if(response.total === 0){ | 
 |  |  |         resolve(false); | 
 |  |  |       }else{ | 
 |  |  |         resolve(true); | 
 |  |  |       } | 
 |  |  |     }); | 
 |  |  |     queryParams.value = {}; | 
 |  |  |   }); | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | getPlantList(); | 
 |  |  | getList(); | 
 |  |  |  | 
 |  |  | const shopNameInputRef = ref(null); | 
 |  |  | const aps_shopRef = ref(null); | 
 |  |  |  | 
 |  |  | watch(() => form.value.shopName, (newValue, oldValue) => { | 
 |  |  |   nextTick(() => { | 
 |  |  |     if (newValue!== oldValue && proxy.$refs["aps_shopRef"] != null) { | 
 |  |  |       proxy.$refs["aps_shopRef"].validateField('shopCode'); | 
 |  |  |     } | 
 |  |  |   }); | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | watch(() => form.value.shopCode, (newValue, oldValue) => { | 
 |  |  |   nextTick(() => { | 
 |  |  |     if (newValue!== oldValue && proxy.$refs["aps_shopRef"] != null) { | 
 |  |  |       proxy.$refs["aps_shopRef"].validateField('shopName'); | 
 |  |  |     } | 
 |  |  |   }); | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | watch(() => form.value.plantCode, (newValue, oldValue) => { | 
 |  |  |     nextTick(() => { | 
 |  |  |       if (newValue!== oldValue && proxy.$refs["aps_shopRef"] != null) { | 
 |  |  |         proxy.$refs["aps_shopRef"].validateField('shopName'); | 
 |  |  |         proxy.$refs["aps_shopRef"].validateField('shopCode'); | 
 |  |  |       } | 
 |  |  |     }); | 
 |  |  | }); | 
 |  |  |  | 
 |  |  | function changePageNo(currentPage) { | 
 |  |  |   page.value.current = currentPage; | 
 |  |  |   queryParams.value.pageNum = currentPage; | 
 |  |  |   getList(); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | function changePageSize(pageSize) { | 
 |  |  |   page.value.current = 1; | 
 |  |  |   queryParams.value.pageNum = 1; | 
 |  |  |   queryParams.value.pageSize = pageSize; | 
 |  |  |   getList(); | 
 |  |  | } | 
 |  |  |  | 
 |  |  | // 多选框选中数据 | 
 |  |  | const handleCheckboxChange = (data) => { | 
 |  |  |   ids.value = data.records.map(item => item.id); | 
 |  |  |   single.value = data.records.length != 1; | 
 |  |  |   multiple.value = !data.records.length; | 
 |  |  | }; | 
 |  |  |  | 
 |  |  | </script> |