const todo = {
    template: `
         <div class="home-todo">
            <el-tabs v-model="todoActive " @tab-click="handleClick">
                <el-tab-pane label="待处理" name="1">
                    <template slot="label">
                        <span>待处理</span>
                        <el-badge v-if="waitHandleCount > 0" :value="waitHandleCount" :max="99" class="item" style="margin-top:10px;">
                        </el-badge>
                    </template>
                    <el-table :data="todoList" v-loading="todoLoading">
                        <el-table-column label="序号" type="index" width="70"></el-table-column>
                        <el-table-column label="标题" prop="title" show-overflow-tooltip
                                         width="150"></el-table-column>
                        <el-table-column label="发起人" prop="create_name"
                                         width="140"></el-table-column>
                        <el-table-column label="发起时间" prop="create_time"
                                         width="200"></el-table-column>
                        <el-table-column label="状态" prop="status" width="100">
                            <template scope="{row}">
                                {{ status[row.status] }}
                            </template>
                        </el-table-column>
<!--                        <el-table-column label="我的处理环节" prop="taskNodeName"-->
<!--                                         v-if="todoActive!=='3'"></el-table-column>-->
<!--                        <el-table-column label="流程流转环节" prop="nodeName"></el-table-column>-->
                        <el-table-column label="操作" width="100">
                            <template scope="{row}">
<!--                                <el-button @click="sublime.jumpPagePjax(row.formUrl)" size="mini" type="primary">查看</el-button>-->
                                <el-button @click="handleTask(row)" size="mini" type="primary">查看</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-tab-pane>
                <el-tab-pane label="已处理" name="2">
                    <el-table :data="todoList" v-loading="todoLoading">
                        <el-table-column label="序号" type="index" width="70"></el-table-column>
                        <el-table-column label="标题" prop="title" show-overflow-tooltip
                                         width="100"></el-table-column>
                        <el-table-column label="发起人" prop="create_name"
                                         width="100"></el-table-column>
                        <el-table-column label="发起时间" prop="create_time"
                                         width="200"></el-table-column>
                        <el-table-column label="状态" prop="status" width="100">
                            <template scope="{row}">
                                {{ status[row.status] }}
                            </template>
                        </el-table-column>
<!--                        <el-table-column label="我的处理环节" prop="taskNodeName"-->
<!--                                         v-if="todoActive!=='3'"></el-table-column>-->
<!--                        <el-table-column label="流程流转环节" prop="nodeName"></el-table-column>-->
                        <el-table-column label="操作" width="100">
                            <template scope="{row}">
<!--                                <el-button @click="sublime.jumpPagePjax(row.formUrl)" size="mini" type="primary">查看</el-button>-->
                                <el-button @click="handleTask(row)" size="mini" type="primary">查看</el-button>   
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination
                       @size-change="loadCompleteHandle"
                       @current-change="loadCompleteHandle"
                       :current-page="pageForm.pageNumber"
                       :page-sizes="[10, 20, 30, 50]"
                       :page-size="pageForm.pageSize"
                       layout="total, sizes, prev, pager, next, jumper"
                       :total="pageForm.totalCount">
                    </el-pagination>
                </el-tab-pane>
                <el-tab-pane label="我的发起" name="3">
                    <el-table :data="todoList" v-loading="todoLoading">
                        <el-table-column label="序号" type="index" width="70"></el-table-column>
                        <el-table-column label="标题" prop="title" show-overflow-tooltip
                                         width="100"></el-table-column>
                        <el-table-column label="发起人" prop="create_name"
                                         width="100"></el-table-column>
                        <el-table-column label="发起时间" prop="create_time" v-if="todoActive==='3'"
                                         width="200"></el-table-column>
                        <el-table-column label="状态" prop="status" width="100">
                            <template scope="{row}">
                                {{ status[row.status] }}
                            </template>
                        </el-table-column>
<!--                        <el-table-column label="我的处理环节" prop="taskNodeName"-->
<!--                                         v-if="todoActive!=='3'"></el-table-column>-->
<!--                        <el-table-column label="流程流转环节" prop="nodeName"></el-table-column>-->
                        <el-table-column label="操作" width="100">
                            <template scope="{row}">
<!--                                <el-button @click="sublime.jumpPagePjax(row.formUrl)" size="mini" type="primary">查看</el-button>-->
                                <el-button @click="handleTask(row)" size="mini" type="primary">查看</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination
                       @size-change="loadMineSendTask"
                       @current-change="loadMineSendTask"
                       :current-page="pageForm.pageNumber"
                       :page-sizes="[10, 20, 30, 50]"
                       :page-size="pageForm.pageSize"
                       layout="total, sizes, prev, pager, next, jumper"
                       :total="pageForm.totalCount">
                    </el-pagination>
                </el-tab-pane>
            </el-tabs>
<!--            <el-table :data="todoList" style="min-height: 250px" v-loading="todoLoading">-->
<!--                    <el-table-column label="序号" type="index" width="70"></el-table-column>-->
<!--                    <el-table-column label="标题" prop="processName" show-overflow-tooltip-->
<!--                                     width="200"></el-table-column>-->
<!--                    <el-table-column label="发起人" prop="createdByUserName"-->
<!--                                     width="140"></el-table-column>-->
<!--                    <el-table-column label="发起时间" prop="createdOn" v-if="todoActive==='3'"-->
<!--                                     width="150"></el-table-column>-->
<!--                    <el-table-column label="我的处理环节" prop="taskNodeName"-->
<!--                                     v-if="todoActive!=='3'"></el-table-column>-->
<!--                    <el-table-column label="流程流转环节" prop="nodeName"></el-table-column>-->
<!--                    <el-table-column label="操作" width="100">-->
<!--                        <template scope="{row}">-->
<!--                            <el-button @click="sublime.jumpPagePjax(row.formUrl)" size="mini" type="primary">查看</el-button>-->
<!--                        </template>-->
<!--                    </el-table-column>-->
<!--            </el-table>-->
         </div>
    `,
    mixins: [initTableMixins],
    data() {
        return {
            todoActive: "1",
            todoList:[],
            todoLoading: false,
            pageForm: {
                pageNumber: 1,
                pageSize: 10,
                totalCount: 0
            },
            status:['草稿', '待处理', '已处理', '已驳回', '已撤回'],
            waitHandleCount: 0
        }
    },
    watch: {
        todoActive: {
            async handler(val) {
                console.log("val--->", val)
                this.pageForm = {
                    pageNumber: 1,
                    pageSize: 10,
                    totalCount: 0
                }
                this.todoList = []
                try{
                    this.todoLoading = true
                    if(Number(val) === 1) {
                        await this.loadWaitHandle()

                    } else if(Number(val) === 2) {
                        await this.loadCompleteHandle()

                    } else if(Number(val) === 3) {
                        await this.loadMineSendTask()
                    }
                    this.todoLoading = false
                } catch (e) {
                    this.todoLoading = false
                }
            }
        }
    },
    methods: {
        async handleClick() {
            this.todoLoading = true
           /* const {data, code} = await $.get("/platform/sys/localProcess/todoList", { mode: this.todoActive })
            this.todoList = data*/
            this.todoLoading = false
        },

        // 加载待处理数据
        async loadWaitHandle() {
            const res = await $.post('/oa/audit/instance/wait/handle')
            console.log("待处理数据->", res)
            if(res.code === 0) {
                this.todoList = res.data
                this.waitHandleCount = this.todoList.length
            }
        },

        // 加载已办数据
        async loadCompleteHandle() {
            const res = await $.post('/oa/audit/instance/complete/handle', { ...this.pageForm })
            console.log("已处理数据->", res)
            this.todoList = res.list
            this.pageForm.pageNumber = res.pageNo
            this.pageForm.pageSize = res.pageSize
            this.pageForm.totalCount = res.totalCount
        },

        // 加载我发起的
        async loadMineSendTask() {
            const res = await $.post('/oa/audit/instance/mine/send', { ...this.pageForm })
            console.log("我发起数据->", res)
            this.todoList = res.list
            this.pageForm.pageNumber = res.pageNo
            this.pageForm.pageSize = res.pageSize
            this.pageForm.totalCount = res.totalCount
        },

        // 待处理任务处理
        async handleTask(row) {
            if(this.todoActive === '1') {
                const urlObj = new URL(row.url)
                console.log(urlObj)
                window.location.href = urlObj.pathname + urlObj.search
            } else {
                const urlObj = new URL(row.done_url)
                console.log(urlObj)
                window.location.href = urlObj.pathname + urlObj.search
            }
        }
    },
    created() {
        this.handleClick()

        // 待处理
        this.loadWaitHandle()
    }
}