<!--计量数据过期时间配置-->
<template>
  <div class="systemBase common-container-deriction">
    <!-- 查询区域 -->
    <div class="common-title-div">
      <el-form
        ref="searchData2"
        :inline="true"
        :model="searchForm"
        style="padding-left: 12px"
      >
        <el-form-item>
          <div style="font-size: 16px; padding: 0px 20px">
            一次计量数据过期时间配置
          </div>
        </el-form-item>
        <el-form-item prop="matterName" label="物料名称">
          <el-input
            v-model="baseData1.matterName"
            clearable
            size="small"
            style="width: 120px"
            placeholder="请输入"
          ></el-input>
        </el-form-item>
        <el-form-item label-width="20px">
          <el-button
            icon="el-icon-search"
            type="primary"
            size="mini"
            @click="getDataList"
            v-loading.fullscreen.lock="operateLoading"
            >查询</el-button
          >
          <el-button
            icon="el-icon-circle-plus-outline"
            type="primary"
            size="mini"
            v-loading.fullscreen.lock="operateLoading"
            @click="addData"
            v-privilege="activeMenu + 'ADD'"
            >新增</el-button
          >
          <el-button
            icon="el-icon-edit"
            type="primary"
            size="mini"
            v-loading.fullscreen.lock="operateLoading"
            @click="modifyData"
            v-privilege="activeMenu + 'UPDATE'"
            >修改</el-button
          >
          <el-button
            size="mini"
            type="danger"
            plain
            icon="el-icon-remove-outline"
            v-loading.fullscreen.lock="operateLoading"
            @click="abolishData"
            v-privilege="activeMenu + 'ABOLISH'"
            >废除</el-button
          >
          <el-button
            size="mini"
            type="primary"
            icon="el-icon-check"
            v-loading.fullscreen.lock="operateLoading"
            @click="recoveryData"
            v-privilege="activeMenu + 'RECOVERY'"
            >启用</el-button
          >
        </el-form-item>
      </el-form>
    </div>
    <!-- 表格区域 -->
    <div class="common-table-div">
      <el-table
        v-loading="dataLoading"
        @row-click="rowChange"
        ref="dataTable"
        :row-class-name="tableRowClassName"
        highlight-current-row
        border
        :height="tableHeight"
        @selection-change="handleSelectionChange"
        :data="table.list"
        :exchangeFilterMap="{ validFlag: { '1': '无效', '0': '有效' } }"
        :icore-filter-flag="icoreFilterFlag"
      >
        <el-table-column
          type="index"
          label="序号"
          fixed="left"
          align="center"
        ></el-table-column>
        <el-table-column
          type="selection"
          width="55"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="matterName"
          label="物料名称"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="meterTypeName"
          label="计量类型"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="weightType"
          label="重量类型"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="preNum"
          label="预警值"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="120px"
          prop="limitNum"
          label="期限值"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          prop="validFlag"
          width="60px"
          label="状态"
          align="center"
        >
          <template slot-scope="scope">
            <span v-if="scope.row.validFlag == 1">无效</span>
            <span v-else-if="scope.row.validFlag == 0">有效</span>
          </template>
        </el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="200px"
          prop="memo"
          label="备注"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="createManName"
          label="创建人"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="160px"
          prop="createTime"
          label="创建时间"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="80px"
          prop="updateManName"
          label="修改人"
          align="center"
        ></el-table-column>
        <el-table-column
          sortable
          :show-overflow-tooltip="true"
          min-width="160px"
          prop="updateTime"
          label="修改时间"
          align="center"
        ></el-table-column>
      </el-table>
    </div>
    <div class="common-foot-style">
      <el-pagination
        v-loading="dataLoading"
        @size-change="pageSizeChange"
        @current-change="pageCurrentChange"
        :current-page="page.pageNum"
        :page-sizes="[100, 500, 1000]"
        :page-size="page.pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="page.totalPage"
      >
      </el-pagination>
    </div>
    <!-- <div ref="editTitle" class="common-title-div" style="border-top: 1px solid #d5d5d5;">编辑区
    </div> -->
    <div
      ref="editDiv"
      class="commom-edit-div"
      style="border-top: 1px solid #d5d5d5; margin-top: 10px"
    >
      <el-form
        ref="baseData"
        label-width="80px"
        :inline="true"
        :rules="ruleValidate"
        :model="baseData"
      >
        <el-form-item prop="matterName" label="物资名称">
          <el-select
            v-model="baseData.matterName"
            clearable
            filterable
            collapse-tags
            size="small"
            style="width: 120px"
            @change="matChange"
          >
            <el-option
              v-for="item in matterNameItem"
              :key="item.matterNo"
              :label="item.matterName"
              :value="item.matterName"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="meterTypeName" label="计量类型">
          <el-select
            v-model="baseData.meterTypeName"
            clearable
            filterable
            collapse-tags
            size="small"
            style="width: 120px"
            @change="matChange1"
          >
            <el-option
              v-for="(item, index) in meterTypeNameItem"
              :key="index"
              :label="item.baseName"
              :value="item.baseName"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="weightType" label="重量类型">
          <el-select
            v-model="baseData.weightType"
            clearable
            filterable
            collapse-tags
            size="small"
            style="width: 120px"
            @change="matChange2"
          >
            <el-option
              v-for="(item, index) in weightTypeNameItem"
              :key="index"
              :label="item.baseName"
              :value="item.baseName"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="preNum" label="预警值">
          <el-input
            v-model="baseData.preNum"
            size="small"
            clearable
            placeholder="请输入"
            style="width: 150px"
          ></el-input>
        </el-form-item>
        <el-form-item prop="limitNum" label="期限值">
          <el-input
            v-model="baseData.limitNum"
            size="small"
            clearable
            placeholder="请输入"
            style="width: 150px"
          ></el-input>
        </el-form-item>
        <el-form-item prop="memo" label="备注">
          <el-input
            v-model="baseData.memo"
            size="small"
            clearable
            placeholder="请输入"
            style="width: 150px"
          ></el-input>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
