<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv" style="margin:0px;">
      <!-- <div class="filter">
         <label >{{this.$t('1031')}}:</label>
          <Select v-model="ftype" label-in-value @on-change="ftypechange" clearable style="width:160px;" >
              <Option v-for="item in ftypelist" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
      </div>
      <div class="filter">
          <label >{{this.$t('1032')}}:</label>
          <Select v-model="ctype" label-in-value @on-change="ctypechange" clearable style="width:160px;" >
              <Option v-for="item in ctypelist" :value="item.id" :key="item.id">{{ item.title }}</Option>
          </Select>
      </div>-->
      <!-- <Button type="primary" icon="ios-search" @click="tosearch()">{{$t('1001')}}</Button> -->
      <div class="searchBtn">
        <Button type="success" class="twoWord" icon="md-add-circle" @click="add()">{{$t('1002')}}</Button>
        <Button type="warning" class="twoWord" icon="ios-build" @click="edit()">{{$t('1003')}}</Button>
        <Button
          type="error"
          class="twoWord intervalRight"
          icon="md-close-circle"
          @click="dele()"
        >{{$t('1004')}}</Button>
        <Button
          type="primary"
          class="fourWord"
          icon="md-download"
          @click="loadexcel()"
        >{{$t('1005')}}</Button>
        <Upload
          style="display:inline-block"
          ref="upload"
          :action="action"
          name="excel-file"
          :headers="headers"
          :show-upload-list="false"
          :on-format-error="handleFormatError"
          :on-success="handleSuccess"
          :on-error="handleError"
          :format="['xlsx']"
        >
          <Button type="primary" class="fourWord" icon="md-cloud-upload">{{$t('1006')}}</Button>
        </Upload>
      </div>
    </div>
    <div class="divborder newTableDiv">
      <Table
        class="tableClass"
        @on-current-change="handleRowChange"
        highlight-row
        :data="tableData1"
        @on-selection-change="handleSelectRow"
        :columns="tableColumns1"
      ></Table>
      <div class="pageDiv">
        <div class="pageDirection">
          <Page
            :total="total"
            :current="page"
            @on-change="changePage"
            show-elevator
            show-sizer
            show-total
            @on-page-size-change="handlePageSize"
            :page-size-opts="[10,20,30,40,100]"
          ></Page>
        </div>
      </div>
      <Modal
        class="newModalClass"
        :title="$t('900860')"
        v-model="addmodal"
        :styles="{width:'600px'}"
      >
        <div class="modal_body">
          <div class="filter">
            <label>
              <i>*</i>
              {{this.$t('950085')}}：
            </label>
            <Select
              v-model="detailobj.mode"
              label-in-value
              clearable
              class="searchSelect"
              style="margin-right:10px;"
            >
              <Option
                v-for="item in parentmodes"
                :value="item.id"
                :key="item.id"
              >{{ item.workingmodename }}</Option>
            </Select>
            <Input
              class="searchInput"
              type="text"
              v-model="detailobj.inputmode"
              :placeholder="this.$t('950008')"
            />
          </div>
          <div class="filter">
            <label>
              <i>*</i>
              {{this.$t('950049')}}：
            </label>
            <Input
              class="searchInput"
              type="text"
              v-model="detailobj.cmode"
              :placeholder="this.$t('900885')"
            />
          </div>
          <br />
          <div class="filter">
            <label>{{this.$t('1030')}}：</label>
            <Input class="searchInput" type="text" v-model="detailobj.remark" />
          </div>
        </div>
        <div slot="footer">
          <Button type="text" size="large" @click="closeadd()">{{$t('1033')}}</Button>
          <Button type="primary" v-if="type===1" size="large" @click="adddata()">{{$t('1011')}}</Button>
          <Button type="primary" v-if="type===2" size="large" @click="editdata()">{{$t('1011')}}</Button>
        </div>
      </Modal>
    </div>
  </div>
