<template>
    <div>
        <div class="simple-container">
            <simple-form
                :form="table_form"
                @search="handleSearch"
            ></simple-form>
            <simple-table
                :list="table_list"
                :config="table_config"
                :loading="table_loading"
                :handle-row="table_handle_row"
                @principalName="
                    (params) => handleVisible('principalName', params)
                "
                @detail="(params) => handleVisible('detail', params)"
                @withdraw="handleWithdraw"
                @edit="(params) => handleVisible('edit', params)"
            ></simple-table>
            <simple-pagination
                :page="page"
                :total="total"
                @change="handleChange"
            ></simple-pagination>
        </div>
        <simple-dialog
            title="查看"
            fullscreen
            @cancel="handleVisible('template')"
            @confirm="handleVisible('template')"
            :visible="template_visible"
        >
            <!-- <div class="flex-justify-align-end padding-right-20 padding-left-20">
        <div>
          <el-button type="primary">导出</el-button>
          <el-button @click="handleVisible('template')" type="primary"
            >返回</el-button
          >
        </div>
      </div> -->
            <simpleSheet
                v-if="template_visible && isCheck"
                :id="edit_rows.id"
                attribute="order"
            />
            <!-- 目前不支持 下发的编辑 -->
            <!-- <simpleSheet
                v-if="template_visible && !isCheck"
                :id="edit_rows.id"
                attribute="order"
                type="edit"
            /> -->
            <template v-slot:footer><div></div></template>
        </simple-dialog>
        <!-- <simple-dialog
            title="回复详情"
            width="700px"
            @cancel="handleVisible('principalName')"
            @confirm="handleVisible('principalName')"
            :visible="receiver_visible"
        >
            <simple-table
                :list="receiver_table_list"
                :config="receiver_table_config"
                :loading="receiver_table_loading"
                @receiver="handleVisible('principalName')"
            ></simple-table>
        </simple-dialog> -->
    </div>
</template>

<script>
// import analysis from "./analysis.vue";
import simpleForm from "./components/form.vue";
import simpleTable from "./components/table.vue";
import simpleDialog from "./components/dialog.vue";
import simplePagination from "./components/pagination.vue";
import simpleSheet from "./components/sheet.vue";
export default {
    components: {
        // analysis,
        simpleTable,
        simpleDialog,
        simpleForm,
        simplePagination,
        simpleSheet,
    },
    data() {
        return {
            page: 1,
            rows: 10,
            total: 0,
            edit_rows: {},
            isCheck: false,
            template_visible: false,
            receiver_visible: false,
            table_loading: false,
            receiver_table_loading: false,
            table_search: {},
            table_form: [
                {
                    label: "模板名称",
                    props: "templateName",
                    type: "input",
                },
                {
                    label: "截止日期",
                    props: "endTime",
                    type: "date",
                },
            ],
            table_list: [],
            table_handle_row: [
                {
                    label: "查看",
                    props: "detail",
                },
                // {
                //     label: "修改",
                //     props: "edit",
                // },
                {
                    label: "撤回",
                    props: "withdraw",
                    popconfirm: true,
                },
            ],
            table_config: [
                {
                    label: "模板名称",
                    props: "templateName",
                },
                {
                    label: "填报事由",
                    props: "reason",
                },
                {
                    label: "填报注意事项",
                    props: "precautions",
                },
                {
                    label: "截止时间",
                    props: "endTime",
                    type: "date",
                },
                {
                    label: "接收人",
                    props: "principalName",
                    type: "click",
                },
            ],
            receiver_table_list: [
                {
                    receiver: "接收人",
                    department: "科室",
                    date: "回复时间",
                    value: "2021.11.4 XXX 同意\n2021.11.4 XXX 同意",
                },
            ],
            receiver_table_config: [
                {
                    label: "接收人",
                    props: "receiver",
                },
                {
                    label: "科室",
                    props: "department",
                },
                {
                    label: "回复时间",
                    props: "date",
                },
                {
                    label: "审批记录",
                    props: "value",
                    type: "textarea",
                },
            ],
        };
    },
    methods: {
        async handleInit(data) {
            this.$http({
                url: "/market/CMKIssued/CMKIssuedList",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {
                    ...data,
                    endTime:
                        data.endTime &&
                        this.$formatDate(data.endTime, "YYYY-MM-DD"),
                },
            }).then(({ data: { data, count } }) => {
                this.total = count;
                this.table_list = data;
            });
            // this.table_loading = true;
            // const data = [];
            // let index = 0;
            // while (index < 1) {
            //     data.push(
            //         ...JSON.parse(sessionStorage.getItem("global_data")).filter(
            //             (element) => element.issue_status
            //         )
            //     );
            //     index = index + 1;
            // }
            // this.total = index;
            // this.table_list = data;
            // this.table_loading = false;
        },
        handleSearch(data) {
            this.table_search = data;
            this.handleReset();
            this.handleInit({ ...data, page: this.page, pageSize: this.rows });
        },
        handleChange(page) {
            this.page = page;
            this.handleInit({
                ...this.table_search,
                page: this.page,
                pageSize: this.rows,
            });
        },
        handleVisible(props, params) {
            switch (props) {
                case "detail":
                    if (params) {
                        this.isCheck = true;
                        this.edit_rows = params;
                        this.template_visible = true;
                    } else {
                        this.isCheck = false;
                        this.template_visible = false;
                    }
                    // this.template_visible = !this.template_visible;
                    break;
                case "edit":
                    if (params) {
                        this.isCheck = false;
                        this.edit_rows = params;
                        this.template_visible = true;
                    } else {
                        this.template_visible = false;
                    }
                    // this.template_visible = !this.template_visible;
                    break;
                case "template":
                    this.template_visible = false;
                    // this.template_visible = !this.template_visible;
                    break;
                case "principalName":
                    if (params) {
                        console.log(params);
                    }
                    this.receiver_visible = !this.receiver_visible;
                    break;
            }
        },
        handleReset() {
            this.page = 1;
        },
        handleWithdraw({ id }) {
            this.$http({
                url: "/market/CMKIssued/CMKDelIssuedById",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: { id },
            }).then(({ data }) => {
                console.log(data);
                if (data.desc === "删除成功") {
                    this.$message.success("撤回成功");
                    this.handleInit({
                        ...this.table_search,
                        page: this.page,
                        pageSize: this.rows,
                    });
                }
            });
        },
    },
    mounted() {
        this.handleInit({
            ...this.table_search,
            page: this.page,
            pageSize: this.rows,
        });
    },
};
</script>

<style></style>
