<template>
<div class="eibs-tab">
  <c-col :span="12" class="col-left">
    <c-col :span="24">
      <el-form-item label="码表代码" prop="tbl">
        <c-select v-model="stbCondition.tbl" placeholder="请选择码表代码" @change="changeTbl(stbCondition.tbl)">
          <el-option v-for="item in tablelist" :key="item.tbl" :label="item.tbl +' - '+ item.nam"
                    :value="item.tbl">
            <span style="float: left">{{ item.tbl }} - {{item.nam}}</span>
            <!--span style="float: right; color: #8492a6; font-size: 13px">{{ item.nam }}</span-->
          </el-option>
        </c-select>
      </el-form-item>
    </c-col>
  </c-col>
  <c-col :span="12" class="col-right">
    <c-col :span="24">
      <el-form-item label="语言" prop="language">
        <c-select v-model="stbCondition.language" dbCode="UILTXT" :filterKey="['CN','EN']" placeholder="请选择语言种类"></c-select>
      </el-form-item>
    </c-col>
  </c-col>
  <c-col :span="24">
    <span style="float: left">
      <el-button type="primary" size="small" ref="codInsertBtn" @click="addStbBt()">新增</el-button>
      <el-button type="primary" size="small" ref="codEditBtn" style="margin-left: 5px" @click="editStbBt()" :disabled="isAbled">修改</el-button>
      <el-button type="danger" size="small" ref="codDeleteBtn" style="margin-left: 5px" @click="deleteStbBt()" :disabled="isDeleteAbled">删除码表</el-button>
    </span>
    <span style="float: right">
      <el-button size="small" @click="handleReset">重置</el-button>
      <el-button type="primary" icon="el-icon-search" size="small" @click="onSearch()">查询</el-button>
    </span>
  </c-col>
  <c-col :span="24">
    <c-table :list="stblist" :columnsConfig="stbColumns" :border="true">
    </c-table>
  </c-col>

  <!--码表信息弹窗-->
  <el-dialog
    :title="
      '码表信息:' +
      (operate === 'edit' ? '修改' : '新增')
    "
    :visible.sync="stbDialog"
    top="10vh"
    width="80%"
    :destroy-on-close="true"
    :before-close="handleClose"
    :close-on-click-modal="false"
  >
    <m-stb-info ref="stb" :operate="operate" :model="stb" :stblistinfo="stblistinfo" @handleaddline="handleaddline" @handledeleteline="handledeleteline"></m-stb-info>
    <span slot="footer" class="dialog-footer">
      <button
        class="el-button el-button--default el-button--small"
        style="margin-left: 0"
        size="small"
        :disabled="false"
        @click.prevent="cancel"
      >
        <span>返 回</span>
      </button>
      <c-button type="primary" @click="editStb" v-if="operate === 'edit'"
        >保 存</c-button
      >
      <c-button type="primary" @click="saveStb" v-if="operate === 'add'"
        >保 存</c-button
      >
    </span>
  </el-dialog>
</div>
</template>

<script>
import Utils from "~/utils";
import { queryByPage, editStb, addStb, deleteStb, getCodelist } from "~/service/manage/stb.js";
import StbInfo from "./Stbinfo.vue";
import { cloneDeep } from 'lodash';

