simulation-front/src/views/sceneLibrary/gradingRulesList.vue

<template>
    <div>
        <search-layout :needBox="true">
            <!-- <template slot="searchItem1">
                <span class="label">规则ID</span>
                <el-input
                    v-model="searchParams.rulesCode"
                    size="small"
                    clearable
                    placeholder="请输入"
                    maxlength="60"
                    @keyup.enter.native="doSearch"
                >
                </el-input>
            </template> -->
            <template slot="searchItem1">
                <span class="label">规则名称</span>
                <el-input
                    v-model="searchParams.ruleName"
                    size="small"
                    clearable
                    placeholder="请输入"
                    maxlength="50"
                    @keyup.enter.native="doSearch"
                >
                </el-input>
            </template>
            <template slot="searchItem2">
                <span class="label">规则描述</span>
                <el-input
                    v-model="searchParams.ruleDescription"
                    size="small"
                    clearable
                    placeholder="请输入"
                    maxlength="300"
                    @keyup.enter.native="doSearch"
                >
                </el-input>
            </template>
            <template slot="searchItem3">
                <span class="label">创建时间</span>
                <el-date-picker
                    v-model="searchDate"
                    type="daterange"
                    format="yyyy-MM-dd"
                    value-format="yyyy-MM-dd"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                >
                </el-date-picker>
            </template>
            <template slot="searchBtn1">
                <el-button type="primary" @click="doSearch">查询</el-button>
            </template>
            <template slot="searchBtn2">
                <el-button type="primary" @click="doReset">重置</el-button>
            </template>
        </search-layout>

        <div class="myTabsBox">
            <el-tabs v-model="activeName" type="card" @tab-click="pageControl">
                <el-tab-pane label="公有" name="1"></el-tab-pane>
                <el-tab-pane label="私有" name="2"></el-tab-pane>
            </el-tabs>
            <el-button
                v-bind:class="{ addBtn: true, disabled: activeName === '1' }"
                icon="el-icon-circle-plus-outline"
                @click="addOne"
                type="primary"
                :disabled="activeName === '1'"
                >新增</el-button
            >
        </div>

        <tableList
            ref="table"
            style="margin: 0 30px"
            :columns="columns"
            :getDataWay="getDataWay"
            :pagination="pagination"
            index
        >
            <el-table-column
                label="规则描述"
                slot="ruleDescription"
                align="center"
            >
                <template v-slot="scope">
                    <span>{{ scope.row.ruleDescription }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="操作"
                slot="cgInfos"
                align="center"
                width="180"
            >
                <template v-slot="scope">
                    <i
                        v-if="activeName === '2'"
                        @click="shareRow(scope.row)"
                        class="el-icon-share elIcon"
                        title="分享"
                    ></i>
                    <i
                        @click="editRow(scope.row)"
                        class="el-icon-edit-outline elIcon"
                        title="编辑"
                    ></i>
                    <i
                        v-if="activeName === '2'"
                        @click="delRow(scope.row)"
                        class="el-icon-delete elIcon"
                        title="删除"
                    ></i>
                </template>
            </el-table-column>
        </tableList>
    </div>
</template>

<script>
import searchLayout from "@/components/grid/searchLayout";
import tableList from "@/components/grid/TableList";
import toolbarTab from "@/components/toolbar/toolbarTab";

export default {
    name: "gradingRulesList", // 评分规则列表
    components: { searchLayout, tableList, toolbarTab },
    data() {
        return {
            activeName: "2",
            searchParams: {
                //搜索参数
                // rulesCode: "", //规则Id
                ruleName: "", //规则名称
                ruleDescription: "", //规则描述
                yearMin: "", // 开始时间
                yearMax: "", // 结束时间
            },
            searchDate: "", // 创建时间
            columns: [
                //表格列
                {
                    label: "规则名称",
                    prop: "ruleName",
                },
                {
                    label: "规则描述",
                    prop: "ruleDescription",
                    showOverflowTooltip: true,
                    template: true,
                },
                {
                    label: "创建时间",
                    prop: "createTime",
                    formatter(row) {
                        return row.createTime.slice(0, 10);
                    },
                },
                {
                    label: "操作",
                    prop: "cgInfos",
                    template: true,
                },
            ],
            pagination: {
                //分页使用
                currentPage: 1,
                pageSize: 10,
                position: "right",
                pageSizes: [10, 30, 50, 100, 200],
                layout: "sizes, total, prev, pager, next, jumper",
            },
            getDataWay: {
                //加载表格数据
                dataType: "url",
                type: "post",
                // firstRequest: false,
                data: this.$api.sceneLibrary.queryScoringRulesList,
                param: {
                    packageId: "11111111",
                    share: "0",
                },
            },
            dialogVisible: false,
        };
    },
    methods: {
        doSearch() {
            if (this.searchDate) {
                this.searchParams.yearMin = `${this.searchDate[0]} 00:00:00`;
                this.searchParams.yearMax = `${this.searchDate[1]} 23:59:59`;
            } else {
                this.searchParams.yearMin = "";
                this.searchParams.yearMax = "";
            }

            let pageMap = {
                // rulesCode: this.searchParams.rulesCode,
                ruleName: this.searchParams.ruleName,
                ruleDescription: this.searchParams.ruleDescription,
                yearMin: this.searchParams.yearMin,
                yearMax: this.searchParams.yearMax,
                share: this.activeName === "1" ? "1" : "0",
            };
            this.refreshList(pageMap);
        },
        //刷新table
        refreshList(param) {
            param
                ? this.$refs["table"].loadData(param)
                : this.$refs["table"].loadData();
        },
        doReset() {
            this.searchParams = {
                // rulesCode: "",
                ruleName: "",
                ruleDescription: "",
                yearMin: "",
                yearMax: "",
            };
            this.searchDate = "";
            this.doSearch();
        },
        viewRow(row) {
            this.dialogVisible = true;
        },
        pageControl(data) {
            this.activeName = data.name;
            this.doSearch();
        },
        addOne() {
            this.$router.push({ path: "/gradingRule" });
        },
        shareRow(row) {
            this.$confirm("确认是否分享？", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(() => {
                this.$axios({
                    method: "post",
                    url: this.$api.sceneLibrary.fxScoringRules,
                    data: {
                        rulesId: row.rulesId,
                    },
                }).then((res) => {
                    if (res.code == 200) {
                        this.$message.success("分享成功");
                    } else {
                        this.$message.error(res.message || "分享失败");
                    }
                    this.doSearch();
                });
            });
        },
        delRow(row) {
            this.$confirm("确认是否删除？", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(() => {
                this.$axios({
                    method: "post",
                    url: this.$api.sceneLibrary.deleteScoringRules,
                    data: {
                        rulesId: row.rulesId,
                    },
                }).then((res) => {
                    if (res.code == 200) {
                        this.$message.success("删除成功");
                    } else {
                        this.$message.error(res.message || "删除失败");
                    }
                    this.doSearch();
                });
            });
        },
        editRow(row) {
            this.$router.push({
                path: "/gradingRule",
                // params: {
                //     rulesId: row.rulesId,
                //     share: row.share,
                // },
                query: {
                    rulesId: row.rulesId,
                    share: row.share,
                },
            });
        },
    },

    // mounted() {}
};
</script>

<style lang='less' scoped>
</style>