<template>
    <div class="war" style="padding:15px 10px 0 10px">
        <div class="task-container">
            <div class="task-left-menu">
                <el-tabs tab-position="left" style="height:100%" @tab-click="search">
                    <el-tab-pane label="我的任务">
                        <span slot="label"><i class="el-icon-user"></i> 我的任务</span>
                    </el-tab-pane>
                    <el-tab-pane label="历史任务">
                        <span slot="label"><i class="el-icon-time"></i> 历史任务</span>
                    </el-tab-pane>
                </el-tabs>
            </div>

            <div class="task-right-content">
                <el-form :model="queryParams" :inline="true" style="padding:0 0 0 0" size="small">
                </el-form>
                <el-table :data="tableData">
                    <el-table-column prop="lesson" label="序号" width="60" type="index" align="center"
                        style="height: 20px;" />
                    <el-table-column prop="activityName" label="活动名称" align="center" />
                    <el-table-column label="活动地点" align="center" prop="activityArea" />
                    <el-table-column label="负责人" align="center" prop="specificUserName" />
                    <el-table-column label="活动人数" align="center" prop="activityNumber" />
                    <el-table-column prop="isRehearsal" label="是否彩排" align="center">
                        <template slot-scope="{ row }">
                            {{ row.isRehearsal == 0 ? "否" : row.isRehearsal == 1 ? "是" : "" }}
                        </template>
                    </el-table-column>
                    <el-table-column label="是否录像" align="center" prop="isVideo">
                        <template slot-scope="{ row }">
                            {{ row.isVideo == 0 ? "否" : row.isVideo == 1 ? "是" : "" }}
                        </template>
                    </el-table-column>
                    <el-table-column label="是否直播" align="center" prop="isLive">
                        <template slot-scope="{ row }">
                            {{ row.isLive == 0 ? "否" : row.isLive == 1 ? "是" : "" }}
                        </template>
                    </el-table-column>
                    <el-table-column label="是否需要大屏" align="center" prop="isBigScreen">
                        <template slot-scope="{ row }">
                            {{ row.isBigScreen == 0 ? "否" : row.isBigScreen == 1 ? "是" : "" }}
                        </template>
                    </el-table-column>
                    <el-table-column label="申请部门" align="center" prop="applyDept" />
                    <el-table-column label="申请人" align="center" prop="applyName" />
                    <el-table-column label="申请时间" align="center" prop="applyTime" />
                    <el-table-column label="操作" align="center" width="80">
                        <template slot-scope="scope">
                            <el-button v-if="isTaskListe" type="text" size="mini" icon="el-icon-edit"
                                @click="handleResolve(scope.row, false)">办理
                            </el-button>
                            <el-button v-if="!isTaskListe" type="text" size="mini" icon="el-icon-edit"
                                @click="hisHandleResolve(scope.row, true)">历史
                            </el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <!--        <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"-->
                <!--                    :limit.sync="queryParams.pageSize" @pagination="search"/>-->
                <div>
                    <auhandleResolv v-if="process.open" :process-open.sync="process.open" :instanceId="process.instanceId"
                        :id="process.id" :taskId="process.taskId" :readOnly="process.readOnly" :revoke="process.revoke"
                        :row="rowData">
                    </auhandleResolv>
                </div>
                <div>
                    <hisHandleResolve v-if="process.hisOpen" :process-open.sync="process.hisOpen"
                        :instanceId="process.instanceId" :id="process.id" :taskId="process.taskId"
                        :readOnly="process.readOnly" :revoke="process.revoke" :row="rowData">
                    </hisHandleResolve>
                </div>
            </div>
        </div>

    </div>
</template>

<script>
import {
    taskDoneList, //查询礼堂申请已办列表
    audiDetail,// 礼堂申请审批待办列表
} from "@/api/smartSchool/indexMould/myTask/audApplicationapproval";
import auhandleResolv from "@/views/smartSchool/indexMould/myTask/audApplicationapproval/components/auhandleResolv.vue";
import hisHandleResolve from "@/views/smartSchool/indexMould/myTask/audApplicationapproval/components/auhishandleResolve.vue";

