取消报工联调

yyb

7 天以前 e23c7ace60d28e4c2a6b9e7245a85462becfffc6

 pages/wareHouse/nuclearScale/createwriteoffform.vue

@@ -1,232 +1,437 @@
<template>
   <!-- 核磅录入 -->
   <div class="page">
      <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-radio-group>
         </u-form-item>
         <u-form-item label="替换二维码" :border-bottom="false" prop="value1">
            <u-radio-group v-model="form.value0">
               <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>
         <u-form-item label="客户名称" :border-bottom="false" prop="value3">
            <picker class="item-one" style="width: 100%;text-align: right;"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               <view>
                  <text>{{locNoNumIndex==null ? "请选择":locNoList[locNoNumIndex].label}}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == 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>
         <u-form-item label="生产车间" :border-bottom="false" prop="value5">
            <picker class="item-one" style="width: 100%;text-align: right;"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               <view>
                  <text>{{locNoNumIndex==null ? "请选择":locNoList[locNoNumIndex].label}}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == null" name="arrow-right" color="#687792" size="28"></u-icon>
         </u-form-item>
         <u-form-item label="司磅员" :border-bottom="false" prop="value6">
            <picker class="item-one" style="width: 100%;text-align: right;"
               @change="locNoNumBindChange($event, locNoList)" :value="locNoNumIndex" :range="locNoList"
               range-key="label">
               <view>
                  <text>{{locNoNumIndex==null ? "请选择":locNoList[locNoNumIndex].label}}</text>
               </view>
            </picker>
            <u-icon v-if="locNoNumIndex == 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>
      </u-form>
      <u-button type="primary" class="bottom-button" @click="submit">提交</u-button>
  <!-- 核磅录入 -->
  <div class="page">
    <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-radio-group>
      </u-form-item>
      <u-form-item label="替换二维码" :border-bottom="false" prop="value1">
        <u-radio-group v-model="form.value1">
          <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>
      <u-form-item label="客户名称" :border-bottom="false" prop="value3">
        <picker
          class="item-one item-two"
          style="width: 100%; text-align: right"
          @change="locNoNumBindChange($event, locNoList)"
          :value="locNoNumIndex"
          :range="locNoList"
          range-key="label"
        >
          <view>
            <text
              :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }"
              >{{
                locNoNumIndex == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
              }}</text
            >
          </view>
        </picker>
        <u-icon
          v-if="locNoNumIndex == 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>
      <u-form-item label="生产车间" :border-bottom="false" prop="value5">
        <picker
          class="item-one item-two"
          style="width: 100%; text-align: right"
          @change="locNoNumBindChange($event, locNoList)"
          :value="locNoNumIndex"
          :range="locNoList"
          range-key="label"
        >
          <view>
            <text
              :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }"
              >{{
                locNoNumIndex == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
              }}</text
            >
          </view>
        </picker>
        <u-icon
          v-if="locNoNumIndex == null"
          name="arrow-right"
          color="#687792"
          size="28"
        ></u-icon>
      </u-form-item>
      <u-form-item label="司磅员" :border-bottom="false" prop="value6">
        <picker
          class="item-one item-two"
          style="width: 100%; text-align: right"
          @change="locNoNumBindChange($event, locNoList)"
          :value="locNoNumIndex"
          :range="locNoList"
          range-key="label"
        >
          <view>
            <text
              :style="{ color: locNoNumIndex == null ? '#a5abb4' : '#0c0c0c' }"
              >{{
                locNoNumIndex == null
                  ? "请选择"
                  : locNoList[locNoNumIndex].label
              }}</text
            >
          </view>
        </picker>
        <u-icon
          v-if="locNoNumIndex == 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>
    </u-form>
    <u-button type="primary" class="bottom-button" @click="submit"
      >创建</u-button
    >

      <!--车牌号 -->
      <modalBg ref="modalBg" :confirm="confirm">
         <u-field v-model="form.value2" label="车牌号：" placeholder="请输入" :border-bottom="false">
         </u-field>
      </modalBg>
      <u-modal v-model="showModal" title="" :show-cancel-button="true" :show-confirm-button="true" @confirm="confirm"
         @cancel="cancel">
         <!-- <u-checkbox-group> -->
            <!-- <u-checkbox :name="item.name" v-for="(item, index) in checkboxList" :key="index" v-model="item.value"
               @change="changeCheckbox">
               {{ item.name }}
            </u-checkbox> -->
         <!-- </u-checkbox-group> -->
      </u-modal>
   </div>
    <!--车牌号 -->
    <modalBg ref="modalBg" :confirm="confirm">
      <u-field
        v-model="form.value2"
        label="车牌号："
        placeholder="请输入"
        :border-bottom="false"
      >
      </u-field>
    </modalBg>
    <!-- 叉车工 -->
    <u-modal
      v-model="showModal"
      title=""
      :show-cancel-button="true"
      :show-confirm-button="true"
      @confirm="confirmSelection"
      @cancel="cancel"
    >
      <view class="popup-content">
        <view class="popup-header">
          <checkbox-group @change="checkboxChange">
            <label
              class="checkbox-item"
              v-for="(item, index) in checkboxList"
              :key="index"
            >
              <checkbox :value="item.value" :checked="item.checked" />
              <text class="label">{{ item.label }}</text>
            </label>
          </checkbox-group>
        </view>
      </view>
    </u-modal>
  </div>
