yyb
21 小时以前 25508db9e43fe793d7a34fa2d8ca1d7244d887a6
pages/wareHouse/nuclearScale/createwriteoffform.vue
@@ -4,77 +4,100 @@
      <view class="packing-registration-bg" />
      <u-navbar title="核磅录入" :background="background" :border-bottom="false" :title-bold="true" title-color="#000"
         back-icon-color="#000" />
      <u-form :model="form" ref="uForm" :label-width="200" :rules="rules" :error-type="['toast']" class="uForm">
         <u-form-item label="产品类型" :border-bottom="false" prop="value0">
            <u-radio-group v-model="form.value0">
               <u-radio name="导体">导体</u-radio>
               <u-radio name="铜杆">铜杆</u-radio>
               <u-radio name="导体2.6">导体2.6</u-radio>
      <u-form :model="form" ref="uForm" :label-width="210" labelAlign="left" :rules="rules" :error-type="['toast']"
         class="uForm">
         <u-form-item label="产品类型:" :border-bottom="false" prop="productType">
            <u-radio-group v-model="form.productType" @change="handleProductTypeChange">
               <u-radio name="1">导体</u-radio>
               <u-radio name="2">铜杆</u-radio>
               <u-radio name="3">导体2.6</u-radio>
            </u-radio-group>
         </u-form-item>
         <u-form-item label="替换二维码" :border-bottom="false" prop="value1">
            <u-radio-group v-model="form.value1">
         <u-form-item label="替换二维码:" :border-bottom="false" prop="replace">
            <u-radio-group v-model="form.replace">
               <u-radio name="1">是</u-radio>
               <u-radio name="0">否</u-radio>
            </u-radio-group>
         </u-form-item>
         <u-form-item label="车牌号" :border-bottom="false" prop="value2">
            <u-input v-model="form.value2" type="select" placeholder="请输入车牌号" @click="lpn" />
         <u-form-item label="车牌号:" :border-bottom="false" prop="licensePlate">
            <u-input v-model="form.licensePlate" type="select" placeholder="请输入车牌号" @click="lpn" />
         </u-form-item>
         <u-form-item label="客户名称" :border-bottom="false" prop="value3">
         <u-form-item label="客户名称1:" :border-bottom="false" prop="customerName1">
            <picker class="item-one item-two" style="width: 100%; text-align: right"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               @change="selClientChange($event, selClientList, 'customerName1')" :value="selClientIndex1"
               :range="selClientList" range-key="label">
               <view>
                  <text :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }">{{
                locNoNumIndex == null
                  <text :style="{
                color: selClientIndex1 == null ? '#a5abb4' : '#0c0c0c',
              }">{{
                selClientIndex1 == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
                  : selClientList[selClientIndex1].label
              }}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
            <u-icon v-if="selClientIndex1 == null" name="arrow-right" color="#687792" size="28"></u-icon>
         </u-form-item>
         <u-form-item label="发货通知单号" :border-bottom="false" prop="value4">
            <u-input v-model="form.value4" placeholder="" disabled />
         <u-form-item label="发货通知单号1:" :border-bottom="false" prop="shippingNoticeNo1">
            <u-input v-model="form.shippingNoticeNo1" placeholder="" disabled />
         </u-form-item>
         <u-form-item label="生产车间" :border-bottom="false" prop="value5">
         <u-form-item label="客户名称2:" :border-bottom="false" prop="customerName2">
            <picker class="item-one item-two" style="width: 100%; text-align: right"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               @change="selClientChange($event, selClientList, 'customerName2')" :value="selClientIndex2"
               :range="selClientList" range-key="label">
               <view>
                  <text :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }">{{
                locNoNumIndex == null
                  <text :style="{
                color: selClientIndex2 == null ? '#a5abb4' : '#0c0c0c',
              }">{{
                selClientIndex2 == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
                  : selClientList[selClientIndex2].label
              }}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
            <u-icon v-if="selClientIndex2 == null" name="arrow-right" color="#687792" size="28"></u-icon>
         </u-form-item>
         <u-form-item label="司磅员" :border-bottom="false" prop="value6">
         <u-form-item label="发货通知单号2:" :border-bottom="false" prop="shippingNoticeNo2">
            <u-input v-model="form.shippingNoticeNo2" placeholder="" disabled />
         </u-form-item>
         <u-form-item label="生产车间:" :border-bottom="false" prop="workshop">
            <picker class="item-one item-two" style="width: 100%; text-align: right"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               @change="workshopChange($event, workshopList)" :value="workshopIndex" :range="workshopList"
               range-key="label" :disabled="!form.productType">
               <view>
                  <text :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }">{{
                locNoNumIndex == null
                  <text :style="{ color: workshopIndex == null ? '#a5abb4' : '#0c0c0c' }">{{
                workshopIndex == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
                  : workshopList[workshopIndex].label
              }}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
            <u-icon v-if="workshopIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
         </u-form-item>
         <u-form-item label="叉车工" :border-bottom="false" prop="value7">
            <u-input v-model="form.value7" type="select" placeholder="请选择" @click="openForkliftDriverList" />
         <u-form-item label="司磅员:" :border-bottom="false" prop="weighingOperator">
            <picker class="item-one item-two" style="width: 100%; text-align: right"
               @change="weighmanChange($event, weighmanList)" :value="weighmanIndex" :range="weighmanList"
               range-key="label">
               <view>
                  <text :style="{ color: weighmanIndex == null ? '#a5abb4' : '#0c0c0c' }">{{
                weighmanIndex == null
                  ? "请选择"
                  : weighmanList[weighmanIndex].label
              }}</text>
               </view>
            </picker>
            <u-icon v-if="weighmanIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
         </u-form-item>
         <u-form-item label="叉车工:" :border-bottom="false" prop="forkliftOperator">
            <u-input v-model="form.forkliftOperator" type="select" placeholder="请选择"
               @click="openForkliftDriverList" />
         </u-form-item>
      </u-form>
      <u-button type="primary" class="bottom-button1" @click="submit">创建</u-button>
      <!--车牌号 -->
      <modalBg ref="modalBg" :confirm="confirm">
         <u-field v-model="form.value2" label="车牌号:" placeholder="请输入" :border-bottom="false">
         <u-field v-model="form.licensePlate" label="车牌号:" placeholder="请输入" :border-bottom="false">
         </u-field>
      </modalBg>
      <!-- 叉车工 -->