export default {
    name: 'audApplicationapproval',
    components: {
        auhandleResolv,
        hisHandleResolve
    },
    data() {
        return {
            // 遮罩层
            loading: false,
            queryParams: {
                // pageNum: 1,
                // pageSize: 10,
            },
            tableData: [

            ],
            // 存储行数据
            rowData: {},
            total: 0,
            // 办理流程
            process: {
                id: undefined,
                instanceId: undefined,
                taskId: undefined,
                open: false,
                hisOpen: false,
                title: '流程办理',
                readOnly: false,
                // 是否销假
                revoke: false
            },

            isTaskListe: true,
        }
    },
    methods: {
        /** 查询 */
        search(evl) {
            console.log(evl);
            if (evl.label == "历史任务") {
                console.log("历史人物")
                this.isTaskListe = false
                this.loading = true;
                taskDoneList().then((response) => {
                    this.tableData = response.rows
                    this.total = response.total
                    this.loading = false
                });
            } else {
                console.log("金额人物")
                this.loading = true;
                this.isTaskListe = true
                audiDetail().then((response) => {
                    this.tableData = response.rows
                    this.total = response.total
                    this.loading = false
                });
            }

        },
        // 一进入查询
        searchStart() {
            // this.loading = true;
            this.queryParams = {
                pageNum: 1,
                pageSize: 10,
            }
            this.isTaskListe = true
            audiDetail().then((response) => {
                this.tableData = response.rows
                // console.log(response.rows);
                this.loading = false

            });

        },
        // 搜索查询
        inputSearch() {
            // this.loading = true;
            this.isTaskListe = true
            // console.log(445566);

            audiDetail(this.queryParams.purchaseName).then((response) => {
                // this.tableData = response.rows
                console.log(response.rows);
                // this.loading = false

            });

        },
        /** 提交 */
        submit() {
            // this.loading = true;
            // getMyTable().then((response) => {
            //     this.tableData = response.rows
            //     console.log(response.rows);
            // this.loading=false
            // });
        },
        /** 办理 */
        handleResolve(row, readOnly) {
            this.process.open = true;
            this.process.instanceId = row.instanceId;
            this.process.id = row.id;
            this.process.taskId = row.taskId;
            this.process.readOnly = readOnly; // 主要用来判断是否为历史任务。或者是申请人查看
            this.rowData.applyUserName = row.applyUserName;
            this.rowData.activityName = row.activityName;
            this.rowData.activityArea = row.activityArea;
            this.rowData.activityTime = row.activityTime;
            this.rowData.htNumber = row.htNumber;
            this.rowData.specificUserName = row.specificUserName;
            this.rowData.activityNumber = row.activityNumber;
            this.rowData.isRehearsal = row.isRehearsal;
            this.rowData.isVideo = row.isVideo;
            this.rowData.isBigScreen = row.isBigScreen;
            this.rowData.applyName = row.applyName;
            this.rowData.applyDept = row.applyDept;

        },
        /**历史 */
        hisHandleResolve(row, readOnly) {
            this.process.hisOpen = true;
            this.process.open = false;
            this.process.instanceId = row.instanceId;
            this.process.id = row.id;
            this.process.taskId = row.taskId;
            this.process.readOnly = readOnly; // 主要用来判断是否为历史任务。或者是申请人查看
            this.rowData.applyUserName = row.applyUserName;
            this.rowData.activityName = row.activityName;
            this.rowData.activityArea = row.activityArea;
            this.rowData.activityTime = row.activityTime;
            this.rowData.htNumber = row.htNumber;
            this.rowData.specificUserName = row.specificUserName;
            this.rowData.activityNumber = row.activityNumber;
            this.rowData.isRehearsal = row.isRehearsal;
            this.rowData.isVideo = row.isVideo;
            this.rowData.isBigScreen = row.isBigScreen;
            this.rowData.applyName = row.applyName;
            this.rowData.applyDept = row.applyDept;

        },
    },
    created() {
        this.searchStart()

    },
}
</script>

<style scoped></style>

