BST_bigScreen/src/views/ProductionOrderList/Dispatchlist/confirm.vue

<template>
  <div>
    <FullPage
      title="查看详情"
      :list="list"
      @init="init"
      @searchData="search"
      :logList="logList"
      @selectTable="selectTable"
      @changePage="changePage"
      @changeSize="changeSize"
      :tableColums="tableColums"
      :tableData="tableData"
      :pageIndex="pageIndex"
      :pageSize="pageSize"
      :total="total"
    >
      <div slot="titleButton">
        <Button @click="back" style="margin-right:10px;">返回</Button>
        <Button @click="finish(selectIds, 1)" type="success" ghost
          >批量完成</Button
        >
      </div>
      <template slot="set" slot-scope="{ row }">
        <div>
          <a class="map-margin" @click="goOriginalPage(row)">原材料预算</a>
          <a
            v-if="row.state != 3"
            class="map-margin"
            style="color:#32C800"
            @click="finish(row, 1)"
            >完成</a
          >
          <a class="map-margin" @click="goDetial(row, 1)">查看详情</a>
        </div>
      </template>
    </FullPage>
      <Modal
       title="设置班组"
        v-model="finish_modal"
        width="400"
      
        @on-ok="finish_Ok">
        <Form>
          <FormItem label="完成班组:">
              <Select v-model="finish_nickname" style="width:180px">
                <Option
                  :value="item.id"
                  v-for="(item, index) in nickname_users"
                  :key="index"
                  >{{ item.nickname }}</Option
                >
              </Select>
            </FormItem>
        </Form>
      </Modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      finish_nickname:'',
      finish_modal:false,
      type: 1,
      logList: [{ title: "系统单号", value: "10998765" }],
      tableColums: [
        { type: "selection", fixed: "left", width: "90", align: "center" },
        {
          title: "工序分类",
          align: "center",
          minWidth: 150,
          key: "basic_title",
        },
        {
          title: "工序",
          align: "center",
          minWidth: 150,
          key: "procedure_title",
        },
        {
          title: "工序状态",
          align: "center",
          minWidth: 150,
          render: (h, params) =>
            h("span", {}, params.row.rework_state == 1 ? "返工" : "正常"),
          
        },
        { title: "图号", align: "center", minWidth: 150, key: "url_number" ,ellipsis:'true',tooltip:'true'},
        { title: "班组信息", align: "center", minWidth: 150, key: "username" },
        {
          title: "完工状态",
          align: "center",
          minWidth: 100,
          render: (h, params) =>
            h("span", {}, params.row.state == 3 ? "已完工" : "未完工"),
        },
        {
          title: "完工百分比",
          align: "center",
          minWidth: 120,
          render(h, params) {
            return h(
              "span",
              {},
              parseInt(params.row.complete_rate * 100) + "%"
            );
          },
        },
        {
          title: "派工时间",
          align: "center",
          minWidth: 200,
          render: (h, params) =>
            h("span", {}, this.func.replaceDate(params.row.produce_time * 1)),
        },
        {
          title: "操作",
          align: "center",
          slot: "set",
          fixed: "right",
          width: "250",
        },
      ],
      tableData: [{ residential_name: "dlaskdsad", state: 0, id: 99 }],
      pageIndex: 1,
      pageSize: 10,
      total: 0,
      selectIds: [],
      proxyObj: { order_no: this.$route.query.order_no },
      produces: [],
      users: [],
      house_list: [],
      unit_list: [],
      level_list: [],
      room_list: [],
      product_list: [],
      part_list: [],
      part_state_list: [],
      url_number_list: [], 
      part_label: [],
      produce_type_list: [],
      nickname_users:[],
      params_data:[]
    };
  },
  created() {
    // this.axios("/api/procedure_index").then(
    //   (res) => (this.produces = res.data.data)
    // );
    this.axios("/api/employee_list").then((res) => (this.nickname_users = res.data));
  },
  computed: {
    list() {
    return  [
        {
          title: "工序分类",
          filterable: true,
          name: "Select",
          value: "",
          serverName: "basic_title",
          optionName: "title",
          optionValue: "id",
          option: this.produce_type_list,
        },
        {
          title: "工序",
          filterable: true,
          name: "Select",
          value: "",
          serverName: "procedure_title",
          optionName: "title",
          optionValue: "id",
          option: this.produces,
        },
        {
          title: "班组",
          filterable: true,
          name: "Select",
          value: "",
          optionName: "title",
          optionValue: "title",
          serverName: "title",
          option: this.users,
        },
        {
          title: "图号",
          filterable: true,
          multiple:true,
          name: "Select",
          value: "",
          optionName: "title",
          optionValue: "title",
          serverName: "url_number",
          option: this.url_number_list,
        },
        {
          title: "完工状态",
          name: "Select",
          value: "",
          serverName: "produce",
          option: [
            { label: "未完工", value: 1 },
            { label: "已完工", value: 3 },
          ],
        },
        {
               title: "工序状态",
          name: "Select",
          value: "",
          serverName: "rework_state",
          option: [
            { label: "返工", value: 1 },
            { label: "正常", value: 0 },
          ],
        },
        {
          title: "派工时间",
          name: "Input",
          start_server: "start_time",
          end_server: "end_time",
          start_value: "",
          end_value: "",
          isDate: true,
          start_placeholder: "开始日期",
          end_placeholder: "结束日期",
        },
      ]
 
    },
  },
  methods: {
    finish_Ok(){
      if(!this.finish_nickname){
         this.$Message.warning('请选择班组')
       
      }else{
               this.postData({...this.params_data,team_id:this.finish_nickname},1)
      }
    },
    search(row){
           row.start_time = row.start_time?new Date(row.start_time).getTime().toString().split('').splice(0,10).join(''):'';
      row.end_time =row.end_time? new Date(row.end_time).getTime().toString().split('').splice(0,10).join(''):'';
       Object.assign(row, this.$route.query);
        row.page_size = this.pageSize;
      row.page_index = this.pageIndex;
       this.proxyObj = row;
       this.axios("/api/orders_dispatch_produce_list", { params: row }).then(
        (res) => {
          if (res.code == 200) {
            this.tableData = res.data.list;
            this.logList = res.data.detail;
            this.total = res.data.total;
          //  this.produce_type_list =res.data.basic_title;
          //  this.produces = res.data.procedure_title;
          //  this.users = res.data.username
          }
        }
      );
    },
    init(row) {
      this.pageIndex = 1;
      row.page_size = this.pageSize;
      row.page_index = this.pageIndex;
      Object.assign(row, this.$route.query);
      this.proxyObj = row;
      this.getData(row);
    },
    back() {
      this.$router.go(-1);
    },
    getData(row) {
      row.page_size = this.pageSize;
      row.page_index = this.pageIndex;
      this.axios("/api/orders_dispatch_produce_list", { params: row }).then(
        (res) => {
          if (res.code == 200) {
            this.tableData = res.data.list;
            this.logList = res.data.detail;
            this.total = res.data.total;
           this.produce_type_list =res.data.basic_title;
           this.produces = res.data.procedure_title;
           this.users = res.data.username;
           let data =[];
           res.data.url_number_list.map(v=>{
             let obj={};
             obj.title = v;
             data.push(obj)
           })
           this.url_number_list = data
          }
        }
      );
    },
    postData(data, type) {
      let url =
        type == 1 ? "/api/orders_dispatch_confirm" : "/api/orders_plan_cancer";
      this.axios.post(url, data).then((res) => {
        if (res.code == 200) {
          this.$Message.success(res.msg);
          this.getData({...this.$route.query,...this.proxyObj});
        }
      });
    },
    finish(row, type) {
      if (!row || row.length < 1) {
        return this.$Message.warning("请至少选择一项");
      }
      let params = {
        order_no: Array.isArray(row)
          ? row.reduce(
              (pre, cur, n) =>
                `${pre}${cur.order_no}${n == row.length - 1 ? "" : ","}`,
              ""
            )
          : row.order_no,
        produce_id: Array.isArray(row)
          ? row.reduce(
              (pre, cur, n) =>
                `${pre}${cur.produce_id}${n == row.length - 1 ? "" : ","}`,
              ""
            )
          : row.produce_id,
        produce_time: Array.isArray(row)
          ? row.reduce(
              (pre, cur, n) =>
                `${pre}${cur.produce_time}${n == row.length - 1 ? "" : ","}`,
              ""
            )
          : row.produce_time,
      };
     this.finish_modal = true;
     this.params_data = params;
    },
    selectTable(e) {
      this.selectIds = e;
    },
    changePage(e) {
      this.pageIndex = e;
      this.proxyObj.page_index = this.pageIndex;
      this.getData(this.proxyObj);
    },
    changeSize(e) {
      this.pageSize = e;
      this.proxyObj.page_size = this.page_size;
      this.getData(this.proxyObj);
    },
    goDetial(row) {
      this.$router.push({
        path: "/cms/productionorderlist/dispatchlist/details",
        query: {
          order_no: this.$route.query.order_no,
          produce_id: row.produce_id,
          produce_time: row.produce_time,
        },
      });
    },
    goOriginalPage(row) {
      this.$router.push({
        path: "/cms/rawmateria/index",
        query: {
          order_no: row.order_no,
          type: 9,
          residential_name: row.residential_name,
          produce_id: row.produce_id,
          produce_time: row.produce_time,
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.log-list {
  display: flex;
  flex-wrap: wrap;
  padding: 10px 0;
}
</style>