qms/src/views/modules/customerquality/components/baseConfig.vue

<!--
 * @Author: zhp
 * @Date: 2023-07-14 13:44:46
 * @LastEditTime: 2023-07-18 14:25:05
 * @LastEditors: zhp
 * @Description: 
-->
<template>
  <div>
    <el-drawer :title="$t('customerquality.knowledgeBase')" :visible.sync="drawer" size="50%">
      <div>
        <SearchBar :formConfigs="formConfig" ref="ruleForm" @headBtnClick="buttonClick">
          <!-- <el-badge :value="5" class="item">
            <el-button type="primary" size="small" @click="conditionSearch">条件搜索</el-button>
          </el-badge> -->
        </SearchBar>
        <base-table id="palletTable" :table-props="tableProps" :page="listQuery.page" ref="palletTable1"
          :limit="listQuery.limit" :table-data="tableData">
          <method-btn v-if="tableBtn.length" slot="handleBtn" :width="100" label="操作" :method-list="tableBtn"
            @clickBtn="handleClick" />
        </base-table>
        <pagination :limit.sync="listQuery.limit" :page.sync="listQuery.page" :total="listQuery.total"
          @pagination="getDataList" />
      </div>
      <baseConfig-add ref="baseConfigAddList" v-if="baseConfigAddShow" @refreshDataList="getDataList"></baseConfig-add>
    </el-drawer>
  </div>
</template>

<script>
import basicPage from "@/mixins/basic-page"
// import basicSearch from "@/mixins/basic-search"
// import projectTypeSearch from "./components/projectTypeSearch.vue"
import baseConfigAdd from "./baseConfig-add"
import customerquality from '@/filters/customerquality'
// import qmsKnowledgeBaseAdd from "./components/qmsKnowledgeBase-add.vue"
import InnerTable from "./innerTable"
import i18n from "@/i18n"
// import i18n from "@/i18n";
const tableProps = [
  {
    prop: "requirementListName",
    label: i18n.t('customerquality.requirementListName'),
  },
  {
    prop: "uploadFiles",
    label: i18n.t('customerquality.uploadFiles'),
  },
  {
    prop: "categoryName",
    label: i18n.t('uploadFile'),
  },
  {
    prop: "code",
    label: i18n.t('customerquality.file'),
    subcomponent: InnerTable
  },
];
const tableBtn = [
  {
    type: "edit",
    btnName: i18n.t('edit'),
  },
  {
    type: "delete",
    btnName: i18n.t('delete'),
  }
];
export default {
  mixins: [basicPage],
  components: {
    baseConfigAdd,
  },
    data() {
      return {
        urlOptions: {
          getDataListURL: "/customerquality/qmsKnowledgeBaseRequirementList/page",
          deleteURL: "/customerquality/qmsKnowledgeBase",
          exportURL: '/customerquality/qmsKnowledgeBase/export'
        },
        tableBtn,
        baseConfigAddShow:[],
        formConfig: [
          {
            type: "button",
            btnName: i18n.t('search'),
            name: "search",
            color: "primary",
            // plain: true,
          },
          {
            type: "button",
            btnName: i18n.t('add'),
            name: "add",
            color: "success",
            plain: true
          },
        ],
        tableProps,
        tableData: [],
        drawer: false,
        listQuery: {
          limit: 10,
          page:1,
        }
      }
  },
    methods: {
      init(obj) {
        this.listQuery.knowledgeBaseId = obj.knowledgeBaseId || ""
        this.listQuery.requirementListId = obj.requirementListId || ""

        // this.dataForm.dictTypeId = dictTypeId || "";
        this.drawer = true
        this.$nextTick(() => {
          this.getDataList()
        });
      },
      buttonClick(val) {
        console.log(val)
        switch (val.btnName) {
          case "search":
            // this.listQuery.paramCode = val.paramCode;
            // this.listQuery.supplierName = val.supplierName ? val.supplierName : undefined
            // this.listQuery.supplierStatus = val.supplierStatus ? val.supplierStatus : undefined
            // this.listQuery.supplierTypeId = val.supplierTypeId ? val.supplierTypeId : undefined
            // this.listQuery.ment = this.ment ? this.ment : undefined
            // console.log(i18n);
            this.listQuery.page = 1;
            this.getDataList()
            break;
          // case "export":
          //   // this.listQuery.paramCode = val.paramCode;
          //   this.exportHandle()
          //   break;
          case "add":
            // this.addOrEditTitle = '新增'
            // this.addOrUpdateVisible = true;
            this.baseConfigAddShow = true
            const obj = {
              knowledgeBaseId:   this.listQuery.knowledgeBaseId,
              requirementListId: this.listQuery.requirementListId 
            }
            this.$nextTick(() => {
              this.$refs.baseConfigAddList.init(obj)
            })
            // this.addOrUpdateHandle()
            break;
          default:
        }
      },
      getDataList() {
        this.dataListLoading = true;
        this.$http
          .get(this.urlOptions.getDataListURL, {
            params: this.listQuery,
          })
          .then(({ data: res }) => {
            this.dataListLoading = false;
            if (res.code !== 0) {
              this.tableData = [];
              this.listQuery.total = 0;
              return this.$message.error(res.msg);
            }
            this.tableData = res.data.list;
            this.listQuery.total = res.data.total;
          })
          .catch(() => {
            this.dataListLoading = false;
          })
      },
      handleClick(val) {
        if (val.type === "delete") {
          this.$confirm(`确定对[名称=${val.data.customerTypeName}]进行删除操作?`, "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              this.$http.delete(this.urlOptions.deleteURL, { data: [val.data.id] }).then(({ data }) => {
                if (data && data.code === 0) {
                  this.$message({
                    message: "操作成功",
                    type: "success",
                    duration: 1500,
                    onClose: () => {
                      this.getDataList();
                    },
                  });
                } else {
                  this.$message.error(data.msg);
                }
              });
            })
            .catch(() => { });
        } else if (val.type === 'edit') {
          this.baseConfigAddShow = true
          const obj = {
            knowledgeBaseId: this.listQuery.knowledgeBaseId,
            requirementListId: this.listQuery.requirementListId,
            id:val.data.id
          }
          this.$nextTick(() => {
            this.$refs.baseConfigAddList.init(obj)
          })
        }
      },
    },
  }
</script>

<style lang="scss" scoped>

</style>