import {
  firstWeightabolishs,
  // firstWeightabolishadd,
  // firstWeightabolishupdate,
  // firstWeightabolishrecovery,
  // firstWeightabolishabolish
} from "../../../utils/api.js";

import { add, edit } from "../../../utils/httpRequest.js";
import pinyinUtils from "../../../utils/pinyin/pinyinUtils.js";
export default {
  data() {
    return {
      dataLoading: false,
      operateLoading: false,
      icoreFilterFlag: true,
      matterNameItem: [],
      meterTypeNameItem: [],
      weightTypeNameItem: [],
      baseData: {
        matterName: "",
        matterNo: "",
        meterTypeName: "",
        meterTypeNo: "",
        weightTypeNo:"",
        weightType: "",
        preNum: "",
        limitNum: "",
        memo: "",
        validFlag: "",
      },
      baseData1: {
        matterName: "",
      },
      page: {
        pageSize: 500,
        pageNum: 1,
        totalPage: 0,
      },
      table: {
        list: [],
      },
      multipleSelection: [],
      tableHeight: 0,
      ruleValidate: {
        matterName: [
          {
            required: true,
            message: "物料名称不能为空",
            trigger: "change",
          },
        ],
        meterTypeName: [
          {
            required: true,
            message: "计量类型不能为空",
            trigger: "change",
          },
        ],
        weightType: [
          {
            required: true,
            message: "重量类型不能为空",
            trigger: "change",
          },
        ],
        preNum: [
          {
            required: true,
            message: "预警值不能为空",
            trigger: "change",
          },
        ],
        limitNum: [
          {
            required: true,
            message: "期限值不能为空",
            trigger: "change",
          },
        ],
      },
      activeMenu: "",
      searchForm: {
        matterName: "",
      },
    };
  },
  created() {
    this.tableHeight =
      window.innerHeight - 220 > 400 ? window.innerHeight - 220 : 400;
    this.activeMenu = window.top.localStorage.getItem("activeMenu");
    this.getMatterNameItem();
    this.getMeterTypeNameItem();
    this.getWeightTypeNameItem();
  },
  mounted() {
    // this.tableHeight = this.getTableHeight(this.$refs['dataTable'].$el) - 80;
    this.getDataList();
  },
  methods: {
    rowChange(row, column, event) {
      let row1 = Object.assign({}, row);
      this.baseData = row1;
    },
    getMatterNameItem() {
      this.axios
        .get("pass/systemBase/v1/meterbasematterinfos/noPage" + "?validFlag=1")
        .then((res) => {
          this.matterNameItem = [...res.data];
        });
    },
    getMeterTypeNameItem() {
      this.axios
        .get(
          "pass/systemBase/v1/combaseinfos/noPage" +
            "?pBaseCode=001006" +
            "&validFlag=1"
        )
        .then((res) => {
          this.meterTypeNameItem = res.data;
        });
    },
    getWeightTypeNameItem() {
      this.axios
        .get(
          "pass/systemBase/v1/combaseinfos/noPage" +
            "?pBaseCode=001008" +
            "&validFlag=1"
        )
        .then((res) => {
          this.weightTypeNameItem = res.data;
        });
    },
    matChange(val) {
      if (val) {
        let item = this.matterNameItem.find(u => u.matterName === val);
        this.baseData.matterNo = item.matterNo;
      }
    },
    matChange1(val) {
      if (val) {
        let item = this.meterTypeNameItem.find(u => u.baseName === val);
        this.baseData.meterTypeNo = item.baseCode;
      }
    },
    matChange2(val) {
      if (val) {
        let item = this.weightTypeNameItem.find(u => u.baseName === val);
        this.baseData.weightTypeNo = item.baseCode;
      }
    },
    addData() {
      let _this = this;
      _this.$refs["baseData"].validate((valid) => {
        if (valid) {
          _this.operateLoading = true;
          let baseDataAdd = {};
          baseDataAdd.matterName = _this.baseData.matterName;
          baseDataAdd.matterNo = _this.baseData.matterNo;
          baseDataAdd.meterTypeName = _this.baseData.meterTypeName;
          baseDataAdd.meterTypeNo = _this.baseData.meterTypeNo;
          baseDataAdd.weightTypeNo = _this.baseData.weightTypeNo;
          baseDataAdd.weightType = _this.baseData.weightType;
          baseDataAdd.preNum = _this.baseData.preNum;
          baseDataAdd.limitNum = _this.baseData.limitNum;
          baseDataAdd.memo = _this.baseData.memo;
          baseDataAdd.validflag = '0';
          add(firstWeightabolishs +'add', baseDataAdd, (e) => {
            _this.operateLoading = false;
            _this.getDataList();
            if (!e) {
              _this.$refs["baseData"].resetFields &&
                _this.$refs["baseData"].resetFields();
            }
          });
        }
      });
    },
    modifyData() {
      let _this = this;
      _this.$refs["baseData"].validate((valid) => {
        if (valid) {
          _this.operateLoading = true;
          edit(
            firstWeightabolishs +'update',
            [_this.baseData],
            (e) => {
              _this.operateLoading = false;
              _this.getDataList();
              if (!e) {
                _this.$refs["baseData"].resetFields &&
                  _this.$refs["baseData"].resetFields();
              }
            }
          );
        }
      });
    },
    recoveryData() {
      let _this = this;
      _this.operateLoading = true;
      edit(firstWeightabolishs + "Recovery", _this.multipleSelection, (e) => {
        _this.operateLoading = false;
        if (!e) {
          _this.getDataList();
        }
      },'启用成功');
    },
    // deleteData () {
    //   this.$confirm('确定删除选中的计量组件信息？', {
    //       confirmButtonText: '确定',
    //       cancelButtonText: '取消'
    //     })
    //     .then(() => {
    //       this.operateLoading = true;
    //       Delete(meterbasecarblacelists, this.multipleSelection, (e) => {
    //         this.operateLoading = false;
    //         if (!e) {
    //           this.getDataList();
    //         }
    //       })
    //     })
    //     .catch(action => {
    //       this.$message({
    //         type: 'info',
    //         message: action === 'cancel' ? '放弃保存并离开页面' : '停留在当前页面'
    //       })
    //     });
    // },
    abolishData() {
      let _this = this;
      _this.operateLoading = true;
      edit(firstWeightabolishs + "abolish", _this.multipleSelection, (e) => {
        _this.operateLoading = false;
        if (!e) {
          _this.getDataList();
        }
      },'废除成功');
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    getTableHeight(dom) {
      return window.innerHeight - dom.offsetTop;
    },
    pageSizeChange(size) {
      this.page.pageSize = size;
      this.getDataList();
    },

    pageCurrentChange(index) {
      this.page.pageNum = index;
      this.getDataList(2);
    },
    getDataList(flag = 1) {
      if (flag === 1) {
        this.page.pageNum = 1;
      }
      this.dataLoading = true;
      this.axios
        .get(
          firstWeightabolishs +
            "like/?pageNum=" +
            this.page.pageNum +
            "&pageSize=" +
            this.page.pageSize +
            "&matterName=" +
            this.baseData1.matterName 
        )
        .then((res) => {
          this.dataLoading = false;
          this.table.list = res.data.list;
          this.page.totalPage = res.data.total;
        })
        .catch((e) => {
          this.dataLoading = false;
        });
    },
    tableRowClassName({ row, rowIndex }) {
      if (row.validFlag == "1") {
        return "error-row2";
      }
      return "";
    },
    // myBlur() {
    //   if (this.baseData.customerSupplierName) {
    //     this.baseData.mnemonicCode = pinyinUtils.initial(this.baseData.customerSupplierName);
    //   }
    // }
  },
};
</script>
<style scoped>
.el-select {
  width: 100%;
}
</style>
