<template>
    <div class="flex-box">
        <div :span="24" class="flex-header">
            <Tabs :tabList="tabListMain" @status="clickTabMains">
            </Tabs>
            <el-button v-if="clickTagName == 'first'" type="primary" @click="clickNewTag()">+新建</el-button>
        </div>
        <div class="flex-count">
            <Table v-loading="loading" @clickDemand="clickDemand" :list="lableTable" ref="TableList" @changeNum="changeNum"
                @changeSize="changeSize">
            </Table>
        </div>
        <el-dialog :title="dialogTitle" :visible.sync="dialogStatus" width="100%" :before-close="handleClose" :modal="false"
            v-if="dialogStatus" :destroy-on-close="true">
            <!-- 后期维护 -->
            <div style="position: fixed; z-index: 10000;top: 55px;">
                <el-button type="primary" v-if="startStatus" @click="clickHandles">处理</el-button>
                <el-button type="primary" v-if="closeStatus" @click="handleClose">关闭</el-button>
                <el-button type="primary" v-if="saveStatus" @click="clickSave">保存</el-button>
            </div>
            <el-form ref="form" :model="fromList" :rules="rule" label-width="130px" style="margin-top: 30px">
                <div style="text-align: center;    font-size: 24px;">账号申请流程</div>
                <div class="flex-header">
                    <el-form-item label="工单流水号:">
                        <el-input v-model="fromList.needNo" disabled></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="任务主题:" prop="needName">
                        <el-input v-model="fromList.needName" :disabled="disabled"></el-input>
                    </el-form-item>
                    <el-form-item label="申请人:">
                        <el-input v-model="fromList.proposer" disabled></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="申请时间:">
                        <el-input v-model="fromList.proposerTime" disabled></el-input>
                    </el-form-item>
                    <el-form-item label="申请类型:" prop="proposerType">
                        <el-select v-model="fromList.proposerType" placeholder="请选择申请类型" size="medium" :disabled="disabled">
                            <el-option v-for="item in proposerTypeoption" :key="item.code" :label="item.name"
                                :value="item.code" />
                        </el-select>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="申请用户类型:" prop="proposerUserType">
                        <el-select v-model="fromList.proposerUserType" placeholder="请选择申请用户类型" size="medium"
                            :disabled="disabled">
                            <el-option v-for="item in proposerUserTypeoptions" :key="item.code" :label="item.name"
                                :value="item.code" />
                        </el-select>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="是否涉敏:" prop="isSensitive">
                        <el-radio v-model="fromList.isSensitive" label="1" :disabled="disabled">是</el-radio>
                        <el-radio v-model="fromList.isSensitive" label="2" :disabled="disabled">否</el-radio>
                    </el-form-item>
                    <el-form-item label="下载涉敏附件:" v-if="fromList.isSensitive == 1">
                        <a href="./static/file/g.xlsx" target="_blank" download="涉敏附件.xlsx">
                            <span style="color: blue;cursor: pointer;">
                                涉敏附件</span>
                        </a>
                    </el-form-item>
                </div>
                <div class="" style="margin: 1%;border-bottom: 1px solid #e1e1e1;">
                    <el-form-item label="申请用途:" prop="applicationUse">
                        <el-input type="textarea" v-model="fromList.applicationUse" maxlength="500" show-word-limit
                            :disabled="disabled"></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.proposerType == '数据库'">
                    <el-form-item label="用户名:" prop="userName">
                        <el-input v-model="fromList.userName" :disabled="disabled"></el-input>
                    </el-form-item>
                    <el-form-item label="数据库名:" prop="databaseName">
                        <el-input v-model="fromList.databaseName" :disabled="disabled"></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="是否添加4A授权:" prop="isAdd4aRights">
                        <el-radio v-model="fromList.isAdd4aRights" label="1" :disabled="disabled">是</el-radio>
                        <el-radio v-model="fromList.isAdd4aRights" label="2" :disabled="disabled">否</el-radio>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.proposerType == 'CRM前台'">
                    <el-form-item label="CRM:">
                        <el-button type="primary" style="float:left"
                            v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                            @click="clickNewCRM()">+新建</el-button>
                        <el-table height="400px" class="com-table" ref="CRMTable" :data="bomcProcessCrms"
                            @row-click="getRowDataCRM" tooltip-effect="dark" size="small" border style="width: 100%"
                            v-loading="loadingCRM">
                            <el-table-column prop="categoryOfApplication" label="申请类别" align="center">
                            </el-table-column>
                            <el-table-column prop="jobNumberType" label="工号类型" align="center">
                            </el-table-column>
                            <el-table-column prop="accountType" label="账户类型" align="center">
                            </el-table-column>
                            <el-table-column prop="county" label="区县" align="center">
                            </el-table-column>
                            <el-table-column prop="businessHallCode" label="营业厅编码(BOSS编码后三位)" align="center">
                            </el-table-column>
                            <el-table-column prop="fullNameBusinessHall" label="营业厅全拼" align="center">
                            </el-table-column>
                            <el-table-column prop="name" label="姓名" align="center">
                            </el-table-column>
                            <el-table-column prop="roleName" label="工号角色名称" align="center">
                            </el-table-column>
                            <el-table-column prop="authorityCredentials" label="权限值" align="center">
                            </el-table-column>
                            <el-table-column prop="reportAuthority" label="报表权限" align="center">
                            </el-table-column>
                            <el-table-column prop="allowedLoginTime" label="有效登录时间" align="center">
                            </el-table-column>
                            <el-table-column prop="idCardNo" label="身份证号" align="center">
                            </el-table-column>
                            <el-table-column prop="phone" label="联系电话" align="center">
                            </el-table-column>
                        </el-table>
                        <el-pagination class="pageBox" @current-change="currchangeCRM" layout="prev, pager, next, jumper"
                            background :total="totalCRM">
                        </el-pagination>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.proposerType == '主机'">
                    <el-form-item label="主机:">
                        <el-button type="primary" style="float:left"
                            v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                            @click="clickNewHost()">+新建</el-button>
                        <el-button type="danger" style="float:left"
                            v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'" @click="delHost()">删除</el-button>
                        <el-table height="400px" class="com-table" ref="multipleTable" :data="bomcProcessHosts"
                            @row-click="getRowDataHost" tooltip-effect="dark" size="small" border style="width: 100%"
                            v-loading="loadingHost" @selection-change="handleSelectionChangeHost">
                            <el-table-column type="selection" width="55">
                            </el-table-column>
                            <el-table-column prop="index" label="序号" width="50" align="center"></el-table-column>
                            <el-table-column prop="applicationObject" label="申请对象" align="center">
                            </el-table-column>
                            <el-table-column prop="applicationDescription" label="申请描述" align="center">
                            </el-table-column>
                            <el-table-column prop="remark" label="备注" align="center">
                            </el-table-column>
                        </el-table>
                        <el-pagination class="pageBox" @current-change="currchangeHost" layout="prev, pager, next, jumper"
                            background :total="totalHost">
                        </el-pagination>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.proposerType == '主机'">
                    <el-form-item label="申请账号信息:">
                        <el-button type="primary" style="float:left"
                            v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                            @click="clickNewAccount()">+新建</el-button>
                        <el-button type="danger" style="float:left"
                            v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                            @click="delAccount()">删除</el-button>
                        <el-table height="400px" class="com-table" ref="multipleTable" :data="bomcProcessAccounts"
                            @row-click="getRowDataAccount" tooltip-effect="dark" size="small" border style="width: 100%"
                            v-loading="loadingAccount" @selection-change="handleSelectionChangeAccount">
                            <el-table-column type="selection" width="55">
                            </el-table-column>
                            <el-table-column prop="hostIpAddress" label="主机IP" align="center">
                            </el-table-column>
                            <el-table-column prop="userName" label="用户名" align="center">
                            </el-table-column>
                        </el-table>
                        <el-pagination class="pageBox" @current-change="currchangeAccount"
                            layout="prev, pager, next, jumper" background :total="totalAccount">
                        </el-pagination>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.isAdd4aRights == 1">
                    <el-form-item label="4A账号:" prop="account4a">
                        <el-input v-model="fromList.account4a" :disabled="disabled"></el-input>
                    </el-form-item>
                    <el-form-item label="IP地址:" prop="ipHost">
                        <el-input v-model="fromList.ipHost" :disabled="disabled"></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.isAdd4aRights == 1">
                    <el-form-item label="端口:" prop="port">
                        <el-input v-model="fromList.port" :disabled="disabled"></el-input>
                    </el-form-item>
                    <el-form-item label="设备账号:" prop="deviceAccount">
                        <el-input v-model="fromList.deviceAccount" :disabled="disabled"></el-input>
                    </el-form-item>
                </div>
                <div class="flex-header" v-if="fromList.isAdd4aRights == 1">
                    <el-form-item label="有限期:" prop="limitedPeriod">
                        <el-date-picker :append-to-body="false" :disabled="disabled" v-model="fromList.limitedPeriod"
                            size="medium" :unlink-panels="true" type="datetime" placeholder="选择有限期"
                            :picker-options="pickWrite" style="width: 100%" value-format="yyyy-MM-dd HH:mm:ss">
                        </el-date-picker>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="数据库申请模板:">
                        <a href="./static/file/h.xlsx" target="_blank" download="数据库申请模板.xlsx">
                            <span style="color: blue;cursor: pointer;">
                                数据库申请模板 <span style="color: red;cursor: pointer;">( 根据申请类型下载模板，填写完之后并上传)</span></span>
                        </a>
                    </el-form-item>
                </div>
                <div class="flex-header">
                    <el-form-item label="主机申请模板:">
                        <a href="./static/file/f.xlsx" target="_blank" download="主机申请模板.xlsx">
                            <span style="color: blue;cursor: pointer;">
                                主机申请模板 <span style="color: red;cursor: pointer;">( 根据申请类型下载模板，填写完之后并上传)</span></span>
                        </a>
                    </el-form-item>
                </div>
                <div class="flex-load" style="display: flex; flex-direction: column">
                    <el-form-item label="上传附件:" :disabled="disabled" prop="templateAccessoryList">
                        <my-upload v-if="!disabled" @uploadBack="uploadBack" @delloadBack="delloadBack"
                            @clickDownload="download" :fileInfo="fileInfo" :fileList="fromList.templateAccessoryList"
                            style="width: 30% !important"></my-upload>
                        <div v-if="fromList.taskName != '填写账号申请单'">
                            <div v-for="(item, index) in fromList.templateAccessoryList" :key="index">
                                <span style="color: blue;cursor: pointer;" @click="downloadOne(item)">{{
                                    item.fileName
                                }}</span>
                            </div>
                        </div>
                    </el-form-item>
                </div>

            </el-form>
            <div v-if="dialoglablesStatus">
                <div class="table-title">流程追踪</div>
                <TableId :list="lables"></TableId>
            </div>
        </el-dialog>
        <div v-if="destroy">
            <el-dialog title="处理操作" width="100%" :visible.sync="handleStatus" :before-close="handleCloses" :modal="false"
                v-if="handleStatus" :destroy-on-close="true">
                <Workflow :list="fromList" v-if="isWorkflowStatus == true" @updateForm="updateForm"
                    :requestForm="requestForm" />
                <WorkflowEntrance :list="fromList" v-else :lastManList="lastManList" @beforeClose="updateForm"
                    :requestForm="requestForm" />
                <!-- 后期维护 -->
            </el-dialog>
        </div>
        <el-dialog :title="CRMTitle" width="60%" :visible.sync="handleCRMStatus" :before-close="handleCRMCloses"
            :modal="false" :destroy-on-close="true" style="margin-top: 5%;">
            <div class="flex-box">
                <el-form :model="bomcProcessCrmsForm" ref="addInfoList" label-width="210px">
                    <div class="flex-header">
                        <el-form-item label="申请类别:" prop="categoryOfApplication">
                            <el-input v-model="bomcProcessCrmsForm.categoryOfApplication" :disabled="disabled"></el-input>
                        </el-form-item>
                        <el-form-item label="工号类型:" prop="jobNumberType">
                            <el-select v-model="bomcProcessCrmsForm.jobNumberType" placeholder="请选择工号类型" size="medium"
                                :disabled="disabled">
                                <el-option v-for="item in jobNumberTypeoption" :key="item.code" :label="item.name"
                                    :value="item.code" />
                            </el-select>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="账户类型:" prop="accountType">
                            <el-select v-model="bomcProcessCrmsForm.accountType" placeholder="请选择账户类型" size="medium"
                                :disabled="disabled">
                                <el-option v-for="item in accountTypeoption" :key="item.code" :label="item.name"
                                    :value="item.code" />
                            </el-select>
                        </el-form-item>
                        <el-form-item label="区县:" prop="county">
                            <el-input v-model="bomcProcessCrmsForm.county" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="营业厅编码(BOSS编码后三位):" prop="businessHallCode">
                            <el-input v-model="bomcProcessCrmsForm.businessHallCode" :disabled="disabled"></el-input>
                        </el-form-item>
                        <el-form-item label="营业厅全拼:" prop="fullNameBusinessHall">
                            <el-input v-model="bomcProcessCrmsForm.fullNameBusinessHall" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="姓名:" prop="name">
                            <el-input v-model="bomcProcessCrmsForm.name" :disabled="disabled"></el-input>
                        </el-form-item>
                        <el-form-item label="工号角色名称:" prop="roleName">
                            <el-input v-model="bomcProcessCrmsForm.roleName" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="权限值:" prop="authorityCredentials">
                            <el-select v-model="bomcProcessCrmsForm.authorityCredentials" placeholder="请选择权限值" size="medium"
                                :disabled="disabled">
                                <el-option v-for="item in authorityCredentialsoption" :key="item.code" :label="item.name"
                                    :value="item.code" />
                            </el-select>
                        </el-form-item>
                        <el-form-item label="报表权限:" prop="reportAuthority">
                            <el-select v-model="bomcProcessCrmsForm.reportAuthority" placeholder="请选择报表权限" size="medium"
                                :disabled="disabled">
                                <el-option v-for="item in reportAuthorityoption" :key="item.code" :label="item.name"
                                    :value="item.code" />
                            </el-select>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="有效登录时间:" prop="allowedLoginTime">
                            <el-input v-model="bomcProcessCrmsForm.allowedLoginTime" :disabled="disabled"></el-input>
                        </el-form-item>
                        <el-form-item label="身份证号:" prop="idCardNo">
                            <el-input v-model="bomcProcessCrmsForm.idCardNo" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="联系电话:" prop="phone" style="width:100% ;">
                            <el-input v-model="bomcProcessCrmsForm.phone" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div slot="footer" class="dialog-footer myfooter">
                <el-button v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                    @click="processNewIssued(CRMTitle)" type="primary">确定</el-button>
                <el-button @click="() => {
                    handleCRMStatus = false
                }" type="primary">关闭</el-button>
            </div>
        </el-dialog>
        <el-dialog :title="AccountTitle" width="60%" :visible.sync="handleAccountStatus" :before-close="handleAccountCloses"
            :modal="false" :destroy-on-close="true" style="margin-top: 5%;">
            <div class="flex-box">
                <el-form :model="bomcProcessAccountsForm" ref="addInfoList" label-width="210px">
                    <div class="flex-header">
                        <el-form-item label="主机IP:" prop="hostIpAddress">
                            <el-input v-model="bomcProcessAccountsForm.hostIpAddress" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="用户名:" prop="userName">
                            <el-input v-model="bomcProcessAccountsForm.userName" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div slot="footer" class="dialog-footer myfooter">
                <el-button v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                    @click="processNewIssued(AccountTitle)" type="primary">确定</el-button>
                <el-button @click="() => {
                    handleAccountStatus = false
                }" type="primary">关闭</el-button>
            </div>
        </el-dialog>
        <el-dialog :title="HostTitle" width="60%" :visible.sync="handleHostStatus" :before-close="handleHostCloses"
            :modal="false" :destroy-on-close="true" style="margin-top: 5%;">
            <div class="flex-box">
                <el-form :model="bomcProcessHostsForm" ref="addInfoList" label-width="210px">
                    <div class="flex-header">
                        <el-form-item label="申请对象:" prop="applicationObject">
                            <el-input v-model="bomcProcessHostsForm.applicationObject" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="申请描述:" prop="applicationDescription">
                            <el-input v-model="bomcProcessHostsForm.applicationDescription" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                    <div class="flex-header">
                        <el-form-item label="备注:" prop="remark">
                            <el-input v-model="bomcProcessHostsForm.remark" :disabled="disabled"></el-input>
                        </el-form-item>
                    </div>
                </el-form>
            </div>
            <div slot="footer" class="dialog-footer myfooter">
                <el-button v-if="fromList.taskName == '填写账号申请单' || dialogTitle == '新建工单'"
                    @click="processNewIssued(HostTitle)" type="primary">确定</el-button>
                <el-button @click="() => {
                    handleHostStatus = false
                }" type="primary">关闭</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import Tabs from "../../../components/el-tabs";
