icore-pass/src/views/appoint/components/saleContract/addSalePlan.vue

<template>
  <!-- 添加销售计划 -->
  <div class="addSalePlan">
    <PageTitle>新增</PageTitle>
    <div class="form-box" style="margin-right: 10rem">
      <dil-form :formId="281" v-model="form1" ref="from1"></dil-form>
    </div>
    <div class="table_form">
      <div class="materialId">
        <span class="text"> 物资： </span>
        <el-button type="primary" class="btn" @click="table = true"
          >浏览</el-button
        >
      </div>
    </div>

    <div class="selectionTable">
      <el-table
        :data="selectionList"
        border
        style="width: 100%"
        highlight-current-row
      >
        <el-table-column type="index" width="50" label="序号" align="center">
        </el-table-column>
        <el-table-column
          v-for="(item, i) in tableTop"
          :key="i"
          :prop="item.prop"
          :label="item.label"
          align="center"
          show-overflow-tooltip
        >
          <template slot="scope" v-if="item.th_name !== '件数'">
            <span>{{ item.label }}</span>
          </template>
          <!-- 插入输入框 -->
          <template slot-scope="scope">
            <template v-if="item.slot">
              <template v-if="item.prop == 'orderPlanWeight'">
                <el-input v-model.number="scope.row.orderPlanWeight"></el-input>
              </template>
            </template>
            <template v-else>
              <span>{{ scope.row[item.prop] }}</span>
            </template>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-drawer
      title="选择物资信息"
      :visible.sync="table"
      direction="rtl"
      size="50%"
      :show-close="false"
    >
      <el-input placeholder="请输入内容" v-model="input" clearable> </el-input
      ><el-button type="primary" class="btn" @click="onclick">
        <i class="el-icon-search"></i>查询
      </el-button>
      <el-button @click="open">取消</el-button>
      <el-button type="primary" @click="makeSure1(2)">确定</el-button>
      <div class="tablecls">
        <!-- 查询所有的物资 -->
        <dilTable v-bind.sync="option" @selection-change="selectionChange">
      </dilTable>
      </div>
    </el-drawer>
    <div class="button-box">
      <el-button @click="cancel">取消</el-button>
      <el-button type="primary" @click="makeSure">确定</el-button>
    </div>
  </div>
</template>

<script>
import PageTitle from "@/components/Page/Title";

export default {
  components: { PageTitle },
  data() {
    return {
      input: "",
      table: false,
      form1: {},
      value: undefined,
      option: {
        // 表格请求数据的地址
        requestUrl: "/api/v1/ams/getAllSteelMaterialMes?apiId=232",
        // 控制显示多选列
        selectionType: "select",
      },
      selectionList: [],
      selectionList1: [],
      tableTop: [
        {
          prop: "materialCode",
          label: "物资编码",
          width: "140",
        },
        {
          prop: "materialName",
          label: "物资名称",
          width: "140",
        },
        {
          prop: "Specification",
          label: "规格型号",
          width: "140",
        },
        {
          prop: "orderPlanWeight",
          label: "件数",
          slot: true,
        },
      ],
    };
  },
  methods: {
    open() {
      if (this.selectionList1.length != 0) {
        this.$confirm("取消会将已选择的数据清空, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {
            this.selectionList1 = [];
            this.table = false;
          })
          .catch(() => {});
      } else {
        this.table = false;
      }
    },
    // 返回选中的物资信息
    selectionChange(selection) {
      this.selectionList1 = [];
      this.selectionList1 = selection;
    },
    // 返回主界面
    makeSure1() {
      this.selectionList1.forEach((e) => {
        this.selectionList.push(e);
      });
      this.selectionList1 = [];
      this.table = false;
    },
    // 框计算
    onclick() {
      this.option.requestUrl =
        "/api/v1/ams/getAllSteelMaterialMes?apiId=232&con=" + this.input;
    },
    // 确定
    makeSure() {
      // 判断是否为空的状态值（1为空，0为有值）
      let state = 0;
      if (
        sjTime(this.form1.planDate) &&
        this.form1.saleAreaId &&
        this.form1.insertUsername &&
        sjTime(this.form1.insertTime) &&
        this.form1.insertUpdateRemark
      ) {
        this.selectionList.forEach((e) => {
          if (!e.orderPlanWeight) {
            state = 1;
            return;
          }
        });
      } else {
        state = 1;
      }
      // 提示
      if (state == 1) {
        this.$message.error("不能存在空值！");
      }
      // 请求添加
      if (state == 0) {
        let amsSalePlan = {
          planDate: sjTime(this.form1.planDate),
          saleAreaId: this.form1.saleAreaId,
          insertUsername: this.form1.insertUsername,
          insertTime: sjTime(this.form1.insertTime),
          insertUpdateRemark: this.form1.insertUpdateRemark,
        };
        let map = {
          amsSalePlan: amsSalePlan,
          selectionList: this.selectionList,
        };
        // 掉用后端请求
        this.axios.post("/api/v1/ams/addAmsSalePlan", map).then((res) => {
          if (res.data.code == "200") {
            this.$router.go(-1);
          }
        });
      }
    },
    // 取消
    cancel() {
      this.$router.go(-1);
    },
  },
};
</script>
<style lang='scss' scoped>

</style>