<template xmlns:text-align="">
    <div>
        <div class="container">
            <el-form :model="infolist" ref="infolist" :rules="rules" class="container-box">
                <h2 style="display: block;margin-bottom: 20px;">发起考核</h2>
                <div style="height: calc(100% - 160px);overflow-y: scroll;">
                    <el-form-item class="info-line">
                        <span>考核主题</span>
                        <el-input size="mini" v-model="infolist.tit"></el-input>
                    </el-form-item>
                    <el-form-item class="info-line">
                        <span>请选择考核模板</span>
                        <el-select :popper-append-to-body="false" clearable v-model="infolist.materType" placeholder="考核模板" @change="assObjSel">
                            <el-option v-for="items in assObjs" :key="items.dataCode" :label="items.dataName"
                                       :value="items.dataCode">
                            </el-option>
                        </el-select>
                    </el-form-item>

                    <div class="tabbox" v-show="tableType" style="padding: 0 20px;">
                        <el-table
                            class="com-table"
                            ref="multipleTable"
                            :data="infolist.tableData"
                            tooltip-effect="dark"
                            size="mini"
                            border
                            style="width: 100%">
                            <el-table-column prop="parentItem" label="考核大类" width="120px">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.parentItem"></el-input>
                                    </span>
                                <span v-else>{{scope.row.parentItem}}</span>
                                </template>
                            </el-table-column>

                            <el-table-column prop="parentScore" label="大类总分" width="100px">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.parentScore"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.parentScore}}</span>
                                </template>
                            </el-table-column>

                            <el-table-column prop="assessItem" label="考核项目" >
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.assessItem"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.assessItem}}</span>
                                </template>
                            </el-table-column>

                            <el-table-column prop="assessContent" width="300px" label="考核内容" >
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.assessContent"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.assessContent}}</span>
                                </template>
                            </el-table-column>
                            <el-table-column prop="assessCriteria" width="200px" label="考核标准" >
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.assessCriteria"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.assessCriteria}}</span>
                                </template>
                            </el-table-column>
                            <el-table-column prop="assessBasis" label="考核依据">

                            </el-table-column>

                            <el-table-column prop="assessScore" label="单项得分" width="80px">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.assessScore"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.assessScore}}</span>
                                </template>
                            </el-table-column>

                            <el-table-column label="操作">
                                <template slot-scope="scope">
                                    <el-button
                                        icon="el-icon-edit" size="mini"
                                        @click="edit(scope.row,scope.$index)">{{scope.row.show?'保存':"修改"}}
                                    </el-button>
                                    <el-button type="danger" size="mini" @click="delect(scope.$index,scope.row)">删除</el-button>
                                </template>
                            </el-table-column>

                            <el-table-column prop="tableRow" label="序号" width="50px" v-if="false">
                            </el-table-column>
                        </el-table>
                        <div style="text-align:center;margin-top: 30px" >
                            <el-button type="success"  @click="addDetail">新增考核项</el-button>
                        </div>

                    </div>


                    <div class="tabbox" v-show="!tableType" style="padding: 0 20px;">
                        <el-table
                            class="com-table"
                            ref="multipleTable"
                            :data="vtableData"
                            tooltip-effect="dark"
                            size="mini"
                            border
                            style="width: 100%">
                            <el-table-column prop="vendorName" label="应用提供商名称" width="120px">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.show">
                                        <el-input size="mini" v-model="scope.row.vendorName"></el-input>
                                    </span>
                                    <span v-else>{{scope.row.vendorName}}</span>
                                </template>
                            </el-table-column>

                            <el-table-column  label="分项考核得分" >
                                <el-table-column  label="发展指标（20分）" ></el-table-column>
                                <el-table-column  label="产品质量（15分）" ></el-table-column>
                                <el-table-column  label="内容质量（15分）" ></el-table-column>
                                <el-table-column  label="运营支撑（30分）" ></el-table-column>
                                <el-table-column  label="投诉处理（20分）" ></el-table-column>
                            </el-table-column>
                            <el-table-column  label="否决加分项" >

                            </el-table-column>
                            <el-table-column  label="加分项" >

                            </el-table-column>
                            <el-table-column  label="月度得分" >

                            </el-table-column>

                            <el-table-column label="操作">
                                <template slot-scope="scope">
                                    <el-button
                                        icon="el-icon-edit" size="mini"
                                        @click="editv(scope.row,scope.$index)">{{scope.row.show?'保存':"修改"}}
                                    </el-button>
                                    <el-button type="danger" size="mini" @click="delectv(scope.$index,scope.row)">删除</el-button>
                                </template>
                            </el-table-column>

                            <el-table-column prop="vendorId" label="序号" width="50px" v-if="false">
                            </el-table-column>
                        </el-table>
                        <div style="text-align:center;margin-top: 30px" >
                            <el-button type="success"  @click="addDetailv">新增供应商</el-button>
                        </div>

                    </div>


                </div>
                <div class="t-footer">
                    <el-button type="primary" @click="dialogCli(2)">发起考核</el-button>
                    <el-button @click="dialogCli(1)">取 消</el-button>
                </div>
            </el-form>
        </div>
    </div>