import Table from "../../../components/el-form";
import TableId from "../../../components/el-formid";
import Seach from "../../../components/el-search";
import myUpload from "../../../components/workflowUpload";
import Workflow from "../../../components/workflowBase";
import WorkflowEntrance from "../../../components/workflowEntrance";
import getConfig from '../../../config/dev.js'
import {
    getTodoBase,
    getDoneBase,
    getInitiateBase,
    getNowdata,
} from "../../../http/api.js";//../../../http/api.js
import { log } from "console";
export default {
    components: {
        Table,
        TableId,
        Tabs,
        myUpload,
        Workflow,
        Seach,
        WorkflowEntrance
    },
    data() {
        let _self = this
        return {
            loading: false,
            loadingCRM: false,
            loadingHost: false,
            loadingAccount: false,
            totalCRM: 0,
            pageSizeCRM: 1,
            totalAccount: 0,
            pageSizAccount: 0,
            totalHost: 0,
            pageSizeHost: 1,
            pageSizeAccount: 1,
            CRMTitle: '',
            HostTitle: '',
            AccountTitle: '',
            paramsCRM: {},
            paramsHost: {},
            paramsAccount: {},
            isWorkflowStatus: true, //默认展示模式组件，为true时展示多人处理组件
            lastManList: [],
            bomcProcessCrms: [],//CRM Table
            bomcProcessHosts: [],//主机 Table
            bomcProcessAccounts: [],//申请账号信息 Table
            bomcProcessCrmsForm: {}, //CRM表单数据
            bomcProcessAccountsForm: {},
            bomcProcessHostsForm: {},
            HostdelId: [],
            AccountdelId: [],
            rule: {
                applicationUse: [
                    { required: true, message: "请添加申请用途", trigger: "blur" },
                ],
                proposerUserType: [
                    { required: true, message: "请选择请选择申请用户类型", trigger: "change" },
                ],
                proposerType: [
                    { required: true, message: "请选择申请类型", trigger: "change" },
                ],
                needName: [
                    { required: true, message: "请添加申请主题", trigger: "blur" },
                ],
                isSensitive: [
                    { required: true, message: "请选择是否涉敏", trigger: "change" },
                ],
                isAdd4aRights: [
                    { required: true, message: "请选择是否添加4A授权", trigger: "change" },
                ],
                userName: [
                    { required: true, message: "请添加用户名", trigger: "blur" },
                ],
                databaseName: [
                    { required: true, message: "请添加数据库名", trigger: "blur" },
                ],
                account4a: [
                    { required: true, message: "请添加4A账号", trigger: "blur" },
                ],
                ipHost: [
                    { required: true, message: "请添加IP地址", trigger: "blur" },
                ],
                port: [
                    { required: true, message: "请添加端口", trigger: "blur" },
                ],
                deviceAccount: [
                    { required: true, message: "请添加设备账号", trigger: "blur" },
                ],
                limitedPeriod: [
                    { required: true, message: "请选中有限期", trigger: "blur" },
                ],
            },
            form: {}, //表单数据
            fromList: {}, //表单数据
            fileInfo: {
                type: "bt1n",
                typename: "上传文件",
                // limit: 5,
                url: "/market/waf/uploadByMinio",
                fileList: [],
            },
            list: {},
            proposerUserTypeoptions: [
                {
                    name: '数据库账号',
                    code: '数据库账号'
                },
                {
                    name: '第三方用户',
                    code: '第三方用户'
                },
                {
                    name: '第三方用户(非业支，最低权限)',
                    code: '第三方用户(非业支，最低权限)'
                },
                {
                    name: '超级用户(仅DBA使用)',
                    code: '超级用户(仅DBA使用)'
                },
                {
                    name: '程序用户(connent，resource)',
                    code: '程序用户(connent，resource)'
                },
                {
                    name: '个人用户(普通查询权限)',
                    code: '个人用户(普通查询权限)'
                }
            ],
            proposerTypeoption: [
                {
                    name: 'CRM前台',
                    code: 'CRM前台'
                },
                {
                    name: '主机',
                    code: '主机'
                },
                {
                    name: '数据库',
                    code: '数据库'
                },
            ],
            reportAuthorityoption: [
                {
                    name: '地市报表权限',
                    code: '地市报表权限'
                },
                {
                    name: '区县报表权限',
                    code: '区县报表权限'
                },
                {
                    name: '网点报表权限',
                    code: '网点报表权限'
                },
                {
                    name: '工号报表权限',
                    code: '工号报表权限'
                },
                {
                    name: '全省报表权限',
                    code: '全省报表权限'
                },
            ],
            authorityCredentialsoption: [
                {
                    name: '0级',
                    code: '0级'
                },
                {
                    name: '2级',
                    code: '2级'
                },
                {
                    name: '3级',
                    code: '3级'
                },
                {
                    name: '5级',
                    code: '5级'
                },
                {
                    name: '7级',
                    code: '7级'
                },
                {
                    name: '8级',
                    code: '8级'
                },
            ],
            jobNumberTypeoption: [
                {
                    name: '普通工号',
                    code: '普通工号'
                },
                {
                    name: '地市管理员工号',
                    code: '地市管理员工号'
                },
                {
                    name: '高级别工号',
                    code: '高级别工号'
                },
            ],
            accountTypeoption: [
                {
                    name: '营业类账号',
                    code: '营业类账号'
                },
                {
                    name: '业务管理类账号',
                    code: '业务管理类账号'
                },
                {
                    name: '自助服务终端类账号',
                    code: '自助服务终端类账号'
                },
            ],
            disabled: false,
            pageNo: 1,//页码
            destroy: false,//处理
            handleStatus: false,//处理
            handleCRMStatus: false,//新增
            handleHostStatus: false,//新增
            handleAccountStatus: false,//新增
            tableName: "BOMC_process",

            request_form: {
                userId: "",
                userName: "",
                path: this.$router.currentRoute.name,
                userCode: JSON.parse(window.sessionStorage.userInfo).loginNo,
                // path:this.$roter.options.routers,
                // nextDealMan:'',
                title: "title",
                businessKey: "1",
                processDefinitionKey: "BOMC_process",//流程key
            },
            requestForm: {
                // fresourceId: "b3e6cc47-b1a9-11ed-886f-d6cd97160e00", // 本地环境
                // fresourceId: "canvas", // 生产环境
                // fresourceId: "9acf34bf-b24d-11ed-be6b-00505687dcd3", //测试91环境
                fresourceId: getConfig().accountApplicationfresourceId,
                processDefinitionKey: "BOMC_process",
            },
            dialogStatus: false, //dialog显示
            dialoglablesStatus: true, //dialogL流程追踪显示
            clickTagNameTop: 'First',//头部tab
            clickTagName: 'first',
            dialogTitle: '',//dialogtit
            startStatus: false,//处理状态按钮
            closeStatus: false, //关闭按钮状态
            saveStatus: false, //保存按钮状态
            lables: {
                height: "400",
                titledata: [
                    {
                        label: "环节名称",
                        prop: "taskName",
                        width: 300,
                    },
                    {
                        label: "处理人",
                        prop: "assignee",
                        width: 300,
                    },
                    {
                        label: "到达时间",
                        prop: "startTime",
                        width: 300,
                    },
                    {
                        label: "处理时间",
                        prop: "endTime",
                        width: 300,
                    },
                    {
                        label: "回复意见",
                        prop: "content",
                        width: 300,
                    },
                ], //表格头
                data: [], //内容数据
                loading: true,
                pageData: {
                    total: 0, // 总条数
                    pageSizes: 10, // 每页数量
                    pageNum: 1, // 页码
                },
                isSelection: false, // 表格有多选时设置
                isOperation: false, // 表格有操作列时设置
                isIndex: true, // 列表序号
                operation: {
                    // 表格有操作列时设置
                    label: "操作", // 列名
                    width: "50", // 根据实际情况给宽度
                    data: [
                        {
                            label: "操作", // 操作名称
                            type: "", //按钮类型
                            handleRow: function () { }, // 自定义事件
                        },
                    ],
                },
            },
            tabListMain: [
                {
                    index: "first",
                    label: "我的待办",
                    number: 1,
                    name: "prosss_key",
                },
                {
                    index: "two",
                    label: "我的已办",
                    number: 2,
                },
                {
                    index: "three",
                    label: "我发起的",
                    number: 3,
                },
            ],
            lableTable: {},//传给子组件table
            firstlabel: {
                height: "400",
                titledata: [
                    {
                        label: "任务主题",
                        prop: "need_name",
                        width: 350,

                    },
                    {
                        label: "申请人",
                        prop: "proposer",
                        width: 350,
                    },
                    {
                        label: "申请时间",
                        prop: "proposer_time",
                        width: 350,
                    },
                    {
                        label: "当前环节",
                        prop: "taskName",
                        width: 350,
                    },
                ], //表格头
                data: [], //内容数据
                loading: true,
                pageData: {
                    total: 10, // 总条数
                    pageSizes: 10, // 每页数量
                    pageNum: 1, // 页码
                },
                isSelection: false, // 表格有多选时设置
                isOperation: false, // 表格有操作列时设置
                isIndex: false, // 列表序号
                operation: {
                    // 表格有操作列时设置
                    label: "操作", // 列名
                    width: "50", // 根据实际情况给宽度
                    data: [
                        {
                            label: "操作", // 操作名称
                            type: "", //按钮类型
                            handleRow: function () { }, // 自定义事件
                        },
                    ],
                },
            },
            twolabel: {
                height: "400",
                titledata: [
                    {
                        label: "任务主题",
                        prop: "need_name",
                        width: 350,

                    },
                    {
                        label: "申请人",
                        prop: "proposer",
                        width: 350,
                    },
                    {
                        label: "申请时间",
                        prop: "proposer_time",
                        width: 350,
                    },
                    {
                        label: "当前环节",
                        prop: "taskName",
                        width: 350,
                    },
                ], //表格头
                data: [], //内容数据
                loading: true,
                pageData: {
                    total: 10, // 总条数
                    pageSizes: 10, // 每页数量
                    pageNum: 1, // 页码
                },
                isSelection: false, // 表格有多选时设置
                isOperation: false, // 表格有操作列时设置
                isIndex: false, // 列表序号
                operation: {
                    // 表格有操作列时设置
                    label: "操作", // 列名
                    width: "50", // 根据实际情况给宽度
                    data: [
                        {
                            label: "操作", // 操作名称
                            type: "", //按钮类型
                            handleRow: function () { }, // 自定义事件
                        },
                    ],
                },
            },
            threelabel: {
                height: "400",
                titledata: [
                    {
                        label: "任务主题",
                        prop: "need_name",
                        width: 350,

                    },
                    {
                        label: "申请人",
                        prop: "proposer",
                        width: 350,
                    },
                    {
                        label: "申请时间",
                        prop: "proposer_time",
                        width: 350,
                    },
                    {
                        label: "当前环节",
                        prop: "taskName",
                        width: 350,
                    },
                    {
                        label: "当前处理人",
                        prop: "currentMan",
                        width: 350,
                    },
                ], //表格头
                data: [], //内容数据
                loading: true,
                pageData: {
                    total: 10, // 总条数
                    pageSizes: 10, // 每页数量
                    pageNum: 1, // 页码
                },
                isSelection: false, // 表格有多选时设置
                isOperation: false, // 表格有操作列时设置
                isIndex: false, // 列表序号
                operation: {
                    // 表格有操作列时设置
                    label: "操作", // 列名
                    width: "50", // 根据实际情况给宽度
                    data: [
                        {
                            label: "操作", // 操作名称
                            type: "", //按钮类型
                            handleRow: function () { }, // 自定义事件
                        },
                    ],
                },
            },

            savestatusBtn: false,
            pickWrite: {
                disabledDate(time) {
                    return time.getTime() < new Date().getTime() - 8.64e6;
                },
            },

        }
    },
    methods: {

        clickNewTag(v) {
            this.$http({
                url: "/market/BomcProcess/getNeedNo",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {},
            }).then((res) => {
                console.log(res);
                this.fromList = {
                    needNo: res.data.body,
                    proposer: JSON.parse(window.sessionStorage.getItem('userInfo')).loginName,
                    proposerNo: JSON.parse(window.sessionStorage.getItem('userInfo')).loginNoStr,
                    proposerTime: getNowdata({ a: '-', b: ' ', c: ':' }),
                }
                let templateAccessoryList = [];
                templateAccessoryList = v;
                this.$set(this.fromList, "templateAccessoryList", templateAccessoryList);
            });
            this.lables.data = []
            this.bomcProcessAccounts = []
            this.bomcProcessCrms = []
            this.bomcProcessHosts = []
            this.startStatus = true;
            this.saveStatus = true;
            this.closeStatus = true;
            this.dialogStatus = true;
            this.isWorkflowStatus = true;
            this.dialoglablesStatus = true
            this.dialogTitle = "新建工单";
            this.disabled = false;
            this.fromList.proposer = JSON.parse(window.sessionStorage.getItem('userInfo')).loginName
            this.fromList.proposerTime = getNowdata({ a: '-', b: ' ', c: ':' })
        },
        clickNewCRM(v) {
            this.CRMTitle = '新增CRM'
            this.bomcProcessCrmsForm = {}
            this.handleCRMStatus = true
        },
        clickNewHost(v) {
            this.HostTitle = '新增主机'
            this.bomcProcessHostsForm = {}
            this.handleHostStatus = true
        },
        clickNewAccount(v) {
            this.AccountTitle = '新增账号'
            this.bomcProcessAccountsForm = {}
            this.handleAccountStatus = true
        },
        delAccount() {
            this.$confirm("即将删除数据, 是否删除?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.$http({
                        url: "/market/BomcProcessAccount/delBatch",
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        data: { delId: this.AccountdelId },
                    }).then((res) => {
                        this.getAccountTable({}, this.pageSizeAccount)
                        this.handleAccountStatus = false
                    })
                })
                .catch(() => { });
        },
        delHost() {
            this.$confirm("即将删除数据, 是否删除?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.$http({
                        url: "/market/BomcProcessHost/delBatch",
                        method: "post",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        data: { delId: this.HostdelId },
                    }).then((res) => {
                        this.getHostTable({}, this.pageSizeHost)
                        this.handleHostStatus = false
                    })
                })
                .catch(() => { });
        },
        handleSelectionChangeHost(val) {
            this.HostdelId = []
            val.map((item) => {
                this.HostdelId.push(item.id)
            })
            console.log(this.HostdelId);
        },
        handleSelectionChangeAccount(val) {
            this.HostdelId = []
            val.map((item) => {
                this.AccountdelId.push(item.id)
            })
        },
        // 点击行即可选中
        getRowDataCRM(row) {
            this.CRMTitle = '修改CRM'
            this.bomcProcessCrmsForm = row
            this.handleCRMStatus = true
        },
        getRowDataHost(row) {
            this.HostTitle = '修改主机'
            this.bomcProcessHostsForm = row
            this.handleHostStatus = true
        },
        getRowDataAccount(row) {
            this.AccountTitle = '修改账号'
            this.bomcProcessAccountsForm = row
            this.handleAccountStatus = true
        },

        processNewIssued(Title) {
            if (Title == '新增CRM') {///BomcProcessCrm/add
                // this.bomcProcessCrms.push(this.bomcProcessCrmsForm)
                this.bomcProcessCrmsForm.bomcId = this.fromList.needNo
                this.$http({
                    url: "/market/BomcProcessCrm/add",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessCrmsForm,
                }).then((res) => {
                    this.getCRMTable({}, this.pageSizeCRM)
                    this.handleCRMStatus = false
                    this.bomcProcessCrmsForm = {}
                })
            } else if (Title == '修改CRM') {
                this.$http({
                    url: "/market/BomcProcessCrm/update",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessCrmsForm,
                }).then((res) => {
                    this.getCRMTable({}, this.pageSizeCRM)
                    this.handleCRMStatus = false
                })
            } else if (Title == '新增主机') {
                this.bomcProcessHostsForm.bomcId = this.fromList.needNo
                this.$http({
                    url: "/market/BomcProcessHost/add",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessHostsForm,
                }).then((res) => {
                    this.getHostTable({}, this.pageSizeHost)
                    this.handleHostStatus = false
                })
            }
            else if (Title == '修改主机') {
                this.$http({
                    url: "/market/BomcProcessHost/update",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessHostsForm,
                }).then((res) => {
                    this.getHostTable({}, this.pageSizeHost)
                    this.handleHostStatus = false
                })
            } else if (Title == '新增账号') {
                this.bomcProcessAccountsForm.bomcId = this.fromList.needNo
                this.$http({
                    url: "/market/BomcProcessAccount/add",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessAccountsForm,
                }).then((res) => {
                    this.getAccountTable({}, this.pageSizeAccount)
                    this.handleAccountStatus = false
                })
            }
            else if (Title == '修改账号') {
                this.$http({
                    url: "/market/BomcProcessAccount/update",
                    method: "post",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    data: this.bomcProcessAccountsForm,
                }).then((res) => {
                    this.getAccountTable({}, this.pageSizeAccount)
                    this.handleAccountStatus = false
                })
            }
        },
        getCRMTable(e, page) {
            this.loadingCRM = true;
            this.$http({
                url: "/market/BomcProcessCrm/queryPage",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                    page: '{"pageNo":"' + page + '","pageSize":"10"}',
                },
                data: {
                    bomcId: this.fromList.needNo
                },
            }).then((res) => {
                this.bomcProcessCrms = res.data.data;
                this.totalCRM = res.data.totalRecord;
                this.loadingCRM = false;
            });
        },
        getHostTable(e, page) {
            this.loadingHost = true;
            this.$http({
                url: "/market/BomcProcessHost/queryPage",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                    page: '{"pageNo":"' + page + '","pageSize":"10"}',
                },
                data: {
                    bomcId: this.fromList.needNo//bomcId
                },
            }).then((res) => {
                this.bomcProcessHosts = res.data.data;
                this.bomcProcessHosts.map((item, index) => {
                    item.index = (index + 1) + (res.data.pageNo - 1) * res.data.pageSize
                })
                this.totalHost = res.data.totalRecord;
                this.loadingHost = false;
            });
        },
        getAccountTable(e, page) {
            this.loadingAccount = true;
            this.$http({
                url: "/market/BomcProcessAccount/queryPage",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                    page: '{"pageNo":"' + page + '","pageSize":"10"}',
                },
                data: {
                    bomcId: this.fromList.needNo//bomcId
                },
            }).then((res) => {
                this.bomcProcessAccounts = res.data.data;
                this.totalAccount = res.data.totalRecord;
                this.loadingAccount = false;
            });
        },
        downloadOne(e) {
            let list = {
                id: e.fileCode,
                fileName: e.fileName,
            };
            this.$http({
                url: "/market/waf/downFileByMinio",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                responseType: "blob",
                data: list,
            }).then((response) => {
                console.log(response);
                if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                    let blob = new Blob([response.data], {
                        type: "application/vnd.ms-excel",
                    });
                    window.navigator.msSaveOrOpenBlob(
                        blob,
                        list.fileName
                    );
                } else {
                    /* 火狐谷歌的文件下载方式 */
                    var blob = new Blob([response.data]);
                    var downloadElement = document.createElement("a");
                    var href = window.URL.createObjectURL(blob);
                    downloadElement.href = href;
                    downloadElement.download =
                        list.fileName;
                    document.body.appendChild(downloadElement);
                    downloadElement.click();
                    document.body.removeChild(downloadElement);
                    window.URL.revokeObjectURL(href);
                }
            });
        },
        download(e) {
            let list = {
                id: e.fileCode,
                fileName: e.name,
            };
            this.$http({
                url: "/market/waf/downFileByMinio",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                responseType: "blob",
                data: list,
            }).then((response) => {
                console.log(response);
                if (window.navigator && window.navigator.msSaveOrOpenBlob) {
                    let blob = new Blob([response.data], {
                        type: "application/vnd.ms-excel",
                    });
                    window.navigator.msSaveOrOpenBlob(
                        blob,
                        list.fileName
                    );
                } else {
                    /* 火狐谷歌的文件下载方式 */
                    var blob = new Blob([response.data]);
                    var downloadElement = document.createElement("a");
                    var href = window.URL.createObjectURL(blob);
                    downloadElement.href = href;
                    downloadElement.download =
                        list.fileName;
                    document.body.appendChild(downloadElement);
                    downloadElement.click();
                    document.body.removeChild(downloadElement);
                    window.URL.revokeObjectURL(href);
                }
            });
        },
        //上传文件钩子函数
        clickUpload(file) { },

        uploadBack(v) {
            if (this.fromList.templateAccessoryList) {
                this.fromList.templateAccessoryList = [];
                this.fromList.templateAccessoryList = v;
            } else {
                let templateAccessoryList = [];
                templateAccessoryList = v;
                this.$set(this.fromList, "templateAccessoryList", templateAccessoryList);
            }
        },
        delloadBack(v) {
            this.fromList.templateAccessoryList = v;
            // this.$http({
            //     url: "/market/waf/update",
            //     method: "post",
            //     headers: {
            //         "Content-Type": "application/json",
            //     },
            //     data: this.fromList,
            // }).then((res) => {
            //     console.log(res);
            //     // if (res.data.result === 0) {
            //     //   this.$message.success("工作流更新成功");
            //     // }
            // });
        },
        //是否最后一个人
        async getLastName() {
            console.log(this.fromList);
            let list = {
                procinstid: this.fromList.processId,
                taskid: this.fromList.taskId,

                // taskId:e.taskId
            };
            let _this = this;
            let obj = {
                url: this.$url.formList.getLastName, //流程追踪接口
                data: list,
                // status: "form",
                headers: {
                    "Content-Type": "application/json",
                },
            };

            let res = await this.common.httpPost(obj, success);
            function success(data) {
                _this.isWorkflowStatus = data.lastMan == false ? false : true;
                _this.lastManList = data;
                // console.log(_this.isWorkflowStatus);
            }
        },


        //获取页码
        changeNum(e) {
            console.log(e)
            this.pageNo = e;
            if (this.clickTagName == 'first') {
                this.firstlabel.pageData.pageNum = e;
                this.getQueryList();
            }
            if (this.clickTagName == 'two') {
                this.twolabel.pageData.pageNum = e;
                this.getQueryDone();
            }
            if (this.clickTagName == 'three') {
                this.threelabel.pageData.pageNum = e;
                this.getMeLaunch()
            }
        },
        //获取页码
        changeSize(e) {
            console.log(11111);
        },
        //点击工单状态跳转需求流程显示页面
        clickDemand(e, res) {
            console.log(e);
            this.isWorkflowStatus = true
            console.log(res);
            if (e === "任务主题") {
                if (this.clickTagName === "three") {//发起
                    console.log(res.taskName)
                    this.dialogTitle = "查看";
                    this.closeStatus = true;
                    if (res.taskName == "填写账号申请单") {
                        this.disabled = false;
                        this.startStatus = true;
                        this.saveStatus = true;
                        this.dialoglablesStatus = true
                    } else {
                        this.disabled = true;
                        this.startStatus = false;
                        this.saveStatus = false;
                        this.dialoglablesStatus = true
                    }
                }
                if (this.clickTagName === "first") {//代办
                    this.dialogTitle = "处理";
                    if (res.taskName == "填写账号申请单") {
                        this.savestatusBtn = false
                        this.disabled = false;
                        this.startStatus = true;
                        this.saveStatus = true;
                        this.closeStatus = true;
                        this.dialoglablesStatus = true
                    } else {
                        this.savestatusBtn = true
                        this.disabled = true;
                        this.closeStatus = true;
                        this.startStatus = true;
                        this.saveStatus = false;
                        this.dialoglablesStatus = true
                    }
                }
                if (this.clickTagName === "two") {//已办
                    this.dialogTitle = "查看";
                    this.closeStatus = true;
                    this.startStatus = false;
                    this.saveStatus = false;
                    this.disabled = true;
                    this.dialoglablesStatus = true
                }
                this.dialogStatus = true
                this.fromList = res;
                this.clickForm(res);
                this.getFromQuery(res);
            }
        },
        //查询form表单数据
        getFromQuery(e) {
            this.$http({
                url: "/market/BomcProcess/query",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: { id: e.id },
            }).then((res) => {
                this.fromList = res.data;
                this.dialogStatus = true;
                this.fromList.taskId = e.taskId
                this.fromList.taskName = e.taskName
                this.fromList.createId = e.createId
                if (this.fromList.templateAccessoryList) {
                    this.fromList.templateAccessoryList.map((item) => {
                        item.name = item.fileName;
                    })
                }
                this.fromList.resourceId = e.resourceId

                this.getCRMTable({}, this.pageSizeCRM)
                this.getHostTable({}, this.pageSizeHost)
                this.getAccountTable({}, this.pageSizeAccount)
            });
        },
        async clickForm(e) {
            let list = {
                processInstanceId: e.process_id,
                // taskId:e.taskId
            };
            let _this = this;
            let obj = {
                url: this.$url.formList.getCommentsByProcessId, //流程追踪接口
                data: list,
                headers: {
                    "Content-Type": "application/json",
                },
            };

            let res = await this.common.httpPost(obj, success);
            function success(data) {
                console.log('[ 接口返回值第一曾 ] >', data)
                let list = [];
                list = data.data.data;
                if (data.data.lastmandata.length != 0) {
                    data.data.lastmandata.map((item, index) => {
                        item.id = index + 22;
                    });
                }
                list.map((item, index) => {
                    item.startTime = _this.$util.datetimeFormat(item.startTime);
                    item.endTime = _this.$util.datetimeFormat(item.endTime);
                    item.id = index + 1;
                    item.children = [];
                    if (data.data.lastmandata.length != 0) {
                        let indexs = data.data.lastmandata.findIndex((items) => {
                            if (items.taskId == item.taskId) {
                                item.children.push(items);
                            }
                        });
                    }
                });
                console.log(list);
                _this.lables.data = list;
                console.log("[ _this.lables.data ] >", _this.lables.data);
                _this.abc = true;
            }
        },
        handleClose() {//关闭弹窗
            this.dialogStatus = false;
            this.fromList = {};
        },
        async clickSave() {
            this.$refs.form.validate((valid) => {
                if (valid) {
                    console.log(this.$refs.form.model)
                    this.savestatusBtn = true
                    if (this.fromList.id) {
                        if (this.fromList.templateAccessoryList) {
                            this.fromList.templateAccessoryIdList = []
                            this.fromList.templateAccessoryList.map((item) => {
                                this.fromList.templateAccessoryIdList.push(item.id);
                            })
                        }
                        this.$http({
                            url: "/market/BomcProcess/update",
                            method: "post",
                            headers: {
                                "Content-Type": "application/json",
                            },
                            data: this.fromList,
                        }).then((res) => {
                            if (res.data.result === 0) {
                                this.$message.success("表单更新成功");
                            }
                        });
                    } else {
                        this.getUserIds();
                    }
                } else {
                    this.$message.error("请完善表单信息");
                    return false;
                }
            });
        },
        //获取自己idname
        getUserIds() {
            this.$http({
                url: "/market/api/user/info/queryNodePers?params=" + JSON.parse(window.sessionStorage.userInfo).loginNo,
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
            }).then((res) => {
                this.request_form.userName = res.data[0].children[0].loginNameStr;
                this.request_form.userId = res.data[0].children[0].loginNoStr;
                this.setForm();
                console.log(this.request_form)
            });
        },
        setForm(e) {
            this.request_form.title = '[IT工作台]-账号申请-' + this.fromList.needName;
            if (this.fromList.templateAccessoryList) {
                this.fromList.templateAccessoryIdList = []
                this.fromList.templateAccessoryList.map((item) => {
                    this.fromList.templateAccessoryIdList.push(item.id);
                })
            }
            this.$http({
                url: "/market/BomcProcess/addFullBomcProcess",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: {
                    bomcProcess: this.fromList,
                    // bomcProcessAccounts: this.bomcProcessAccounts,
                    // bomcProcessCrms: this.bomcProcessCrms,
                    // bomcProcessHosts: this.bomcProcessHosts,
                },
            }).then((res) => {
                this.request_form.businessKey = res.data.body;
                this.fromList.id = res.data.body;
                this.formWorkId = res.data.body;
                this.clickHandle(res.data.body);
            });
        },
        async clickHandle(e) {
            let _this = this;
            let obj = {
                url: this.$url.formList.startWork, //开始工作流接口
                data: _this.request_form,
                status: "form",
                headers: {
                    "Content-Type": "application/x-www-form-urlencoded",
                },
            };

            let res = await this.common.httpPost(obj, success);
            function success(data) {
                // console.log(data);
                _this.fromList.taskId = data.data;
                _this.fromList.processId = data.data;
                // _this.fromList.resourceId = data.data;
                _this.taskId = data.data;
                // _this.fromList.taskId = data;
                // _this.taskId = data;
                let list = {
                    id: e,
                    // taskId:_this.formId,
                    processId: _this.fromList.taskId,
                    tableName: _this.request_form.processDefinitionKey,
                };
                _this.setUpdate(list);
            }
        },
        //更新工作流接口
        setUpdate(e) {
            this.$http({
                url: "/market/waf/updateBase",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: e,
            }).then((res) => {
                this.fromList.taskId = res.data.body[0].taskId;
                this.fromList.taskName = res.data.body[0].taskName;
                // if (res.data.body.taskName === "填写账号申请单") {
                //     this.isSync = res.data.body.isSync;
                // } else {
                //     this.isSync = "1";
                // }
                if (res.data.result === 0) {
                    this.$message.success("工作流更新成功");
                }
            });
        },
        //处理按钮,开始工作流接口
        clickHandles() {
            this.getNextPath(this.fromList.resourceId || "");
            console.log(this.fromList);
            // if (this.fromList.taskId) {
            //     this.destroy = true;
            //     this.handleStatus = true;
            // } else {
            //     this.$message.error("请先点击保存按钮");
            // }
        },
        getNextPath(e) {
            let list = {
                fresourceId: this.requestForm.fresourceId, // 本地环境
                processId: this.requestForm.processDefinitionKey,
            };
            if (e) {
                // this.propsList = [];
                list.resourceId = e;
            }
            console.log(11111);
            console.log(list);
            console.log(11111);
            this.$http({
                url: "/market/waf/queryPath",
                method: "post",
                headers: {
                    "Content-Type": "application/json",
                },
                data: list,
            }).then((res) => {
                console.log(res);
                console.log(this.fromList);
                console.log(res.data.body);
                console.log(res.data.body.nextShapes[0].multi);
                if (res.data.body.nextShapes[0].multi) {
                    if (res.data.body.nextShapes[0].multi.multi === "true") {
                        this.getLastName();
                    }
                }
                if (this.fromList.taskId || this.fromList.processId) {
                    this.destroy = true;
                    this.handleStatus = true;
                } else {
                    this.$message.error("请先点击保存按钮");
                }
            });
        },

        //处理关闭
        handleCloses() {
            // this.treeList = [];
            // this.textarea = "";
            this.handleStatus = false;
            this.usernumber()
        },
        //CRM 新增关闭
        handleCRMCloses() {
            this.handleCRMStatus = false;
        },
        handleHostCloses() {
            this.handleHostStatus = false;
        },
        handleAccountCloses() {
            this.handleAccountStatus = false;
        },
        updateForm() {
            this.dialogStatus = false;
            this.handleCloses();
            this.usernumber()
            if (this.clickTagName == 'first') {
                this.lableTable = this.firstlabel
                this.getQueryList();
            }
            if (this.clickTagName == 'two') {
                this.lableTable = this.twolabel
                this.getQueryDone();
            }
            if (this.clickTagName == 'three') {
                this.lableTable = this.threelabel
                this.getMeLaunch()
            }
        },
        clickTabMains(e) {
            console.log(e);
            this.clickTagName = e
            this.pageNo = 1
            this.$refs.TableList.page = 1;
            if (this.clickTagName == 'first') {
                this.lableTable = this.firstlabel
                this.getQueryList();
            }
            if (this.clickTagName == 'two') {
                this.lableTable = this.twolabel
                this.getQueryDone();
            }
            if (this.clickTagName == 'three') {
                this.lableTable = this.threelabel
                this.getMeLaunch()
            }
        },
        adminhandleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        adminhandleCurrentChange(val) {
            console.log(`当前页: ${val}`);
        },
        // 分页
        currchangeCRM(v) {
            this.pageSizeCRM = v;
            this.getCRMTable(this.paramsCRM, this.pageSizeCRM);
        },
        currchangeHost(v) {
            this.pageSizeHost = v;
            this.getHostTable(this.paramsHost, this.pageSizeHost);
        },
        currchangeAccount(v) {
            this.pageSizAccount = v;
            this.getAccountTable(this.paramsAccount, this.pageSizAccount)
        },

        //我的待办
        getQueryList(e, status) {
            this.loading = true;
            getTodoBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                if (status === 0) {
                    this.clickDemand("任务主题", res.data.data[0]);
                }
                this.lableTable.data = res.data.data;
                this.lableTable.pageData.total = res.data.totalRecord;
                this.tabListMain[0].number = res.data.totalRecord
                this.loading = false;
            });
        },
        //我的已办
        getQueryDone() {
            this.loading = true;
            getDoneBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                this.lableTable.data = res.data.data;

                // this.lableTable.data.map((item) => {
                //     item.status = "2";
                // });
                this.lableTable.pageData.total = res.data.totalRecord;
                this.tabListMain[1].number = res.data.totalRecord
                this.loading = false;
            });
        },
        //我发起的
        getMeLaunch() {
            this.loading = true;
            getInitiateBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                this.lableTable.data = res.data.data;
                // this.lableTable.data.map((item) => {
                //     if (item.taskName === "填写账号申请单") {
                //         item.status = "1";
                //     } else {
                //         item.status = "2";
                //     }
                // });
                this.lableTable.pageData.total = res.data.totalRecord;
                this.tabListMain[2].number = res.data.totalRecord
                this.loading = false;
            });
        },
        usernumber() {
            getInitiateBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                this.tabListMain[2].number = res.data.totalRecord
            });
            getDoneBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                this.tabListMain[1].number = res.data.totalRecord
            });
            getTodoBase(this.pageNo, "", { tableName: this.tableName, }).then((res) => {
                this.tabListMain[0].number = res.data.totalRecord
            });
        }
    },
    created() {
        let status = JSON.stringify(this.$route.query) == "{}";
        if (status) {
            this.lableTable = this.firstlabel
            this.getQueryList()
            this.usernumber()
        } else {
            let { id, type } = this.$route.query;
            let list = {
                taskId: id,
                tableName: this.tableName
            };
            this.usernumber()
            this.lableTable = this.firstlabel
            this.getQueryList(list, 0);//代办
        }
    }
}
</script>
<style lang="scss" scoped>
.copyClass {
    display: flex;
}

