<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
          class="searchSelect"
        >
          <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
          class="searchSelect"
        >
          <Option v-for="item in ctypelist" :value="item.id" :key="item.id">{{ item.title }}</Option>
        </Select>
      </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('900884')"
        v-model="addmodal"
        :styles="{width:'600px'}"
      >
        <div class="modal_body">
          <div class="filter">
            <label>{{this.$t('1031')}}：</label>
            <label class="labelInfo">{{ftypename}}</label>
          </div>
          <div class="filter">
            <label>{{this.$t('1032')}}：</label>
            <label class="labelInfo">{{ctypename}}</label>
          </div>
          <div class="filter">
            <label>{{this.$t('900891')}}：</label>
            <Input
              class="searchInput"
              type="number"
              min="0"
              v-model="detailobj.free"
              :placeholder="this.$t('800224')"
            />
          </div>
          <div class="filter">
            <label>{{this.$t('900892')}}：</label>
            <Input
              class="searchInput"
              type="number"
              min="0"
              v-model="detailobj.fault"
              :placeholder="this.$t('800224')"
            />
          </div>
          <div class="filter">
            <label>{{this.$t('900893')}}：</label>
            <Input
              class="searchInput"
              type="number"
              min="0"
              v-model="detailobj.debugging"
              :placeholder="this.$t('800224')"
            />
          </div>
        </div>
        <div slot="footer">
          <div style="float:left;">{{this.$t('900894')}}</div>
          <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 {
            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: "",
            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("100081"),
                    key: "parentTypeName",
                },
                {
                    title: this.$t("100082"),
                    key: "childTypeName",
                },
                {
                    title: this.$t("900888"),
                    key: "free",
                },
                {
                    title: this.$t("900889"),
                    key: "fault",
                },
                {
                    title: this.$t("900890"),
                    key: "debugging",
                },
            ],
        };
    },
    created() {
        this.initftype();
        this.tosearch();
        // 格式化表格样式
        this.tableColumns1 = this.$time.initTableTitle(this.tableColumns1);
    },
    methods: {
        handleSelectRow: function (data) {
            var ids = [];
            for (var i in data) {
                ids.push(data[i].id);
            }
            this.selectids = ids.join(",");
        },
        tosearch() {
            this.page = 1;
            this.pageszie = 10;
            this.search();
        },
        search() {
            var params = {
                parentTypeId: this.ftype,
                childTypeId: this.ctype,
                page: this.page,
                pagesize: this.pagesize,
            };
            axios
                .request({
                    url: "/cnc/MachineStatusTimeSetting/GetTimeSettingList",
                    params,
                    method: "get",
                })
                .then((res) => {
                    if (res.data.ret === 1 && res.data.data.length > 0) {
                        this.total = res.data.total;
                        this.mockTableData1(res.data.data);
                    } else {
                        this.total = 0;
                        this.tableData1 = [];
                    }
                });
        },
        initftype() {
            axios
                .request({
                    url: "/config/MachineType/GetEditDcategory",
                    method: "get",
                })
                .then((res) => {
                    this.ftypelist = res.data.data;
                });
        },
        ftypechange(val) {
            if (val == undefined) {
                this.ftype = 0;
                this.ctype = 0;
            }
            if (val != "" && val != undefined) {
                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;
                    });
            } else {
                this.addftypename = "";
                this.ftypename = "";
                this.equipmentid = 0;
                this.ctypelist = [];
            }
        },
        ctypechange(val) {
            if (val == undefined) {
                this.ctype = 0;
            }

            if (val != "" && val != undefined) {
                this.addctypename = val.label;
                this.ctypename = this.addctypename;
            } else {
                this.addctypename = "";
                this.ctypename = "";
            }
        },
        mockTableData1(tablelist) {
            let data = [];
            tablelist.forEach((item) => {
                if (item) {
                    data.push({
                        parentTypeName: item.parentTypeName,
                        childTypeName: item.childTypeName,
                        free: item.free,
                        fault: item.fault,
                        debugging: item.debugging,
                        id: item.id,
                    });
                }
            });
            this.tableData1 = data;
        },
        handleRowChange(currentRow, oldCurrentRow) {
            this.detailobj = currentRow;
        },
        handlePageSize(value) {
            this.pagesize = value;
            this.search();
        },
        changePage(value) {
            this.page = value;
            this.search();
        },
        add() {
            if (this.ftype === 0) {
                this.$Message.error(this.$t(666609));
                return false;
            }
            if (this.ctype === 0) {
                this.$Message.error(this.$t(666610));
                return false;
            }
            this.type = 1;
            this.detailobj = {};
            this.ftypename = this.addftypename;
            this.ctypename = this.addctypename;
            this.addmodal = true;
        },
        closeadd() {
            this.addmodal = false;
        },
        adddata() {
            let data = {
                parentTypeId: this.ftype,
                childTypeId: this.ctype,
                free: this.detailobj.free,
                fault: this.detailobj.fault,
                debugging: this.detailobj.debugging,
            };
            axios
                .request({
                    url: "/cnc/MachineStatusTimeSetting/AddTimeSetting",
                    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.$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/MachineStatusTimeSetting/DeleteTimeSettings?ids=" +
                  this.selectids,
                                method: "post",
                            })
                            .then((res) => {
                                if (res.data.ret === 1) {
                                    this.$Message.success(this.$t("1058"));
                                    this.tosearch();
                                    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.parentTypeName;
            this.ctypename = this.detailobj.childTypeName;
            this.addmodal = true;
        },
        editdata() {
            let data = {
                parentTypeId: this.detailobj.parentTypeId,
                childTypeId: this.detailobj.childTypeId,
                free: this.detailobj.free,
                fault: this.detailobj.fault,
                debugging: this.detailobj.debugging,
                id: this.detailobj.id,
            };
            axios
                .request({
                    url: "/cnc/MachineStatusTimeSetting/EditTimeSetting",
                    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;
}
.labelInfo {
  width: 300px !important;
  text-align: left !important;
}
</style>