</template>
<script>

    export default {
        components: {
            // mySearch,
        },
        data() {
            const terminalTypeName = (rule, value, callback) => {
                if (!this.infolist.tit) {
                    callback(new Error('不能为空'))
                } else {
                    callback()
                }
            }
            return {
                rules: {
                    terminalTypeName: [{
                        required: true,
                        trigger: 'blur',
                        validator: terminalTypeName
                    }],
                },
                tableType:true,
                fullscreen: false,
                total: 0,
                pageSize: 1,
                disableStatus: false,
                titname: '终端',
                infolist: {
                    tit: '',
                    terminal: '',
                    dept: '',
                    opName: '',
                    time: '',
                    phone: '',
                    overtime: '',
                    fire: '',
                    type: '',
                    info: '',
                    tableData: []
                },
                vtableData:[],
                terminal:{procId:'732791057158901760',procName:"互联网合作电视考核流程",procVersion:'5'},//流程信息
                shRoleId:"736837834367438848",//打分人角色id
                userInfo: {},
                params: {},
                infoApply: [],
                options: [],
                attList: [],
                assObjs: [],
                shUsers:[],
                fileInfo: {
                    type:'img',
                    limit: 50,
                    url: '/bpm/api/upload',
                    fileList: []
                },
                objId: "",
                tableData: [],
                tableLine: {
                    assObjId: '',
                    assObjName: '',
                    tableRow: '',
                    parentItem: '',
                    parentScore: '',
                    assessItem: '',
                    assessContent: '',
                    assessCriteria: '',
                    assessBasis: '',
                    assessScore: ''
                }
            }
        },
        methods: {
            //添加
            dialogCli(v) {
                if (v === 1) {
                    this.fileInfo.fileList = [];
                    this.infolist = {
                        mbhxqlx: [],
                        mbhtfwz: [],
                        mbhtfdx: [],
                        mbhsclx: [],
                        mbhbcyq: [],
                    };
                    return
                }else if(v===2){
                    if(this.infolist.tit==null||this.infolist.tit==''){
                        this.$message({ showClose: true, message:"请输入标题",type: 'error'});
                        return;
                    }
                    if(this.objId==null||this.objId==''){
                        this.$message({ showClose: true, message:"请选择考核模板",type: 'error'});
                        return;
                    }

                    this.$confirm("确认发起考核?", "提示", {
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                        type: "warning",
                    }).then(() => {
                        this.doStartProc();
                    });
                }

            },
            doStartProc(){
                let _this = this;

                //用于关联工单  和  mk_kh_info。
                let relKey=new Date().getTime();
                console.info("relkey:"+relKey);

                //记录考核工单信息
                let mkkhs=[];
                //this.shUsers
                for(let i=0;i<this.shUsers.length;i++){
                    let mkkh={};
                    mkkh.modelKey=this.objId;
                    if(this.objId=="100006"){
                        mkkh.modelType="comm";
                    }else{
                        mkkh.modelType="vip";
                    }
                    mkkh.sts=0;
                    mkkh.auditLogin=this.shUsers[i].loginNo;
                    mkkh.auditName=this.shUsers[i].loginName;
                    mkkh.createTime=_this.$formatDate(new Date(), "YYYY-MM-DD HH:mm:ss");
                    mkkh.opTime=_this.$formatDate(new Date(), "YYYY-MM-DD HH:mm:ss");
                    mkkh.relkey=relKey;
                    mkkhs.push(mkkh);
                }

                this.$http({
                    url: "/market/cmkTvAssessModule/addinfo",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: mkkhs,
                }).then((res) => {
                    console.info(res);
                    if(res.data.result!='0'){
                        _this.$message({
                            message: res.data.desc,
                            type: 'error'
                        });
                        return;
                    }
                    let info = {};
                    info.opTime = _this.$formatDate(new Date(), "YYYY-MM-DD HH:mm:ss");
                    info.opNo = this.userInfo.loginNo;
                    info.opName = this.userInfo.loginName;
                    info.woTitle = this.infolist.tit;

                    info.params = {};
                    info.params.audit = 'Y';
                    info.params.audit1 = 'Y';
                    info.params.relkey=relKey;
                    //审核意见
                    info.params.shcontent=' '
                    info.params.shcontent1=' '
                    //结果意见
                    info.params.finishcontent=' '
                    //附件列表
                    info.params.files=' '

                    info.procId = this.terminal.procId;
                    info.procName = this.terminal.procName;
                    info.procVersion = this.terminal.procVersion;

                    this.submitInfo("/bpm/api/startProc", info);
                });
            },
            submitInfo(u, v) {
                let _this = this;
                this.$http({
                    url: u,
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: v,
                }).then((res) => {
                    if (res.data.result === 1) {
                        _this.$message({
                            message: res.data.desc,
                            type: 'error'
                        });
                    } else {
                        _this.$message({
                            message: '发起成功',
                            type: 'success'
                        });
                        _this.infoApply = [];
                        _this.getUser();
                        _this.dialogCli(1);
                    }

                });
            },
            getlist() {
                this.$http({
                    url: "/sysmgr/cfgDataDicts/queryMap",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        dictCodePks: 'hlwdshzkhcj'//互联网电视合作考核厂家
                    },
                }).then((res) => {
                    this.assObjs = res.data.body.hlwdshzkhcj
                });
            },
            getKhRoleUsers() {
                this.$http({
                    url: "/sysmgr/sys/settings/sysLoginFunc/queryList",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        roleCode: this.shRoleId
                    },
                }).then((res) => {
                    this.shUsers = res.data;
                });
            },
            getMkTvHkModelCommList(){
                this.vtableData = [];
                this.loading = true;
                this.$http({
                    url: "/market/assessModel/queryList",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        assObjId: this.objId
                    },
                }).then((res) => {
                    console.info(res);
                    this.vtableData = res.data
                    this.loading = false;
                    this.iseditor = false
                });
            },
            getMkTvAssessModuleList() {
                this.tableData = [];
                this.loading = true;
                this.$http({
                    url: "/market/cmkTvAssessModule/queryMkTvAssessModuleList",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: {
                        assObjId: this.objId
                    },
                }).then((res) => {
                    this.infolist.tableData = res.data
                    this.loading = false;
                    this.iseditor = false
                });
            },
            getUser() {
                this.userInfo = JSON.parse(window.sessionStorage.userInfo);
            },
            uploadBack(v) {
                this.attList = v;
            },
            //选择考核对象
            assObjSel(val) {
                this.objId = val
                //综合考评模板
                if(val=="100006"){
                    this.tableType=false;
                    this.getMkTvHkModelCommList();
                }else{
                    //正常模板
                    this.tableType=true;
                    this.getMkTvAssessModuleList();
                }

            },
            editv(row, index) {
                row.show = row.show ? false : true
                this.$set(this.vtableData, index, row)
                // 修改后保存
                if (!row.show) {
                    this.loading = true;
                    let urlv="/market/assessModel/update";
                    if(row.vendorId!=''&&row.vendorId&&row.vendorId!=null) {
                        urlv = "/market/assessModel/update";
                    }else{
                        urlv = "/market/assessModel/add";
                    }

                    this.$http({
                        url: urlv,
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        data: {
                            vendorName:row.vendorName,
                            vendorId:row.vendorId
                        },
                    }).then((res) => {
                        console.info(res);
                        if(res.data.result==0){
                            this.getMkTvHkModelCommList();
                        }
                        this.loading = false;
                        this.iseditor = false
                    });
                }
            },
            // 编辑表格中按钮所在行
            edit(row, index) {
                row.show = row.show ? false : true
                this.$set(this.infolist.tableData, index, row)
                // 修改后保存
                if (!row.show) {
                    this.loading = true;
                    this.$http({
                        url: "/market/cmkTvAssessModule/editTvAssModule",
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        data: {
                            //params: this.tableLine
                            assObjId: this.objId,
                            assObjName: row.assObjName,
                            tableRow: row.tableRow,
                            assessItem: row.assessItem,
                            parentItem: row.parentItem,
                            parentScore: row.parentScore,
                            assessContent: row.assessContent,
                            assessCriteria: row.assessCriteria,
                            assessBasis: row.assessBasis,
                            assessScore: row.assessScore
                        },
                    }).then((res) => {
                        this.infolist.tableData = res.data
                        this.loading = false;
                        this.iseditor = false
                    });
                }

            },
            // 删除表格中按钮所在行
            delectv(index,row) {
                this.$confirm("即将删除此条数据, 是否删除?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                    .then(() => {
                        //如果后台有记录。则调用接口删除。
                        if(row.vendorId){
                            console.info("delete---->"+row);
                            this.$http({
                                url: "/market/assessModel/del",
                                method: "post",
                                headers: {
                                    "Content-Type": "application/json",
                                },
                                data: row,
                            }).then((res) => {
                                if (res.data.result == 0) {
                                    this.vtableData.splice(index, 1)
                                }
                            });
                        }else{
                            this.vtableData.splice(index, 1);
                        }
                        this.getMkTvHkModelCommList();
                    })
                    .catch(() => {});
            },
            delect(index,row) {
                this.$confirm("即将删除此条数据, 是否删除?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                })
                    .then(() => {
                        //如果后台有记录。则调用接口删除。
                        if(row.tableRow){
                            console.info("delete---->"+row);
                            this.$http({
                                url: "/market/cmkTvAssessModule/del",
                                method: "post",
                                headers: {
                                    "Content-Type": "application/json",
                                },
                                data: row,
                            }).then((res) => {
                                if (res.data.result == 0) {
                                    this.infolist.tableData.splice(index, 1)
                                }
                            });
                        }else{
                            this.infolist.tableData.splice(index, 1);
                        }
                    })
                    .catch(() => {});
            },
            // 表格中新增一行
            addDetailv(){
                this.vtableData.push({
                    vendorName:'',
                    vendorId:''
                });
                this.$set(this.vtableData)
            },
            addDetail(){
                this.infolist.tableData.push({
                    assObjId: this.objId,
                    parentItem:'',
                    parentScore:'',
                    assessItem: '',
                    assessContent: '',
                    assessCriteria: '',
                    assessBasis: '',
                    assessScore: ''
                });
                this.$set(this.infolist.tableData)
            },
            // 表格数据变化送入后台
            editTableRowData(row,index){
                alert('row='+row);
                alert('index=' + index);
            }
        },
        mounted() {
            this.getKhRoleUsers();
            this.getUser();
            this.getlist();
        },
        created() {
            this.infolist.tableData.map(i => {
                i.show = false
                return i
            })
        }
    }
