<template>
  <div class="testdiv">
    <div class="divborder newSearchDiv" style="margin: 0px">
      <div class="filter">
        <label>{{ $t("1132") }}：</label>
        <Cascader
          :data="datalevel"
          :value="leveldata"
          trigger="click"
          change-on-select
          class="searchSelect"
          @on-change="getlevel"
        ></Cascader>
      </div>
      <div class="searchBtn">
        <Button
          type="primary"
          class="twoWord"
          icon="ios-search"
          @click="tosearch()"
          >{{ $t("1001") }}</Button
        >
        <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"
          icon="md-close-circle"
          @click="dele()"
          >{{ $t("1004") }}</Button
        >
      </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('1002')"
        v-model="addmodal"
        :styles="{ width: '700px' }"
      >
        <div class="modal_body" style="height: 400px !important">
          <div
            style="width: 280px; float: left; height: 400px; overflow-y: scroll"
          >
            <template>
              <Tree
                :data="treeContents"
                ref="tree"
                @on-select-change="getList()"
              ></Tree>
            </template>
          </div>
          <div
            style="width: 360px; float: left; height: 100%; padding-left: 5px"
          >
            <div class="filter">
              <label style="width: 150px !important">
                <i>*</i>
                {{ this.$t("900871") }}：
              </label>
              <Input
                class="searchInput"
                type="number"
                min="0"
                v-model="addobj.transfer_time"
                :placeholder="this.$t('900875')"
              />
            </div>
            <div class="filter">
              <label style="width: 150px !important">
                <i>*</i>
                {{ this.$t("900874") }}：
              </label>
              <Input
                class="searchInput"
                type="number"
                min="0"
                v-model="addobj.rate"
                :placeholder="this.$t('900876')"
              />
            </div>
          </div>
        </div>
        <div slot="footer">
          <Button type="text" size="large" @click="closeadd()">{{
            $t("1033")
          }}</Button>
          <Button type="primary" size="large" @click="adddata()">{{
            $t("1011")
          }}</Button>
        </div>
      </Modal>
      <Modal
        class="newModalClass"
        :title="$t('1003')"
        v-model="editmodal"
        :styles="{ width: '520px' }"
      >
        <div class="modal_body">
          <div class="filter">
            <label style="width: 150px !important"
              >{{ this.$t("200003") }}：</label
            >
            <label style="width: 300px; text-align: left">{{
              sectionname
            }}</label>
          </div>
          <br />
          <div class="filter">
            <label style="width: 150px !important">
              <i>*</i>
              {{ this.$t("900871") }}：
            </label>
            <Input
              class="searchInput"
              type="number"
              min="0"
              v-model="editobj.transfer_time"
            />
            <label>{{ this.$t("900875") }}</label>
          </div>
          <div class="filter">
            <label style="width: 150px !important">
              <i>*</i>
              {{ this.$t("900874") }}：
            </label>
            <Input
              class="searchInput"
              type="number"
              min="0"
              v-model="editobj.rate"
            />
            <label>{{ this.$t("900876") }}</label>
          </div>
        </div>
        <div slot="footer">
          <Button type="text" size="large" @click="closeedit()">{{
            $t("1033")
          }}</Button>
          <Button type="primary" size="large" @click="editdata()">{{
            $t("1011")
          }}</Button>
        </div>
      </Modal>
    </div>
  </div>