.flex-header-text-tree {
    width: 50%;
    text-align: center;
}

::v-deep .el-form-item {
    width: 100%;
}

.active {
    background-color: #f3faff;
}

.flex-common {
    padding: 10px 5%;
    font-size: 18px;
}

.flex-buttons {
    background-color: #cde4f6;
    border-color: #cde4f6;
    color: #606266;
}

.flex-button {
    margin-top: 10px;
    margin-bottom: 10px;

    ::v-deep .el-button--primary {
        width: 222px;
    }
}

.flex-left-header-text {
    height: 40px;
    line-height: 40px;
    color: black;
    padding-left: 10px;
    background-color: #cde4f6;
    font-size: 18px;
    font-weight: bold;
}

.flex-right-text {
    margin-right: 20px;
    width: 50%;
}

.flex-handle {
    width: 100%;
    padding: 30px;
    display: flex;

    .flex-right {
        width: 50%;
        border: 1px solid #e1e1e1;
        margin-left: 20px;
    }

    .flex-left {
        width: 50%;
        display: flex;
        flex-direction: column;

        .flex-left-header {
            display: flex;
            justify-content: space-around;
        }
    }
}

.table-title {
    height: 50px;
    line-height: 50px;
    background-color: #f3faff;
    font-size: 18px;
    font-weight: bold;
}