export default {
  name: "",
  props: ["model"],
  data() {
    return {
      stbCondition: this.model,
      stb: {},
      stblist: [],
      stblistinfo: [],
      tablelist: [],
      temp: [],
      stbColumns: [
        { label: '语种', prop: 'uil', width: 'auto'},
        { label: '码表值', prop: 'cod', width: 'auto' },
        { label: '码表名称', prop: 'txt', width: 'auto' },
        { label: '排序', prop: 'srt', width: 'auto' },
      ],
      operate: "",
      stbDialog: false,
    }
  },
  created() {
    this.getCodList()
  },
  computed: {
    isAbled() {
      return !this.stbCondition.tbl
    },
    isDeleteAbled() {
      return !this.stbCondition.tbl
    },
  },
  components: {
    "m-stb-info": StbInfo,
  },
  methods: {
    getCodList() {
      getCodelist().then((res) => {
        if (res.respCode == "AAAAAA") {
          this.tablelist = res.data;
        } else {
          this.$notify.error(res.respMsg);
        }
      })
    },
    onSearch() {
      if(!this.stbCondition.tbl) {
        this.$notify.error("请选择码表代码");
        return;
      }
      // if(!this.stbCondition.language) {
      //   this.$notify.error("请选择语言种类");
      //   return;
      // }
      queryByPage(this.stbCondition).then((res) => {
        if (res.respCode == "AAAAAA") {
          let data = res.data;
          let viewlist = [];
          for(let map in data) {
            let temp;
            if(this.stbCondition.language == "CN") {
              temp = data[map].CN
            }
            if(this.stbCondition.language == "EN") {
              temp = data[map].EN
            }
            if(temp) {
              viewlist.push(temp)
            }
            if(!this.stbCondition.language) {
              if(!!data[map].CN) {
                viewlist.push(data[map].CN);
              }
              if(!!data[map].EN) {
                viewlist.push(data[map].EN);
              }
            }
          }
          this.$set(this, "stblist", viewlist);
        } else {
          this.$notify.error(res.respMsg);
        }
      })
    },
    queryFunc() {
      this.onSearch()
    },
    changeTbl(tbl) {
      let tbllist = this.tablelist;
      for(let i = 0;i < tbllist.length; i++){
        if(tbllist[i].tbl === tbl){
          this.$set(this.model, "tblnam", tbllist[i].nam)
        }
      }
    },
    editStbBt() {
      queryByPage({"tbl": this.stbCondition.tbl}).then((res) => {
        if(res.respCode == "AAAAAA") {
          let temp = res.data
          this.stblistinfo = [];
          for(let item in temp) {
            if (!!temp[item].CN) {
              if (!temp[item].CN.txt) {
                temp[item].CN.txt = ''
              }
            } else {
              temp[item].CN = {
                txt: '',
                srt: '',
                uil: "CN"
              }
            }
            if (!!temp[item].EN) {
              if (!temp[item].EN.txt) {
                temp[item].EN.txt = ''
              }
            } else {
              temp[item].EN = {
                txt: '',
                srt: '',
                uil: "EN"
              }
            }
            this.stblistinfo.push({"cod": item, "cnnam": temp[item].CN.txt, "cnsrt": temp[item].CN.srt, "ennam": temp[item].EN.txt, "ensrt": temp[item].EN.srt})
          }
          this.stb = this.model
        } else {
          this.$notify.error("数据为空!");
        }
        
      })
      this.stbDialog = true;
      this.operate = "edit";
    },
    handleaddline() {
      this.stblistinfo.push({"cod": "", "cnnam": "", "cnsrt": "0", "ennam": "", "ensrt": "0"})
    },
    handledeleteline(data, index) {
      data.splice(index, 1)
    },
    addStbBt() {
      this.stb = {};
      this.stbDialog = true;
      this.operate = "add";
      this.stblistinfo = [];
    },
    editStb() {
      // this.checkRepeat(this.stblistinfo);
      let data = this.stblistinfo;
      for(let i = 0; i < data.length - 1; i++) {
        for(let j = i + 1; j < data.length; j++) {
          if(data[i].cod == data[j].cod) {
            this.$notify.error("码值重复,请检查码值" + data[i].cod + "是否重复");
            return;
          }
          if(!!data[i].cnsrt && data[i].cnsrt == data[j].cnsrt && data[i].cnsrt != '0') {
            this.$notify.error("中文序号重复,请检查中文序号" + data[i].cnsrt + "是否重复");
            return;
          }
          if(!!data[i].ensrt && data[i].ensrt == data[j].ensrt && data[i].ensrt != '0') {
            this.$notify.error("英文序号重复,请检查英文序号" + data[i].ensrt + "是否重复");
            return;
          }
        }
      }
      editStb({"tbl": this.model.tbl, "tblnam": this.model.tblnam, "stbList": this.stblistinfo}).then((res) => {
        if(res.respCode == "AAAAAA") {
          this.$notify.success("修改成功")
          this.stbDialog = false;
          this.onSearch()
          this.getCodList()
        } else {
          this.$notify.error("修改失败")
        }
      })
    },
    // checkRepeat(data) {
    //   for(let i = 0; i < data.length - 1; i++) {
    //     for(let j = i + 1; j < data.length; j++) {
    //       if(data[i].cod == data[j].cod) {
    //         this.$notify.error("码值重复,请检查" + data[i].cod + "是否重复");
    //         return;
    //       }
    //       if(data[i].cnsrt == data[j].cnsrt) {
    //         this.$notify.error("中文序号重复,请检查" + data[i].cnsrt + "是否重复");
    //         return;
    //       }
    //       if(data[i].ensrt == data[j].ensrt) {
    //         this.$notify.error("英文序号重复,请检查" + data[i].ensrt + "是否重复");
    //         return;
    //       }
    //     }
    //   }
    // },
    saveStb() {
      if(this.stb.tbl && this.stb.tbl.length > 6) {
        this.$notify.error("码表长度不超过6位");
        return;
      }
      let data = this.stblistinfo;
      for(let i = 0; i < data.length - 1; i++) {
        for(let j = i + 1; j < data.length; j++) {
          if(data[i].cod == data[j].cod) {
            this.$notify.error("码值重复,请检查码值" + data[i].cod + "是否重复");
            return;
          }
          if(!!data[i].cnsrt && data[i].cnsrt == data[j].cnsrt && data[i].cnsrt != '0') {
            this.$notify.error("中文序号重复,请检查中文序号" + data[i].cnsrt + "是否重复");
            return;
          }
          if(!!data[i].ensrt && data[i].ensrt == data[j].ensrt && data[i].ensrt != '0') {
            this.$notify.error("英文序号重复,请检查英文序号" + data[i].ensrt + "是否重复");
            return;
          }
        }
      }
      addStb({"tbl": this.stb.tbl, "tblnam": this.stb.tblnam, "stbList": this.stblistinfo}).then((res) => {
        if(res.respCode == "AAAAAA") {
          this.$notify.success("新增成功")
          this.stbDialog = false;
          this.stbCondition.tbl = this.stb.tbl;
          this.stbCondition.language = "EN";
          this.onSearch()
          this.getCodList()
        } else {
          this.$notify.error(res.respMsg)
        }
      })
    },
    deleteStbBt() {
      this.$confirm("是否确认删除" + this.stbCondition.tbl + "?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          deleteStb(this.stbCondition)
            .then((res) => {
              if(res.respCode == "AAAAAA") {
                this.$notify.success("删除成功!");
                this.getCodList()
              } else {
                this.$notify.error("删除失败!");
              }
            })
            .catch((err) => {
              this.$notify.error("删除失败!");
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
      this.onSearch()
    },
    handleReset() {
      this.stbCondition = {};
    },
    cancel() {
      this.handleClose()
    },
    handleClose(done) {
      this.stbDialog = false;
      if (done && typeof done === "function") {
        done();
      }
    },
  }
}
</script>