</template>
<script>
import axios from "@/libs/api.request";
export default {
  name: "parameter", // 组件不刷新
  data() {
    return {
      leveldata: [], // 产线层级集合
      levelid: 0, // 产线层级id
      datalevel: [],
      tableData1: [],
      total: 0,
      page: 1,
      pagesize: 10,
      addmodal: false,
      detailobj: {},
      editmodal: false,
      addobj: {},
      editobj: {},
      selectids: "",
      treeContents: [],
      timetype: "time",
      sectionId: "",
      sectionname: "",
      map: {
        value: "value",
        label: "label",
        children: "children",
        expand: true,
        selected: false,
      },
      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("200003"),
          key: "sectionName",
        },
        {
          title: this.$t("900872"),
          key: "transfer_time",
        },
        {
          title: this.$t("900873"),
          key: "rate",
        },
      ],
    };
  },
  created() {
    this.initlevel();
    // this.tosearch();
    // 格式化表格样式
    this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
  },
  methods: {
    // 产线层级
    initlevel() {
      axios
        .request({
          url: "config/ProjectLevelSection/GetSectionTree",
          method: "get",
        })
        .then((res) => {
          const arr = [];
          this.datalevel = res.data.data;
          let sdata = res.data.data
          if(sdata!=null&&sdata!=undefined&&sdata&&sdata.length >0){
              arr.push(res.data.data[0].value)
              this.levelid = res.data.data[0].value;
          }
          this.leveldata = arr;
          this.tosearch();
        });
    },
    // 产线层级选择
    getlevel: function (data) {
      this.levelid = data[data.length - 1];
    },
    tosearch() {
      this.page = 1;
      this.pageszie = 10;
      this.search();
    },
    search() {
      var params = {
        sectionid: this.levelid,
        page: this.page,
        pagesize: this.pagesize,
      };
      axios
        .request({
          url: "/cnc/ProductionAllocation/GetAllocations",
          params,
          method: "get",
        })
        .then((res) => {
          this.total = res.data.total;
          this.mockTableData1(res.data.data);
        });
    },
    mockTableData1(tablelist) {
      let data = [];
      tablelist.forEach((item) => {
        if (item) {
          data.push({
            sectionName: item.sectionName,
            transfer_time: item.transfer_time,
            rate: item.rate,
            section_id: item.section_id,
            id: item.id,
          });
        }
      });
      this.tableData1 = data;
    },
    handleSelectRow: function (data) {
      var ids = [];
      for (var i in data) {
        ids.push(data[i].id);
      }
      this.selectids = ids;
    },
    handleRowChange(currentRow, oldCurrentRow) {
      this.detailobj = currentRow;
    },
    handlePageSize(value) {
      this.pagesize = value;
      this.search();
    },
    changePage(value) {
      this.page = value;
      this.search();
    },
    add() {
      this.addmodal = true;
      this.addobj = {};
      this.sectionId = "";
      this.inittree();
    },
    inittree() {
      axios
        .request({
          url: "/config/ProjectLevelSection/GetSectionTree",
          method: "get",
        })
        .then((res) => {
          if (res.data.ret == 1) {
            this.treeContents = res.data.data;
            this.contentTree(this.treeContents);
          } else {
            this.$Message.error(this.$t(res.data.msg));
          }
        });
    },
    // 树形数据转换
    contentTree(arr) {
      arr.forEach((ele) => {
        ele.title = ele.label;
        ele.expand = true;
        if (
          ele.children.length != 0 &&
          ele.children != undefined &&
          ele.children != null
        ) {
          this.contentTree(ele.children);
        }
      });
    },
    getList() {
      let node = this.$refs.tree.getSelectedNodes();
      if (node.length > 0) {
        if (node[0].children && node[0].children.length > 0) {
          this.$Message.error("请选择具体工位");
        } else {
          // this.machine = node[0].title;
          this.sectionId = node[0].value;
        }
      }
    },
    closeadd() {
      this.addmodal = false;
    },
    echo_check(v) {
      console.log(v);
      if (
        v === null ||
        v === undefined ||
        isNaN(v) ||
        v === "" ||
        !Number.isInteger(parseFloat(v)) ||
        v < 0
      ) {
        return true;
      }
      return false;
    },
    adddata() {
      const _this = this;
      let { $t, sectionId, echo_check } = this;
      let transferTime = _this.addobj.transfer_time;
      let rate = _this.addobj.rate;

      if (!sectionId) {
        _this.$Message.error($t(1037));
        return false;
      }

      if (echo_check(transferTime)) {
        _this.$Message.error($t(666611));
        return false;
      }

      if (echo_check(rate)) {
        _this.$Message.error($t(666612));
        return false;
      }

      let data = {
        sectionid: this.sectionId,
        transfer_time: this.addobj.transfer_time,
        rate: this.addobj.rate,
      };
      axios
        .request({
          url: "/cnc/ProductionAllocation/AddAllocation",
          data,
          method: "post",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            this.$Message.success(this.$t("1055"));
            this.addmodal = false;
            this.tosearch();
          } else {
            this.$Message.error(this.$t(res.data.msg));
          }
        });
    },
    dele() {
      if (
        this.selectids === undefined ||
        this.selectids === "" ||
        this.selectids === []
      ) {
        this.$Message.error(this.$t("1017"));
        return false;
      } else {
        let data = {
          ids: this.selectids,
        };
        this.$Modal.confirm({
          title: this.$t("1018"),
          content: "",
          width: "290px",
          closable: true,
          okText: this.$t("1004"),
          onOk: () => {
            axios
              .request({
                url: "/cnc/ProductionAllocation/DeleteAllocations",
                data,
                method: "post",
              })
              .then((res) => {
                if (res.data.ret === 1) {
                  this.$Message.success(this.$t("1058"));
                  this.tosearch();
                  this.selectids = [];
                  this.detailobj = {};
                } else {
                  this.$Message.error(this.$t(res.data.msg));
                }
              });
          },
        });
      }
    },
    formatpara(val) {
      if (val === -1) {
        return "";
      }
      return val;
    },
    edit() {
      if (this.detailobj === undefined || this.detailobj.id === undefined) {
        this.$Message.error(this.$t("1017"));
        return false;
      }
      this.sectionname = this.detailobj.sectionName;
      this.editobj.transfer_time = this.detailobj.transfer_time;
      this.editobj.rate = this.detailobj.rate;
      this.editmodal = true;
    },
    editdata() {
      if (
        this.editobj.transfer_time == "" ||
        this.editobj.transfer_time == undefined
      ) {
        this.$Message.error(this.$t("1063"));
        return false;
      }
      if (this.editobj.rate == "" || this.editobj.rate == undefined) {
        this.$Message.error(this.$t("1063"));
        return false;
      }

      let data = {
        transfer_time: this.editobj.transfer_time,
        sectionid: this.detailobj.section_id,
        rate: this.editobj.rate,
        id: this.detailobj.id,
      };
      axios
        .request({
          url: "/cnc/ProductionAllocation/EditAllocation",
          data,
          method: "post",
        })
        .then((res) => {
          if (res.data.ret === 1) {
            this.$Message.success(this.$t("1060"));
            this.editmodal = false;
            this.search();
          } else {
            this.$Message.error(this.$t(res.data.msg));
          }
        });
    },
    closeedit() {
      this.editmodal = false;
    },
  },
};
</script>
<style lang="less" scoped>
.treeSelect {
  span {
    background: #2d8cf1;
    color: #fff;
    margin: 0;
    padding: 0 4px;
    border-radius: 3px;
    cursor: pointer;
    vertical-align: top;
  }
}
</style>