::v-deep .el-dialog {
    margin-top: 0 !important;
}

::v-deep .el-table__fixed-body-wrapper {
    top: 50px !important;
}

.flex-box {
    display: flex;
    width: calc(100% - 40px);
    border-radius: 20px;
    background-color: #fff;
    margin: 0 auto;
    margin-top: 20px;
    position: relative;
    flex-direction: column;

    .flex-load {
        display: flex;
        width: 100%;
        position: relative;
        margin: 1%;
        border-bottom: 1px solid #e1e1e1;
        justify-content: space-between;
    }

    .flex-header {
        display: flex;
        // width: 100%;
        position: relative;
        // height: 60px;
        margin: 1%;
        border-bottom: 1px solid #e1e1e1;

        justify-content: space-between;
        // ::v-deep .el-form-item {
        //     width: 30%;
        //     margin-right: 5%;
        // }

        .el-button {
            width: 150px;
            float: right;
            height: 40px !important;
            margin-right: 30px;
        }
    }
}

//设置子组件样式
::v-deep .el-tabs__item {
    padding: 0;
    margin-right: 20px;
    width: 166px;
    text-align: center;
    background-color: #d8eaf6;
    color: black;
}

//设置子组件样式
::v-deep .el-form-item__label {
    text-align: center;
}

::v-deep .is-active {
    color: #fff;
    background-color: #0583cd;
}

::v-deep .el-select {
    width: 100%
}

::v-deep .el-tabs__active-bar {
    display: none;
}

::v-deep .el-tabs__nav-wrap::after {
    display: none !important;
}

.flex-form {
    margin-top: 50px;
}

.flex-footer-botton {
    display: flex;
    justify-content: space-evenly;
}

a {
    text-decoration: none
}

::v-deep .el-button--text {
    display: none !important;
}
</style>