</script>
<style scoped lang="scss">
    .t-footer {
        text-align: right;
        padding-right: 20px;
        margin-top: 20px;
    }

    .onetab {
        padding: 20px;
        height: calc(100% - 180px);
    }

    .titbox {
        div {
            float: right;

            i {
                font-size: 22px;
                margin-left: 20px;
                cursor: pointer;
            }
        }
    }

    .tabbox {
        margin-top: 15px;
    }

    .pageBox {
        text-align: right;
        margin-top: 10px;
    }

    .info-line {
        width: 100%;
        display: block;
        padding-left: 20px;

        div {
            width: 50%;
            display: inline-block;
        }

        span {
            width: 200px;
            display: inline-block;
            text-align: left;

            i {
                color: red;
                display: inline-block;
                padding-right: 5px;
            }
        }

        .el-select,
        .el-input {
            width: calc(100% - 220px);
        }
        .el-radio-group{
            border: 1px solid #ddd;
            padding-top: 12px;
            padding-left: 20px;
            height: 40px;
            width: calc(100% - 220px);
            border-radius: 5px;
        }
        .el-checkbox-group{
            border: 1px solid #ddd;
            padding-left: 20px;
            height: 40px;
            width: calc(100% - 220px);
            border-radius: 5px;
        }
    }

    .online {
        width: 100%;

        .el-select {
            width: calc(100% - 100px);
        }

        span {
            vertical-align: top;
        }

        .el-textarea {
            width: calc(100% - 100px);
        }
    }
    .el-table .cell {
        white-space: pre-line;
    }
</style>
