saas_member/src/views/goodsMag/classify.vue

<template>
  <container title="商品分类">
    <template v-slot:btn>
      <el-button type="primary" @click="dialogVisible = true"
        >添加分类</el-button
      >
      <el-button @click="batchDel">批量删除</el-button>
    </template>
    <search-box-new
      :formData="formData"
      :formList="formList"
      @search="search"
      @init="init"
    />
    <table-list
      ref="tableList"
      :tableSets="tableSet"
      :tableData="tableData"
      :navText="navText"
      rowKey="id"
      :loading="loading"
    >
      <template slot="status" slot-scope="props">
        <el-switch
          v-model="props.scope.row.status"
          active-color="#13ce66"
          inactive-color="#ff4949"
          :active-value="1"
          :inactive-value="0"
          @change="statusChange($event, props.scope.row)"
        >
        </el-switch>
      </template>
      <template slot="btn" slot-scope="props">
        <el-button type="text" @click="handelClick(2, props.scope.row.tpId)"
          >编辑</el-button
        >
        <el-button type="text" @click="resetPass(props.scope.row.tpId)"
          >添加</el-button
        >
        <el-button type="text" @click="handelDel(props.scope.row.tpId)"
          >删除</el-button
        >
      </template>
    </table-list>
    <pagination
      :total="total"
      :pageSize.sync="formData.pageSize"
      :currentPage.sync="formData.pageNum"
      @search="search"
    />
    <class-set-dlg :dialogVisible.sync="dialogVisible"></class-set-dlg>
  </container>
</template>

<script>
import ClassSetDlg from "./components/ClassSetDlg";
export default {
  name: "SaasMemberRecord",

  data() {
    return {
      loading: false,
      navText: {
        index: 0,
        num: true,
        choice: true,
        addHide: true,
        openCheckMore: true,
        custom: false,
      },
      formData: {},
      tableSet: [
        {
          label: "分类名称",
          prop: "tpName",
        },
        {
          label: "启动状态",
          prop: "tpName",
          scope: "solt",
          soltName: "status",
        },
        {
          label: "创建时间",
          prop: "tpName",
        },
      ],
      tableData: [{}],
      total: 0,
      formList: [
        {
          prop: "name",
          placeholder: "请输分类名称",
        },
      ],
      dialogVisible: true,
    };
  },

  mounted() {},

  methods: {
    search(v) {
      console.log(this.formData, 789);
    },
    init() {
      this.search();
    },
    del(id) {
      this.$confirm("确定删除吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {})
        .catch(() => {});
    },
    resetPass(id) {
      this.$confirm("确定恢复为初始密码吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {})
        .catch(() => {});
    },
    batchDel() {
      let len = this.$refs.tableList.allCheckData.length;
      if (!len) {
        return this.$message.warning("请先勾选店员");
      }
      this.$confirm(`此操作将永久删除所勾选的${len}条店员, 是否继续?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          const ids = this.$refs.tableList.allCheckData.map(
            (item) => item.moduleExamId
          );
          moduleVolumeBatchDel({
            status: -1,
            ids,
          }).then((res) => {
            this.$message.success("批量删除成功");
            this.$refs.tableList.clearMoreActive();
            this.search(1);
          });
        })
        .catch(() => {});
    },
    statusChange(e, row) {
      //   this.$api
      //     .editmallstore({ storeId: row.storeId, status: e })
      //     .then((res) => {
      //       this.$message.success("操作成功");
      //       row.status = e;
      //     })
      //     .catch(() => {
      //       return (row.status = e ? 0 : 1);
      //     });
    },
  },
  components: { ClassSetDlg },
};
</script>

<style lang="scss" scoped></style>