<template>
  <!-- 字典管理 -->
  <div class="dictionary-config from-clues">
    <div class="from-clues-header">
      <el-form ref="form" :model="form" label-width="90px">
        <el-form-item v-if="BASE_API.THEME=='jg'">
          <Breadcrumb />
        </el-form-item>
        <el-row>
          <el-col :span="6">
            <el-form-item label="数据表名">
              <el-input v-model="form.DATATABLE" placeholder="数据表名"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="中文名称">
              <el-input v-model="form.CHINESETABLE" placeholder="中文名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="tab表头链接标识" label-width="130px">
              <el-input v-model="form.SOLEURL" placeholder="tab表头链接标识"></el-input>
            </el-form-item>
          </el-col>

          <!-- 操作按钮 -->
          <el-col :span="6" class="btnColRight">
            <btn nativeType="cx" @click="handleUpdateDic">刷新缓存</btn>
            <btn nativeType="cx" @click="handleSearch">查询</btn>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="from-clues-content">
      <lb-table :page-size="pageData.size" :current-page.sync="pageData.current" :total="pageData.total"
        @size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns"
        :data="tableData.data">
      </lb-table>
      <message-tips ref="msg" :message="message" />
    </div>
    <edit-validRule ref="validRule" :ruleData="ruleData"></edit-validRule>
  </div>
</template>

<script>
  // 字典
  import data from "./data";
  import tableMixin from "@/mixins/tableMixin.js";
  import ruleConfig from "@/api/ruleConfig";
  import editValidRule from "../components/editValidRule.vue";
  export default {
    name: "dictionary-config",
    mixins: [tableMixin],
    components: {
      editValidRule,
    },
    data () {
      return {
        message: "",
        form: {
          DATATABLE: "",
          CHINESETABLE: "",
          SOLEURL: "",
          currentPage: 1,
        },
        // 表格数据
        tableData: {
          columns: [
            {
              label: "序号",
              type: "index",
              width: "50",
              index: this.indexMethod,
            },
          ]
            .concat(data.columns())
            .concat([
              {
                label: "操作",
                render: (h, scope) => {
                  return (
                    <div>
                      <el-button
                        type="text"
                        size="mini"
                        icon="el-icon-edit"
                        onClick={() => {
                          this.handleEdit(scope.$index, scope.row);
                        }}
                      >
                        编辑
                      </el-button>

                      <el-button
                        type="text"
                        size="mini"
                        icon="el-icon-delete"
                        style="color:#F56C6C"
                        onClick={() => {
                          this.handleDel(scope.$index, scope.row);
                        }}
                      >
                        删除
                      </el-button>
                    </div>
                  );
                },
              },
            ]),
          data: [],
        },
        // 分页
        pageData: {
          total: 0,
          pageSize: 15,
          current: 1,
        },
        ruleData: null,
      };
    },
    methods: {
      async featchData () {
        try {
          this.form = Object.assign(this.form, this.formData);
          let {
            result: { list, total, pages: pageSize, pageNum: current },
          } = await ruleConfig.getSysYwsjbList(this.form);
          this.tableData.data = list;
          this.pageData = {
            pageSize,
            current,
            total,
          };
        } catch (error) {
          this.message = error;
          this.$refs.msg.messageShow();
        }
      },
      handleSearch () {
        this.form.currentPage = 1
        this.tableData.data = []
        this.featchData()
      },
      async handleEdit (index, row) {
        try {
          let { result: res } = await ruleConfig.eidtConfigRule(row.BSM_YWSJB);
          this.ruleData = res;
          this.$refs.validRule.isShow();
        } catch (error) {
          this.$alert(error, "提示", {
            confirmButtonText: "确定",
            type: "error",
          });
        }
      },
      handleDel (index, row) {
        let _this = this;
        this.$confirm("此操作将进行删除校验规则, 是否继续?", "提示", {
          cancelButtonText: "取消",
          confirmButtonText: "确定",
          type: "warning",
        })
          .then(async () => {
            try {
              let res =
                await ruleConfig.deleteSysYwsjbWithSysYwsjbFieldByBsmYwsjb(
                  row.BSM_YWSJB
                );
              if (res.code == 200) {
                _this.$message({
                  type: "success",
                  message: "删除成功!",
                });
                _this.featchData();
              }
            } catch (error) {
              _this.$alert(error, "提示", {
                confirmButtonText: "确定",
                type: "error",
              });
            }
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除",
            });
          });
      },
      handleUpdateDic () {
        this.$store.dispatch("dictionaries/generateDic").then((res) => {
          if (res) {
            this.$message({
              message: "刷新成功！",
              type: "success",
            });
          }
        });
      },
    },
  };
</script>
<style scoped lang="scss">
  @import "./index.scss";
</style>