</template>
<script>
import axios from "@/libs/api.request";
export default {
  name: "productmanagement", // 组件不刷新
  data() {
    return {
      action: axios.publicPath + "cnc/upload/submit?templateName=WorkModeList",
      headers: {
        token: localStorage.getItem("token"),
        timestamp: localStorage.getItem("timestamp"),
        nonce: localStorage.getItem("nonce"),
        sign: localStorage.getItem("sign"),
      },
      tableData1: [],
      total: 0,
      page: 1,
      pagesize: 10,
      addmodal: false,
      detailobj: {},
      editmodal: false,
      editobj: {},
      type: 1,
      ftype: 0,
      ftypelist: [],
      ctype: 0,
      ctypelist: [],
      ftypename: "",
      ctypename: "",
      addftypename: "",
      addctypename: "",
      parentmodes: [],
      tableColumns1: [
        {
          type: "selection",
          width: 50,
          align: "center",
        },
        {
          type: "index2",
          title: this.$t("1008"),
          key: "xuhao",
          render: (h, params) => {
            return h(
              "span",
              params.index + (this.page - 1) * this.pagesize + 1
            );
          },
          width: "90px",
        },
        {
          title: this.$t("950085"),
          key: "parentname",
        },
        {
          title: this.$t("950049"),
          key: "workingmodename",
        },
        {
          title: this.$t("1030"),
          key: "notelist",
        },
      ],
    };
  },
  created() {
    // this.initftype()
    this.tosearch();
    // 格式化表格样式
    this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
  },
  methods: {
    handleFormatError(file) {
      this.$Message.error(this.$t("950396") + file.name + this.$t("950397"));
    },
    handleSuccess(res, file) {
      if (res.ret == 1) {
        this.$Message.success(this.$t("950398"));
        this.search(this.page, this.pagesize);
      } else {
        if ((res.msg + "").indexOf(",") != -1) {
          this.page = 1;
          this.search(this.page, this.pagesize);
          inittip(res.msg);
        } else {
          this.$Message.error(this.$t(res.msg));
        }
      }
    },
    handleError() {
      this.$Message.error(this.$t("2010006") + "!");
    },
    handleSelectRow: function (data) {
      var ids = [];
      for (var i in data) {
        ids.push(data[i].id);
      }
      this.selectids = ids.join(",");
    },
    tosearch() {
      this.page = 1;
      this.pagesize = 10;
      this.search();
    },
    search() {
      var data = {
        page: this.page,
        pagesize: this.pagesize,
      };
      axios
        .request({
          url: "/cnc/MachineWordingMode/WorkingModeList",
          data,
          method: "post",
        })
        .then((res) => {
          this.total = 0;
          this.tableData1 = [];
          if (res.data.ret === 1 && res.data.data.length > 0) {
            this.total = res.data.total;
            this.mockTableData1(res.data.data);
          }
        });
    },
    initftype() {
      axios
        .request({
          url: "/config/MachineType/GetEditDcategory",
          method: "get",
        })
        .then((res) => {
          this.ftypelist = res.data.data;
        });
    },
    ftypechange(val) {
      if (val !== undefined && val !== "") {
        if (this.ftype === undefined) {
          this.ctype = 0;
        }
        this.addftypename = val.label;
        this.ftypename = this.addftypename;
        this.equipmentid = this.ftype;
        axios
          .request({
            url:
              "/config/MachineType/GetLastMachineType?id=" + this.equipmentid,
            method: "get",
          })
          .then((res) => {
            this.ctypelist = res.data.data;
          });
      }
    },
    ctypechange(val) {
      if (val !== undefined && val !== "") {
        this.addctypename = val.label;
        this.ctypename = this.addctypename;
      }
    },
    mockTableData1(tablelist) {
      let data = [];
      tablelist.forEach((item) => {
        if (item) {
          data.push({
            machineftype1Id: item.machineftype1Id,
            machineftype1name: item.machineftype1name,
            machinectype1Id: item.machinectype1Id,
            machinectype1name: item.machinectype1name,
            workingmodename: item.workingmodename,
            notelist: item.notelist,
            parentname: item.parentname,
            parentid: item.parentid,
            id: item.id,
          });
        }
      });
      this.tableData1 = data;
    },
    handleRowChange(currentRow, oldCurrentRow) {
      this.detailobj = currentRow;
    },
    handlePageSize(value) {
      this.pagesize = value;
      this.tableData1 = this.search();
    },
    changePage(value) {
      this.page = value;
      this.tableData1 = this.search();
    },
    add() {
      // if (this.ftype === 0) {
      //   this.$Message.error(this.$t('800267'))
      //   return false
      // }
      // if (this.ctype === 0) {
      //   this.$Message.error(this.$t('800268'))
      //   return false
      // }
      this.type = 1;
      this.detailobj = {};
      this.ftypename = this.addftypename;
      this.ctypename = this.addctypename;
      this.iniparentmodes();
      this.addmodal = true;
    },
    closeadd() {
      this.addmodal = false;
    },
    iniparentmodes(machineid) {
      axios
        .request({
          url: "/cnc/MachineWordingMode/ShowParentWorkModeList",
          method: "get",
        })
        .then((res) => {
          this.parentmodes = res.data.data;
        });
    },
    adddata() {
      if (!this.detailobj.mode && !this.detailobj.inputmode) {
        this.$Message.error(this.$t(666602));
        return false;
      }

      if (!this.detailobj.cmode) {
        this.$Message.error(this.$t(666603));
        return false;
      }

      let data = {
        machineFType1Id: this.ftype,
        machineFType1Name: this.ftypename,
        machineCtype1Id: this.ctype,
        machineCtype1Name: this.ctypename,
        WorkingMode: this.detailobj.cmode,
        note: this.detailobj.remark,
        parentId: this.detailobj.mode,
        parentMode: this.detailobj.inputmode,
      };
      axios
        .request({
          url: "/cnc/MachineWordingMode/WorkingModeAdd",
          data,
          method: "post",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            this.$Message.success(this.$t("1055"));
            this.addmodal = false;
            this.search();
          } else {
            this.$Message.error(this.$t(res.data.msg));
          }
        });
    },
    loadexcel() {
      let params = {};
      axios
        .request({
          url: "/config/BeatSetDownLoad/GetTemplates?name=WorkModeList",
          params,
          method: "get",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            window.location.href = axios.publicPath + "" + res.data.data;
          } else {
            this.error(this.$t(res.data.msg));
          }
        });
    },
    dele() {
      if (this.selectids === undefined || this.selectids === "") {
        this.$Message.error(this.$t("1017"));
        return false;
      } else {
        this.$Modal.confirm({
          title: this.$t("1018"),
          content: "",
          width: "290px",
          closable: true,
          okText: this.$t("1004"),
          onOk: () => {
            axios
              .request({
                url:
                  "/cnc/MachineWordingMode/WorkingModeDels?ids=" +
                  this.selectids,
                method: "post",
              })
              .then((res) => {
                if (res.data.ret === 1) {
                  this.$Message.success(this.$t("1058"));
                  this.tableData1 = this.search(this.page, this.pagesize);
                  this.detailobj = {};
                } else {
                  this.$Message.error(this.$t(res.data.msg));
                }
              });
          },
        });
      }
    },
    edit() {
      if (this.detailobj === undefined || this.detailobj.id === undefined) {
        this.$Message.error(this.$t("1017"));
        return false;
      }
      this.type = 2;
      this.ftypename = this.detailobj.machineftype1name;
      this.ctypename = this.detailobj.machinectype1name;
      this.iniparentmodes();
      this.detailobj.mode = this.detailobj.parentid;
      this.detailobj.remark = this.detailobj.notelist;
      this.detailobj.cmode = this.detailobj.workingmodename;
      this.addmodal = true;
    },
    editdata() {
      if (!this.detailobj.mode && !this.detailobj.inputmode) {
        this.$Message.error(this.$t(666602));
        return false;
      }
      if (!this.detailobj.cmode) {
        this.$Message.error(this.$t(666603));
        return false;
      }

      let data = {
        workingmodename: this.detailobj.cmode,
        notelist: this.detailobj.remark,
        parentId: this.detailobj.mode,
        parentMode: this.detailobj.inputmode,
        id: this.detailobj.id,
      };
      axios
        .request({
          url: "/cnc/MachineWordingMode/WorkingModeEdit",
          data,
          method: "post",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            this.$Message.success(this.$t("1060"));
            this.addmodal = false;
            this.detailobj = {};
            this.search();
          } else {
            this.$Message.error(this.$t(res.data.msg));
          }
        });
    },
  },
};
</script>
<style lang="less" scoped>
label {
  width: 100px;
  display: inline-block;
  text-align: right;
}
</style>