@@ -103,32 +126,7 @@
      },
      data() {
         return {
            checkboxList: [{
                  label: "工人1",
                  value: "a",
                  checked: false,
               },
               {
                  label: "工人2",
                  value: "2",
                  checked: false,
               },
               {
                  label: "工人3",
                  value: "3",
                  checked: false,
               },
               {
                  label: "工人4",
                  value: "4",
                  checked: false,
               },
               {
                  label: "工人",
                  value: "5",
                  checked: false,
               },
            ],
            checkboxList: [],
            background: {
               backgroundImage: `url(${content_bg})`,
               backgroundAttachment: "fixed",
@@ -138,96 +136,228 @@
            show: false,
            num: 1,
            form: {
               value0: "",
               value1: "",
               value2: "",
               value3: "",
               value4: "111",
               value5: "",
               value6: "",
               value7: "",
               value8: "",
               replace: '0',
               productType: '',
               licensePlate: '',
               customerName1: '',
               shippingNoticeNo1: '',
               customerName2: '',
               shippingNoticeNo2: '',
               workshop: '',
               weighingOperator: '',
               forkliftOperator: '',
            },
            rules: {
               value0: [{
               productType: [{
                  required: true,
                  message: "请选择产品类型",
                  trigger: ["change"],
               }, ],
               value1: [{
               replace: [{
                  required: true,
                  message: "请选择是否替换二维码",
                  trigger: ["change", "blur"],
               }, ],
               value2: [{
               licensePlate: [{
                  required: true,
                  message: "请输入车牌号",
                  trigger: ["change", "blur"],
               }, ],
               // value3: [
               //   {
               //     required: true,
               //     message: "请选择客户名称",
               //     trigger: ["change", "blur"],
               //   },
               // ],
               value4: [{
                  required: true,
                  message: "请输入发货通知单号",
                  trigger: ["change"],
               }, ],
               value5: [{
               workshop: [{
                  required: true,
                  message: "请选择生产车间",
                  trigger: ["change"],
               }, ],
               value6: [{
               weighingOperator: [{
                  required: true,
                  message: "请选择司磅员",
                  trigger: ["change"],
               }, ],
               value7: [{
                  type: "array",
               forkliftOperator: [{
                  type: "string",
                  required: true,
                  message: "请至少选择一个叉车工",
                  trigger: ["change"],
               }, ],
            },
            locNoList: [{
                  value: "0",
                  label: "公司1",
               },
               {
                  value: "1",
                  label: "公司2",
               },
               {
                  value: "2",
                  label: "公司3",
               },
               {
                  value: "3",
                  label: "公司4",
               },
               {
                  value: "4",
                  label: "公司5",
               },
               {
                  value: "5",
                  label: "公司6",
               },
            ],
            locNoNumIndex: null,
            // 客户名称
            selClientList: [],
            selClientIndex1: null,
            selClientIndex2: null,
            // 生产车间
            workshopList: [],
            workshopIndex: null,
            // 司磅员
            weighmanList: [],
            weighmanIndex: null,
            showModal: false,
            selectedItems: [],
            id1: '',
            id2: '',
            isSubmitting: false
         };
      },
      onReady() {
         this.$refs.uForm.setRules(this.rules);
         // 仅在组件初次加载时获取数据
         if (this.selClientList.length === 0) {
            this.fetchClients();
         }
         if (this.workshopList.length === 0) {
            this.fetchWorkshops();
         }
         if (this.checkboxList.length === 0) {
            this.fetchForkliftOperators();
         }
         if (this.weighmanList.length === 0) {
            this.fetchWeighmen();
         }
      },
      onShow() {},
      onShow() {
         // 重置表单数据
         this.form = {
            replace: '0',
            productType: '',
            licensePlate: '',
            customerName1: '',
            shippingNoticeNo1: '',
            customerName2: '',
            shippingNoticeNo2: '',
            workshop: '',
            weighingOperator: '',
            forkliftOperator: '',
         };
         this.selClientIndex1 = null;
         this.selClientIndex2 = null;
         this.workshopIndex = null;
         this.weighmanIndex = null;
         this.checkboxList = this.checkboxList.map(item => ({
            ...item,
            checked: false
         }));
         this.$refs.uForm && this.$refs.uForm.resetValidation();
      },
      methods: {
         /**
          * 获取客户列表
          */
         fetchClients() {
            this.$u.api.NuclearScaleEntry.selClient().then((res) => {
               console.log('客户名称', res)
               if (res.code === 0) {
                  res.data.forEach((i) => {
                     const obj = Object.assign({
                        label: i.customerName,
                        value: i.customerName,
                        shippingNoticeNo: i.shippingNoticeNo,
                        id: i.id
                     });
                     this.selClientList.push(obj);
                  });
               } else {
                  uni.showToast({
                     title: res.msg || '获取客户名称失败',
                     icon: 'none'
                  });
               }
            }).catch(err => {
               uni.showToast({
                  title: '网络错误,获取客户名称失败',
                  icon: 'none'
               });
               console.error('获取客户名称错误:', err);
            });
         },
         /**
          * 获取车间列表
          */
         fetchWorkshops() {
            this.$u.api.dictData({
               dictType: 'workshop'
            }).then(res => {
               if (res.code === 0 && res.data.length > 0) {
                  res.data.forEach(i => {
                     const obj = Object.assign({
                        label: i.label,
                        value: i.value,
                     })
                     this.workshopList.push(obj)
                  })
               } else {
                  uni.showToast({
                     title: res.msg || '获取车间列表失败',
                     icon: 'none'
                  });
               }
            }).catch(err => {
               uni.showToast({
                  title: '网络错误,获取车间列表失败',
                  icon: 'none'
               });
               console.error('获取车间列表错误:', err);
            });
         },
         /**
          * 获取叉车工列表
          */
         fetchForkliftOperators() {
            this.$u.api.dictData({
               dictType: 'forklift'
            }).then(res => {
               if (res.code === 0 && res.data.length > 0) {
                  res.data.forEach(i => {
                     const obj = Object.assign({
                        label: i.label,
                        value: i.label,
                     })
                     this.checkboxList.push(obj)
                  })
               } else {
                  uni.showToast({
                     title: res.msg || '获取叉车工列表失败',
                     icon: 'none'
                  });
               }
            }).catch(err => {
               uni.showToast({
                  title: '网络错误,获取叉车工列表失败',
                  icon: 'none'
               });
               console.error('获取叉车工列表错误:', err);
            });
         },
         /**
          * 获取司磅员列表
          */
         fetchWeighmen() {
            this.$u.api.dictData({
               dictType: 'weighing'
            }).then(res => {
               if (res.code === 0 && res.data.length > 0) {
                  res.data.forEach(i => {
                     const obj = Object.assign({
                        label: i.label,
                        value: i.label,
                     })
                     this.weighmanList.push(obj)
                  })
               } else {
                  uni.showToast({
                     title: res.msg || '获取司磅员列表失败',
                     icon: 'none'
                  });
               }
            }).catch(err => {
               uni.showToast({
                  title: '网络错误,获取司磅员列表失败',
                  icon: 'none'
               });
               console.error('获取司磅员列表错误:', err);
            });
         },
         // 复选框变化事件
         checkboxChange(e) {
            const values = e.detail.value;
@@ -241,43 +371,196 @@
         // 确认选择
         confirmSelection() {
            this.form.value7 = this.checkboxList
            // 将选中的叉车工标签数组转为以逗号分隔的字符串
            this.form.forkliftOperator = this.checkboxList
               .filter((item) => item.checked)
               .map((item) => item.label);
               .map((item) => item.label)
               .join(',');
         },
         cancel() {},
         openForkliftDriverList() {
            this.showModal = true;
         },
         locNoNumBindChange(e, storage) {
         // 客户名称
         selClientChange(e, storage, code) {
            if (storage.length <= 0) {
               this.locNoNumIndex = null;
               this.selClientIndex1 = null;
               this.selClientIndex2 = null;
               return;
            }
            this.locNoNumIndex = e.target.value;
            this.form.value3 = storage[this.locNoNumIndex].label;
            const selectedIndex = e.target.value;
            const selectedCustomer = storage[selectedIndex];
            // 检查是否选择了相同的客户
            if (code === "customerName1" && this.selClientIndex2 === selectedIndex) {
               uni.showToast({
                  title: '不能选择相同的客户',
                  icon: 'none'
               });
               return;
            }
            if (code === "customerName2" && this.selClientIndex1 === selectedIndex) {
               uni.showToast({
                  title: '不能选择相同的客户',
                  icon: 'none'
               });
               return;
            }
            if (code === "customerName2") {
               this.selClientIndex2 = selectedIndex;
               this.form.customerName2 = selectedCustomer.label;
               this.form.shippingNoticeNo2 = selectedCustomer.shippingNoticeNo;
               this.id2 = selectedCustomer.id;
            }
            if (code === "customerName1") {
               this.selClientIndex1 = selectedIndex;
               this.form.customerName1 = selectedCustomer.label;
               this.form.shippingNoticeNo1 = selectedCustomer.shippingNoticeNo;
               this.id1 = selectedCustomer.id
            }
         },
         // 打开弹框--后面还需要监听扫码枪扫码结果,赋值给报工单号字段,然后打开弹框选择订单号等操作
         // 生产车间
         workshopChange(e, storage) {
            if (storage.length <= 0) {
               this.workshopIndex = null;
               return;
            }
            const productType = this.form.productType;
            const selectedWorkshop = storage[e.target.value];
            // 检查产品类型是否为铜杆(值为2)
            if (productType === '2') {
               // 铜杆只能选择铜杆相关车间
               if (!selectedWorkshop.label.includes('铜杆')) {
                  uni.showModal({
                     title: "提示",
                     content: "铜杆产品只能选择铜杆相关车间",
                     showCancel: false
                  });
                  return;
               }
            } else {
               // 导体产品不能选择铜杆车间
               if (selectedWorkshop.label.includes('铜杆')) {
                  uni.showModal({
                     title: "提示",
                     content: "导体产品不能选择铜杆车间",
                     showCancel: false
                  });
                  return;
               }
            }
            this.workshopIndex = e.target.value;
            this.form.workshop = selectedWorkshop.label;
         },
         // 司磅员
         weighmanChange(e, storage) {
            if (storage.length <= 0) {
               this.weighmanIndex = null;
               return;
            }
            this.weighmanIndex = e.target.value;
            this.form.weighingOperator = storage[this.weighmanIndex].label;
         },
         lpn() {
            this.$refs.modalBg.open();
         },
         // 弹框保存
         confirm() {
            console.log("保存", this.form.value1);
            // 请求接口,根据工单号查询其他信息并赋值
         confirm() {},
         /**
          * 产品类型变化时清空车间选择
          */
         handleProductTypeChange() {
            this.workshopIndex = null;
            this.form.workshop = '';
         },
         // 提交按钮
         submit() {
            if (!this.$refs.uForm.validate()) {
               console.log("1111");
               return;
            }
            if (this.form.value3 === "") {
         async submit() {
            if (this.isSubmitting) return;
            try {
               // 统一表单验证
               if (!await this.validateForm()) return;
               // 构建提交数据
               const submitData = this.buildSubmitData().customerList;
               console.log('提交的数据',submitData)
               this.isSubmitting = true;
               const res = await this.$u.api.NuclearScaleEntry.createMain(submitData);
               if (res.code === 0) {
                  this.$u.toast("提交成功");
                  uni.navigateBack();
               } else {
               uni.showToast({
                  title: "请先选择客户名称",
                  icon: "none",
                     title: res.msg || '提交失败:业务处理错误',
                     icon: 'none'
               });
               return;
                  console.error('业务错误:', res);
            }
            } catch (err) {
               if (err.type === 'validation') {
                  uni.showToast({
                     title: err.message,
                     icon: 'none'
                  });
               } else if (err.message.includes('Network Error')) {
                  uni.showToast({
                     title: '网络连接错误,请检查网络后重试',
                     icon: 'none'
                  });
               } else {
                  uni.showToast({
                     title: '系统错误,请稍后重试',
                     icon: 'none'
                  });
               }
               console.error('提交表单错误:', err);
            } finally {
               this.isSubmitting = false;
            }
         },
         // 统一表单验证
         async validateForm() {
            // 使用uView表单验证
            if (!await this.$refs.uForm.validate()) {
               return false;
            }
            // 客户名称验证
            if (!this.form.customerName1 || !this.form.customerName2) {
               throw { type: 'validation', message: '请先选择客户名称' };
            }
            return true;
         },
         // 构建提交数据
         buildSubmitData() {
            // 创建客户数据的辅助函数
            const createCustomerItem = (customerIndex) => ({
               customerName: this.form[`customerName${customerIndex}`],
               shippingNoticeNo: this.form[`shippingNoticeNo${customerIndex}`],
               shippingNoticeId: this[`id${customerIndex}`],
               replace: this.form.replace,
               productType: this.form.productType,
               licensePlate: this.form.licensePlate,
               workshop: this.form.workshop,
               weighingOperator: this.form.weighingOperator,
               forkliftOperator: this.form.forkliftOperator,
            });
            // 构建客户列表
            const customerList = [1, 2].map(createCustomerItem);
            return {
               customerList
            };
         },
      },
   };
@@ -314,11 +597,13 @@
   /* 复选框样式 */
   .checkbox-item {
      width: 200px;
      width: 230px;
      display: flex;
      align-items: center;
      padding: 20rpx 0;
      border-bottom: 1rpx solid #f5f5f5;
      background-color: #f8f9fa;
      .label{
         position: relative;
         left: 130px;