</template>

<script>
   import modalBg from "@/components/modal/modal-bg.vue";
   import content_bg from "@/static/custom/packing/backBg.png";
   export default {
      components: {
         modalBg
      },
      data() {
         return {
            // checkboxList: [{
            //       name: '工人1',
            //       value: '1'
            //    },
            //    {
            //       name: '工人2',
            //       value: '2'
            //    },
            //    {
            //       name: '工人3',
            //       value: '3'
            //    },
            //    {
            //       name: '工人4',
            //       value: '4'
            //    },
            //    {
            //       name: '工人5',
            //       value: '5'
            //    },
            // ],
            background: {
               backgroundImage: `url(${content_bg})`,
               backgroundAttachment: "fixed",
               backgroundSize: "100% auto",
               backgroundRepeat: "no-repeat",
            },
            show: false,
            num: 1,
            form: {
               value0: "",
               value1: "",
               value2: "",
               value3: "",
               value4: "",
               value5: "",
               value6: "",
               value7: "",
               value8: "",
            },
            rules: {
               value0: [{
                  required: true,
                  message: "请选择车间",
                  trigger: ["change"],
               }, ],
               value1: [{
                  required: true,
                  message: "请选择报工单号",
                  trigger: ["change", "blur"],
               }, ],
               value2: [{
                  required: true,
                  message: "请选择工序",
                  trigger: ["change", "blur"],
               }, ],
               value3: [{
                  required: true,
                  message: "请选择订单号",
                  trigger: ["change", "blur"],
               }, ],
               value9: [{
                  required: true,
                  message: "请选择报工类型",
                  trigger: ["change"],
               }, ],
               value10: [{
                  required: true,
                  message: "请选择接收零件类型",
                  trigger: ["change"],
               }, ],
               value11: [{
                  type: "array",
                  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: 0,
        showModal:false
         };
      },
      onReady() {
         this.$refs.uForm.setRules(this.rules);
      },
      onShow() {},
  methods: {
    openForkliftDriverList() {
        this.showModal = true
import modalBg from "@/components/modal/modal-bg.vue";
import content_bg from "@/static/custom/packing/backBg.png";
export default {
  components: {
    modalBg,
  },
  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: "工人5",
          value: "5",
          checked: false,
        },
      ],
      background: {
        backgroundImage: `url(${content_bg})`,
        backgroundAttachment: "fixed",
        backgroundSize: "100% auto",
        backgroundRepeat: "no-repeat",
      },
         locNoNumBindChange(e, storage) {
            if (storage.length <= 0) {
               this.locNoNumIndex = null
               return
            }
            this.locNoNumIndex = e.target.value
            this.registerInfo.locNo = storage[this.locNoNumIndex].label
            console.log('locNoNumIndex', this.registerInfo.locNo)
         },
         // 打开弹框--后面还需要监听扫码枪扫码结果，赋值给报工单号字段，然后打开弹框选择订单号等操作
         lpn() {
            this.$refs.modalBg.open();
         },
         // 弹框保存
         confirm() {
            console.log("保存", this.form.value1);
            // 请求接口，根据工单号查询其他信息并赋值
         },
         // 提交按钮
         submit() {
            this.show = true;
         },
      },
   };
      show: false,
      num: 1,
      form: {
        value0: "",
        value1: "",
        value2: "",
        value3: "",
        value4: "111",
        value5: "",
        value6: "",
        value7: "",
        value8: "",
      },
      rules: {
        value0: [
          {
            required: true,
            message: "请选择产品类型",
            trigger: ["change"],
          },
        ],
        value1: [
          {
            required: true,
            message: "请选择是否替换二维码",
            trigger: ["change", "blur"],
          },
        ],
        value2: [
          {
            required: true,
            message: "请输入车牌号",
            trigger: ["change", "blur"],
          },
        ],
        // value3: [
        //   {
        //     required: true,
        //     message: "请选择客户名称",
        //     trigger: ["change", "blur"],
        //   },
        // ],
        value4: [
          {
            required: true,
            message: "请输入发货通知单号",
            trigger: ["change"],
          },
        ],
        value5: [
          {
            required: true,
            message: "请选择生产车间",
            trigger: ["change"],
          },
        ],
        value6: [
          {
            required: true,
            message: "请选择司磅员",
            trigger: ["change"],
          },
        ],
        value7: [
          {
            type: "array",
            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,
      showModal: false,
      selectedItems: [],
    };
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
  },
  onShow() {},
  methods: {
    // 复选框变化事件
    checkboxChange(e) {
      const values = e.detail.value;
      this.checkboxList = this.checkboxList.map((item) => {
        return {
          ...item,
          checked: values.includes(item.value),
        };
      });
    },

    // 确认选择
    confirmSelection() {
      this.form.value7 = this.checkboxList
        .filter((item) => item.checked)
        .map((item) => item.label);
    },
    openForkliftDriverList() {
      this.showModal = true;
    },
    locNoNumBindChange(e, storage) {
      if (storage.length <= 0) {
        this.locNoNumIndex = null;
        return;
      }
      this.locNoNumIndex = e.target.value;
      this.form.value3 = storage[this.locNoNumIndex].label;
    },
    // 打开弹框--后面还需要监听扫码枪扫码结果，赋值给报工单号字段，然后打开弹框选择订单号等操作
    lpn() {
      this.$refs.modalBg.open();
    },
    // 弹框保存
    confirm() {
      console.log("保存", this.form.value1);
      // 请求接口，根据工单号查询其他信息并赋值
    },
    // 提交按钮
    submit() {
      if (!this.$refs.uForm.validate()) {
        console.log("1111");
        return;
      }
      if (this.form.value3 === "") {
        uni.showToast({
          title: "请先选择客户名称",
          icon: "none",
        });
        return;
      }
    },
  },
};
</script>

<style lang="scss">
   @import "index.scss";
<style lang="scss" scoped>
@import "index.scss";

/* 弹窗样式 */
.popup-content {
  padding: 30rpx;
  max-height: 70vh;
  overflow-y: auto;
}

.popup-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 20rpx;
  border-bottom: 1rpx solid #eee;
  margin-bottom: 20rpx;
}

.title {
  font-size: 32rpx;
  font-weight: bold;
}

.confirm-btn {
  color: #007aff;
  font-size: 28rpx;
}

/* 复选框样式 */
.checkbox-item {
  display: flex;
  align-items: center;
  padding: 20rpx 0;
  border-bottom: 1rpx solid #f5f5f5;
}

.checkbox-item:last-child {
  border-bottom: none;
}

.checkbox-item .label {
  margin-left: 20rpx;
}

.item-one {
  font-size: 30rpx;
  color: #0c0c0c;
  margin-right: 6rpx;
}

.item-two {
  font-size: 30rpx;
  color: #a5abb4;
  margin-right: 6rpx;
}
</style>