<div id="app" v-cloak>
    <el-card class="box-card">
        <el-form class="search" :inline="true" :model="vm" ref="vm" label-position="right" label-width="90px">
            <el-form-item label="任务ID" prop="taskId">
                <el-input v-model="vm.taskId" clearable size="mini" placeholder="请输入任务ID"></el-input>
            </el-form-item>
            <el-form-item label="任务名称" prop="taskName">
                <el-input v-model="vm.taskName" clearable size="mini" placeholder="请输入任务名称"></el-input>
            </el-form-item>
            <el-form-item label="运行状态" prop="run">
                <el-radio-group v-model="vm.run" clearable size="mini">
                    <el-radio :label="true">运行</el-radio>
                    <el-radio :label="false">暂停</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" size="mini" icon="el-icon-search" @click="onSearch">搜索</el-button>
                <el-button type="warning" size="mini" icon="el-icon-refresh-left" @click="onReset('vm')">重置</el-button>
            </el-form-item>
        </el-form>
    </el-card>

    <el-card class="box-card">
        <el-table
                class="data"
                @selection-change="onSelectionChange"
                empty-text="无数据"
                :stripe="true"
                :data="result"
                size="mini">
            <el-table-column
                    align="center"
                    width="45"
                    type="selection">
            </el-table-column>
            <el-table-column
                    align="center"
                    width="140"
                    prop="id"
                    label="主键">
            </el-table-column>
            <el-table-column
                    align="center"
                    min-width="120"
                    prop="name"
                    label="任务名称">
            </el-table-column>
            <el-table-column
                    align="center"
                    min-width="150"
                    prop="note"
                    label="任务描述">
            </el-table-column>
            <el-table-column
                    align="center"
                    min-width="100"
                    prop="run"
                    label="状态">
                <template slot-scope="scope">
                    <el-tag size="mini" effect="dark" type="success" v-if="scope.row.run">运行</el-tag>
                    <el-tag size="mini" effect="dark" type="danger" v-if="!scope.row.run">暂停</el-tag>
                </template>
            </el-table-column>
            <el-table-column
                    align="center"
                    width="200"
                    fixed="right"
                    label="操作">
                <template slot-scope="scope">
                    <el-button-group>
                        <el-button type="primary" icon="el-icon-video-play" :disabled="scope.row.run" size="mini" @click="onStart(scope.row)">运行</el-button>
                        <el-button type="primary" icon="el-icon-video-pause" :disabled="!scope.row.run" size="mini" @click="onStop(scope.row)">暂停</el-button>
                    </el-button-group>
                </template>
            </el-table-column>
        </el-table>
    </el-card>
</div>
<script>
    var app = new Vue({
        mixins: [mixin],
        el: "#app",
        data: {
            module: 'wsys',
            target: 'schedule',
            vm: {//条件及分页参数
                taskId: null,
                taskName: null,
                taskNote: null,
                taskType: null,
                run: null,
                pageNumber: 1,
                pageSize: 0,
                totalCount: 0,
                sortKey: 'CREATE_TIME',
                sortType: 'DESC'
            }
        },
        methods: {
            onStart: function (item) {
                new Ajax("wsys", "schedule", "start").post({id: item.id},function (response) {
                    if (response.errors.length > 0) {
                        nav.e(response.errors[0].message);
                    } else {
                        nav.s("开启成功.");
                        this.onFind();
                    }
                }.bind(this))
            },
            onStop: function (item) {
                this.$confirm('停止任务后，可能导致部分模块无法正常运行，以至出现无法预料的问题，是否确认停止?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(function () {
                    new Ajax("wsys", "schedule", "stop").post({id: item.id},function (response) {
                        if (response.errors.length > 0) {
                            nav.e(response.errors[0].message);
                        } else {
                            nav.s("停止成功.");
                            this.onFind();
                        }
                    }.bind(this))
                }.bind(this)).catch(function (action) {

                });
            }
        },
        mounted: function () {
            this.onFind();
        }
    })
</script>
