spfm-market-front/src/pages/main/performance/mould.vue

<template>
    <div>
        <div class="simple-container">
            <simple-form
                :form="table_form"
                :handle="table_handle"
                @search="handleSearch"
                @add="handleVisible('add')"
            ></simple-form>
            <simple-table
                :list="table_list"
                :config="table_config"
                :loading="table_loading"
                :handle-row="table_handle_row"
                @issue="(params) => handleVisible('issue', params)"
                @detail="(params) => handleVisible('template', params)"
                @delete="handleDelete"
            ></simple-table>
            <simple-pagination
                :page="page"
                :total="total"
                @change="handleChange"
            ></simple-pagination>
        </div>
        <simple-dialog
            title="下发"
            width="500px"
            @cancel="handleVisible('issue')"
            @confirm="handleIssue"
            :visible="issue_visible"
        >
            <el-form label-width="100px" :model="issue_form">
                <el-form-item label="填报事由">
                    <el-input v-model="issue_form.reason"></el-input>
                </el-form-item>
                <el-form-item label="填报注意事项">
                    <el-input v-model="issue_form.precautions"></el-input>
                </el-form-item>
                <el-form-item label="截止时间">
                    <el-date-picker v-model="issue_form.endTime" type="date">
                    </el-date-picker>
                </el-form-item>
            </el-form>
        </simple-dialog>
        <simple-dialog
            fullscreen
            title="新增模板"
            :visible="add_visible"
            width="1200px"
            @confirm="handleVisible('add')"
            @cancel="handleVisible('add')"
        >
            <el-form inline :model="form" label-width="100px"> </el-form>
            <simple-sheet v-if="add_visible" type="edit" />
            <template v-slot:footer><div></div></template>
        </simple-dialog>
        <simple-dialog
            title="查看模板"
            fullscreen
            @cancel="handleVisible('template')"
            @confirm="handleVisible('template')"
            :visible="template_visible"
        >
            <simple-sheet v-if="template_visible" :id="template_id" />
            <template v-slot:footer><div></div></template>
        </simple-dialog>
    </div>
</template>

<script>
import simpleForm from "./components/form.vue";
import simpleSheet from "./components/sheet.vue";
import simpleTable from "./components/table.vue";
import simpleDialog from "./components/dialog.vue";
import simplePagination from "./components/pagination.vue";
export default {
    components: {
        simpleTable,
        simpleDialog,
        simpleForm,
        simpleSheet,
        simplePagination,
    },
    data() {
        return {
            page: 1,
            rows: 10,
            total: 0,
            form: {},
            add_visible: false,
            // template
            template_visible: false,
            template_id: null,
            // issue
            issue_visible: false,
            issue_form: {},
            issue_id: null,
            // table
            table_loading: false,
            table_search: {},
            table_form: [
                {
                    label: "模板名称",
                    props: "templateName",
                    type: "input",
                },
            ],
            table_list: [],
            table_handle: [
                {
                    label: "新增模板",
                    props: "add",
                },
            ],
            table_handle_row: [
                {
                    label: "下发",
                    props: "issue",
                },
                {
                    label: "查看",
                    props: "detail",
                },
                {
                    label: "删除",
                    props: "delete",
                    popconfirm: true,
                },
            ],
            table_config: [
                {
                    label: "模板名称",
                    props: "templateName",
                },
                {
                    label: "配置时间",
                    props: "updateTime",
                },
                {
                    label: "配置人员",
                    props: "createId",
                },
                {
                    label: "模板状态",
                    props: "status",
                    type: "dictionary",
                    dictionary: {
                        0: "在用",
                        1: "停用",
                    },
                },
            ],
        };
    },
    methods: {
        async handleInit() {
            this.table_loading = true;
            this.$http({
                url: "/market/CMKFileTemplate/CMKFileTemplateList",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {
                    page: this.page,
                    pageSize: this.rows,
                    templateName: this.table_search.templateName,
                },
            }).then(({ data: { count, data } }) => {
                this.total = count;
                this.table_list = data;
                this.table_loading = false;
            });
        },
        handleSearch({ templateName }) {
            this.table_search = { templateName };
            this.handleReset();
            this.handleInit();
        },
        handleAdd() {},
        handleChange(page) {
            this.page = page;
            this.handleInit();
        },
        handleVisible(props, params) {
            switch (props) {
                case "add":
                    this.add_visible = !this.add_visible;
                    break;
                case "template":
                    this.template_visible = !this.template_visible;
                    this.template_id = params?.id;
                    break;
                case "issue":
                    this.issue_visible = !this.issue_visible;
                    this.issue_id = params?.id;
                    break;
            }
        },
        handleReset() {
            this.page = 1;
        },
        handleDelete({ id }) {
            this.$http({
                url: "/market/CMKFileTemplate/delCMKFileTemplateById",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {
                    templateId: id,
                },
            }).then(() => {
                this.$message.success("删除成功");
                this.handleInit();
            });
        },
        handleIssue() {
            this.$http({
                url: "/market/CMKFileTemplate/issuedCMKFileTemplateById",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {
                    ...this.issue_form,
                    endTime: this.$formatDate(
                        this.issue_form.endTime,
                        "YYYY-MM-DD"
                    ),
                    templateId: this.issue_id,
                },
            }).then(() => {
                this.handleVisible("issue");
                this.$message.success("下发成功");

                this.handleInit();
            });
        },
    },
    mounted() {
        this.handleInit();
    },
};
</script>

<style></style>