<template>
<!-- 部门考核录入 -->
  <div class="dashboard-container">
    <div class="gva-search-box">
      <el-form ref="searchForm" :inline="true" :model="searchVersion">
        <el-form-item label="所属公司">
          <el-select v-model="searchVersion.group" clearable placeholder="请选择" @change="selectGroup">
            <el-option
              v-for="item in companyList"
              :key="item.wxId"
              :label="item.name"
              :value="item.wxId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="所属部门">
          <el-cascader clearable v-model="searchVersion.deaprtid" :options="departmentList" :show-all-levels="false" :props="props1"></el-cascader>
          <!-- <el-select v-model="searchVersion.deaprtid" clearable placeholder="请选择">
            <el-option
              v-for="item in departmentList"
              :key="item.id"
              :label="item.name"
              :value="item.id">
            </el-option>
          </el-select> -->
        </el-form-item>
        <el-form-item label="年度">
          <el-select v-model="searchVersion.year" placeholder="请选择">
            <el-option
              v-for="item in yearList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="gva-table-box">
      <div class="gva-btn-list">
        <!-- <el-button size="mini" type="primary" icon="el-icon-setting" @click="showDimension()">设置维度权重</el-button> -->
        <el-button size="mini" type="primary" icon="el-icon-setting" @click="showIndex()">生成部门考核方案</el-button></el-button>
      </div>
      <el-table border :data="versionData" :span-method="versionSpanMethod">
        <el-table-column align="left" label="部门"> 
          <template #default="scope">
            {{scope.row.groupname}}{{scope.row.deaprtname}}
          </template>
        </el-table-column>
        <el-table-column align="left" label="年度" prop="year"/>
        <el-table-column align="left" label="版本号">
          <template #default="scope">
            {{scope.row.key}}
          </template>
        </el-table-column>
        <el-table-column align="left" label="时间" prop="time"/>
        <el-table-column align="left" label="状态">
            <template #default="scope">
                <el-switch
                    inline-prompt 
                    active-text="正常" 
                    inactive-text="禁止"
                    v-model="scope.row.state"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                    :active-value=1
                    :inactive-value=2
                    @change="changeVal($event,scope.row.key)"
                    />
             </template>
        </el-table-column>
        <el-table-column align="left" fixed="right" label="操作" width="200">
          <template #default="scope">
            <el-button
              icon="el-icon-view"
              size="small"
              type="text"
              @click="showDetails(scope.row)"
            >查看详情</el-button>
            <!-- <el-button
              icon="el-icon-edit"
              size="small"
              type="text"
              @click="showEdit(scope.row)"
            >编辑</el-button> -->
            <el-button
              icon="el-icon-delete"
              size="small"
              type="text"
              @click="deleteOperate(scope.row)"
            >删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <!-- <el-table :data="tableData" border :span-method="objectSpanMethod">
        <el-table-column prop="parentname" label="部门"></el-table-column>
        <el-table-column prop="dimensionname" label="考核维度"></el-table-column>
        <el-table-column prop="dimensionweight" label="维度权重"></el-table-column>
        <el-table-column prop="targetname" label="考核指标">
          <template slot-scope="scope">
            <el-link v-if="scope.row.type==1" type="primary" @click="showMethod(scope.row)">{{scope.row.targetname}}</el-link>
            <div v-if="scope.row.type==2">{{scope.row.targetname}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="targetweight" label="指标权重"></el-table-column>
        <el-table-column prop="unit" label="单位"/>
        <el-table-column prop="cycle" label="周期">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.cycle==1">班</el-tag>
            <el-tag v-if="scope.row.cycle==2">天</el-tag>
            <el-tag v-if="scope.row.cycle==3">周</el-tag>
            <el-tag v-if="scope.row.cycle==4">月</el-tag>
            <el-tag v-if="scope.row.cycle==5">季度</el-tag>
            <el-tag v-if="scope.row.cycle==6">年</el-tag>
          </template>
        </el-table-column>
         <el-table-column prop="cycleattr" label="频次">
          <template slot-scope="scope">
            <div v-if="scope.row.cycle==1">每班{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==2">每天{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==3">每周{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==4">每月{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==5">每季度{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==6">每年{{scope.row.cycleattr}}次</div>
          </template>
        </el-table-column>
        <el-table-column prop="userlist" label="执行人">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-view"
              size="small"
              type="text"
              @click="showUserList(scope.row)"
            >查看</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="userlist" label="操作">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-delete"
              size="small"
              type="text"
              @click="deldepTarger(scope.row)"
            >删除</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="userlist" label="操作">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-delete"
              size="small"
              type="text"
              @click="deldetePartDuty(scope.row)"
            >删除</el-button>
          </template>
        </el-table-column>
       </el-table> -->
      </div>
      <!-- 新增弹框 -->
      <el-dialog :visible.sync="dialogFormVisible" :before-close="closeDialog" title="新增" width="100%">
        <el-form ref="addForm" :model="form" :rules="rules" label-width="150px">
          <el-row>
            <el-col :span="12">
              <el-form-item label="所属公司" prop="title">
                <el-select v-model="form.group" clearable placeholder="请选择" @change="selectGroup">
                  <el-option
                    v-for="item in companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="所属部门" prop="title" v-if="form.group!=''">
                <el-cascader clearable v-model="form.parentid" :options="departmentList" :show-all-levels="false" :props="props1" @change="selectDepartment"></el-cascader>
                <!-- <el-select multiple v-model="form.parentid" clearable placeholder="请选择" @change="selectDepartment">
                  <el-option
                    v-for="item in departmentList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select> -->
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="考核维度">
                <el-select v-model="form.dimension" clearable placeholder="请选择状态">
                  <el-option
                    v-for="item in dutyclasslist"
                    :key="item.outId"
                    :label="item.title"
                    :value="item.outId">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <!-- <el-form-item label="所属部门" prop="title" v-if="form.group!=''">
                <el-select multiple v-model="form.parentid" clearable placeholder="请选择" @change="selectDepartment">
                  <el-option
                    v-for="item in departmentList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item> -->
            </el-col>
          </el-row>
        <el-form-item v-if="form.parentid!=''">
          <!-- 表格表单提交 -->
            <el-table
                :data="indexList"
                style="width: 100%">
                
                <el-table-column
                    label="名称"
                    align="center"
                    prop="title"
                    >
                </el-table-column>
                <el-table-column
                    label="考核周期"
                    align="center">
                    <template slot-scope="scope">
                       <el-select v-model="scope.row.cycle" placeholder="请选择考核周期">
                        <el-option
                        v-for="item in options"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                      </el-select>
                    </template>
                </el-table-column>
                <el-table-column
                    label="辅助计数"
                    align="center">
                    <template slot-scope="scope">
                       <el-input v-model="scope.row.cycleattr" autocomplete="off" />
                    </template>
                </el-table-column>
                <el-table-column
                    label="单位"
                    align="center">
                    <template slot-scope="scope">
                       <el-input v-model="scope.row.unites"></el-input>
                    </template>
                </el-table-column>
                <!-- <el-table-column
                    label="分值"
                    align="center">
                    <template slot-scope="scope">
                       <el-input v-model.number="scope.row.referencescore"></el-input>
                    </template>
                </el-table-column> -->
                <el-table-column
                    label="数据提报"
                    align="center">
                    <template slot-scope="scope">
                          <el-cascader clearable v-model="scope.row.reportlist" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader>
                    </template>
                </el-table-column>
                <el-table-column align="left" fixed="right" label="操作">
                  <template #default="scope">
                    <el-button
                      icon="el-icon-delete"
                      size="small"
                      type="text"
                      @click="deleteRow(scope)"
                    >删除</el-button>
                  </template>
                </el-table-column>
            </el-table>
        </el-form-item>
         
        </el-form>
        <template #footer>
          <div class="dialog-footer"> 
            <el-button size="small" @click="closeDialog">取 消</el-button>
            <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
          </div>
        </template>
      </el-dialog>
      <!-- 人员弹框 -->
      <el-dialog :visible.sync="showUser" title="执行人" width="30%">
        <!-- <el-descriptions class="margin-top" :column="3" size="medium" border>
          <el-descriptions-item v-for="item in userlistary" :key="item.key">
            <template slot="label">
              <i class="el-icon-user"></i>
              姓名
            </template>
            {{item.name}}
          </el-descriptions-item>
        </el-descriptions> -->
        <el-table
          :data="userlistary"
          style="width: 100%">
          <el-table-column
            prop="date"
            label="头像">
            <template slot-scope="scope">
              <el-avatar shape="square" size="large" :src="scope.row.icon"></el-avatar>
            </template>
          </el-table-column>
          <el-table-column
            prop="number"
            label="工号">
          </el-table-column>
          <el-table-column
            prop="address"
            label="部门">
            <template slot-scope="scope">
              {{scope.row.groupname}}{{scope.row.departmentname}}
            </template>
          </el-table-column>
          <el-table-column
            prop="name"
            label="姓名">
          </el-table-column>
        </el-table>
      </el-dialog>
      <!-- 指标权重弹框 -->
      <el-dialog :close-on-click-modal="false" :visible.sync="demDialogFormVisible" title="指标组合" width="70%">
        <el-form ref="addForm" :model="form" :rules="rules" label-width="150px">
          <el-row>
            <el-col :span="6">
              <el-form-item label="所属公司" prop="title">
                <el-select v-model="form.group" clearable placeholder="请选择" @change="selectGroup">
                  <el-option
                    v-for="item in companyList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="所属部门" prop="title" v-if="form.group!=''">
                <el-cascader clearable v-model="form.parentid" :options="departmentList" :show-all-levels="false" :props="props1" @change="shouWei"></el-cascader>
                <!-- <el-select v-model="form.parentid" clearable placeholder="请选择" @change="shouWei">
                  <el-option
                    v-for="item in departmentList"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select> -->
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="年度">
                <el-select v-model="form.year" placeholder="请选择">
                  <el-option
                    v-for="item in yearList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <div style="width: 200px;height: 40px;line-height: 40px;margin: 0 auto;">
                纬度合计分：{{weiduFraction}}
              </div>
            </el-col>
          </el-row>
          
          <el-form-item v-if="form.parentid!=''">
          <!-- 表格表单提交 -->
            <el-card class="box-card" v-for="(item,index) in weiDuList" :key="item.id">
              <el-row>
                <el-col :span="8">
                  <span>考核纬度：{{item.name}}</span>
                </el-col>
                <el-col :span="8">
                  <!-- <el-select v-model="item.ordering" clearable placeholder="请选择顺序">
                    <el-option :value=1 label="1">1</el-option>
                    <el-option :value=2 label="2">2</el-option>
                    <el-option :value=3 label="3">3</el-option>
                    <el-option :value=4 label="4">4</el-option>
                    <el-option :value=5 label="5">5</el-option>
                    <el-option :value=6 label="2">6</el-option>
                  </el-select> -->
                </el-col>
                <el-col :span="8">
                  指标合计分：{{item.zhiFraction}}
                </el-col>
               </el-row>
               <el-table
                    border
                    :data="item.child"
                    style="width: 100%">
                    <el-table-column
                        label="指标名称"
                        align="center"
                        prop="name"
                        >
                    </el-table-column>
                    <el-table-column
                        label="说明"
                        align="center"
                        prop="illustrate"
                        >
                        <template slot-scope="scope">
                          <el-input v-model="scope.row.content" autocomplete="off" />
                          <!-- <div v-if="scope.row.targetweight!=0">{{scope.row.targetweight}}</div> -->
                        </template>
                    </el-table-column>
                    <el-table-column
                        label="指标权重"
                        align="center"
                        prop="referencescore"
                        >
                        <template slot-scope="scope">
                          <el-input v-model.number="scope.row.referencescore" autocomplete="off" @change="zhibiaofen" />
                          <!-- <el-input v-if="scope.row.istrue==1" v-model.number="scope.row.referencescore" autocomplete="off" @change="zhibiaofen" /> -->
                          <!-- <div v-if="scope.row.istrue==2">{{scope.row.referencescore}}</div> -->
                        </template>
                    </el-table-column>
                    
                    <el-table-column
                        label="状态"
                        align="center"
                        prop="status"
                        >
                        <template slot-scope="scope">
                          <el-select v-model="scope.row.status" clearable placeholder="请选择">
                            <el-option :value=1 label="使用">使用</el-option>
                            <el-option :value=2 label="禁用">禁用</el-option>
                          </el-select>
                          <!-- <div v-if="scope.row.targetweight!=0">{{scope.row.targetweight}}</div> -->
                        </template>
                    </el-table-column>
                 </el-table>
                </el-card>
              </el-form-item>
           </el-form>
           <template #footer>
          <div class="dialog-footer"> 
            <el-button size="small" @click="zhuheguan">取 消</el-button>
            <el-button size="small" type="primary" @click="zhuheTi">确 定</el-button>
          </div>
        </template>
      </el-dialog>
      <!-- 编辑弹框 -->
      <el-dialog :close-on-click-modal="false" :visible.sync="editDialogFormVisible" :before-close="editCloseDialog" title="修改" width="20%">
        <el-form ref="editForm" :model="editAdd" :rules="editRules" label-width="150px">
          <el-form-item label="所属考核项目">
          <span>
            <el-tag v-if="editChildInfo.title!=''">{{editChildInfo.title}}</el-tag>
            <projectDialog @checkedInfo="getEditCheckedfrom"></projectDialog>
          </span>
        </el-form-item>
        <el-form-item label="定性指标名称" prop="title">
                <el-input v-model="editAdd.title" autocomplete="off" />
            </el-form-item>
        <el-form-item label="定性指标说明" prop="content">
          <el-input
            type="textarea"
            :autosize="{ minRows: 2, maxRows: 4}"
            placeholder="请输入内容"
            v-model="editAdd.content">
          </el-input>
        </el-form-item>
        
        </el-form>
        <template #footer>
          <div class="dialog-footer"> 
            <el-button size="small" @click="editCloseDialog">取 消</el-button>
            <el-button size="small" type="primary" @click="editEnterDialog">确 定</el-button>
          </div>
        </template>
      </el-dialog>
      <!-- 考核办法弹框 -->
      <el-dialog :visible.sync="methodShow" title="考核办法" width="60%">
        <el-table :data="methodList" border :span-method="methodSpanMethod" :cell-style="{padding:'0px'}">
          <el-table-column prop="targetsunname" label="考核项目" width="85"></el-table-column>
          <!-- <el-table-column prop="targetsunname" label="权重"></el-table-column> -->
          <el-table-column prop="detailedtargetname" label="考核内容"></el-table-column>
          <el-table-column prop="score" label="考核标准" width="85"></el-table-column>
          <el-table-column prop="unit" label="单位" width="85"/>
          <el-table-column prop="content" label="备注说明" width="200"/>
          <!-- <el-table-column prop="referencescore" label="标准分"/> -->
        </el-table>
      </el-dialog>
      <!-- 部门考核详情弹框 -->
      <el-dialog :visible.sync="detailsShow" title="考核方案" width="75%" @close="detailsClose">
        <el-table :data="tableData" border :span-method="objectSpanMethod" :cell-style="{padding:'0px'}">
        <!-- <el-table-column prop="parentname" label="部门"></el-table-column> -->
        <el-table-column prop="dimensionname" label="考核维度" width="80"></el-table-column>
        <el-table-column prop="dimensionweight" label="维度权重" align="center" width="80"></el-table-column>
        <el-table-column prop="targetname" label="考核指标" width="140">
          <template slot-scope="scope">
            <el-link v-if="scope.row.type==1" type="primary" @click="showMethod(scope.row)">{{scope.row.targetname}}</el-link>
            <div v-if="scope.row.type==2">{{scope.row.targetname}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="targetweight" label="指标权重" align="center" width="80"></el-table-column>
        <el-table-column prop="content" label="说明"></el-table-column>
        <el-table-column prop="unit" label="单位" align="center" width="80"/>
        <el-table-column prop="cycle" label="周期" align="center" width="80"> 
          <template slot-scope="scope">
            <el-tag v-if="scope.row.cycle==1">班</el-tag>
            <el-tag v-if="scope.row.cycle==2">天</el-tag>
            <el-tag v-if="scope.row.cycle==3">周</el-tag>
            <el-tag v-if="scope.row.cycle==4">月</el-tag>
            <el-tag v-if="scope.row.cycle==5">季度</el-tag>
            <el-tag v-if="scope.row.cycle==6">年</el-tag>
          </template>
        </el-table-column>
         <el-table-column prop="cycleattr" label="频次" width="80">
          <template slot-scope="scope">
            <div v-if="scope.row.cycle==1">每班{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==2">每天{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==3">每周{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==4">每月{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==5">每季度{{scope.row.cycleattr}}次</div>
            <div v-if="scope.row.cycle==6">每年{{scope.row.cycleattr}}次</div>
          </template>
        </el-table-column>
        <el-table-column prop="userlist" label="执行人" width="80">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-view"
              size="small"
              type="text"
              @click="showUserList(scope.row)"
            >查看</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="userlist" label="操作" width="120">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-edit"
              size="small"
              type="text"
              @click="editTarger(scope.row)"
            >修改</el-button>
            <el-button
              icon="el-icon-delete"
              size="small"
              type="text"
              @click="deldepTarger(scope.row)"
            >删除</el-button>
          </template>
        </el-table-column>
        <!-- <el-table-column prop="userlist" label="操作">
          <template slot-scope="scope">
            <el-button
              icon="el-icon-delete"
              size="small"
              type="text"
              @click="deldetePartDuty(scope.row)"
            >删除</el-button>
          </template>
        </el-table-column> -->
       </el-table>
      </el-dialog>
       <!-- 修改指标说明 -->
      <el-dialog :visible.sync="contentShow" title="修改" width="40%">
        <el-form :model="editTargerFrom" label-width="150px">
          <el-form-item label="说明" prop="content">
            <el-input
              type="textarea"
              autosize
              placeholder="请输入内容"
              v-model="editTargerFrom.content">
            </el-input>
            <!-- <el-input v-model="editTargerFrom.content"/> -->
          </el-form-item>
        </el-form>
        <template #footer>
          <div class="dialog-footer"> 
            <el-button size="small" type="primary" @click="xiuShuoMing">确 定</el-button>
          </div>
        </template>
      </el-dialog>
  </div>
</template>

<script>
import { dutyclasslist } from '@/api/duty/dimension'
import { gettasktarget,gettasktargetsun,gettasktargetcontary,addqualeval,
addration,departmenttasklist,addqubatch,bumenList,departmentlistnew,adddepartmentdutyinfo,
newgerderpattarlist,newadddepartduty,deldepartdutytarger,deldepartduty,departdutyplanversion,adddepartdutyversio,
lookdepartdutyversio,onoffdepartdutyversio,eitedepartexplain
 } from '@/api/duty/duty'
import projectDialog from '@/components/projectDialog/index.vue'
import { dutylist,getdutyinfo,eitedutyinfo,eitedutystate } from '@/api/duty/quantitativeIndicators'
import {
  grouplist,
  departmentlist,
  getgroupdepartmap,
  getgroupuser
} from '@/api/duty/group'
export default {
  name: 'Dashboard',
  components: {
    projectDialog
  },
  data() {
    return {
      props1: {
        checkStrictly: true,
        value: "id",
        label: "name",
        children: "children",
        emitPath:false,
      },
      contentShow:false,
      editTargerFrom:{},
      detailsShow:false,
      // 纬度合计分
      weiduFraction:0,
      // 纬度卡片列表
      weiDuList:{},
      // 列表
      liebiaoList:[],
      // 权重设置弹窗
      demDialogFormVisible:false,
      // 执行人列表
      userlistary:[],
      // 执行人列表弹窗
      showUser:false,
      // 选择员工配置项
      userProps: {
        value: "id",
        label: "name",
        children: "groupUser",
        emitPath:false,
        multiple: true
      },
      // 员工列表
      grouplistBackup:[],
      // 周期列表
      options: [{
            value: 1,
            label: '班'
        }, {
            value: 2,
            label: '天'
        }, {
            value: 3,
            label: '周'
        }, {
            value: 4,
            label: '月'
        }, {
            value: 5,
            label: '季度'
        }, {
            value: 6,
            label: '年'
        }],
      // 考核细则表格显示
      tableShow:false,
      // 子栏目列表
      targetsunList:[],
      // 细则列表
      rulesList:[],
      // 细则拷贝
      rulesCopyList:[],
      // 考核指标列表
      indexList:[],
      // 考核纬度列表
      dutyclasslist:[],
      // 考核纬度请求值
      dutyClassFrom:{
        page: 1, //分页页码，数字类型
        pagesize: 100000,
        state: 1 //状态（查询用）
      },
      // 部门列表
      departmentList:[],
      versionSpanArr1:[],
      // 公司列表
      companyList:[],
      editChildInfo:{},
      grouplist:[],
      props: {
        value: "id",
        label: "name",
        children: "children",
        emitPath:false
      },
      addChildInfo:{
        title:''
      },
      childInfo:{
        title:''
      },
      // 查询详情的数据
      editFrom:{},
      // 修改状态提交数据
      switchFrom:{},
      // 删除数据提交
      deleFrom:{},
      // 编辑时数据
      editAdd:{
        parentId:''
      },
      assessList:{},
      // 添加数据
      form:{
        group:'',
        parentid:'',
        child:[]
      },
      searchDepartmentList:[],
      // 弹窗变量
      dialogFormVisible:false,
      // 修改弹窗
      editDialogFormVisible:false,
      total: 0,
      tableData:[],
      yearList:[{
          value: '2021',
          label: '2021'
        }, {
          value: '2022',
          label: '2022'
        }, {
          value: '2023',
          label: '2023'
        }, {
          value: '2024',
          label: '2024'
        }, {
          value: '2025',
          label: '2025'
        }, {
          value: '2026',
          label: '2026'
        }, {
          value: '2027',
          label: '2027'
        }, {
          value: '2028',
          label: '2028'
        }, {
          value: '2029',
          label: '2029'
        }, {
          value: '2030',
          label: '2030'
        }],
      pos:'',
      pos1:'',
      pos2:'',
      versionPos:'',
      spanArr:[],
      spanArr1:[],
      spanArr2:[],
      versionSpanArr:[],
      methodSpanArr:[],
      methodList:[],
      methodPos:'',
      methodShow:false,
      versionData:[],
      // 条件查询变量
      searchInfo: {
        type: 0,
        group: "3",
        departmentid:'',
      },
      // 新条件查询变量
      searchVersion: {
        group: '',
        deaprtid:'',
        year: "", //年
      },

      showDetailsRow:{},
      // 条件查询变量
      abc:{
        aaa:"111",
        bbb:"222"
      },
      // 添加时验证规则
      rules: {
        // title: [{ required: true, message: '请输入名称', trigger: 'blur' }],
      },
      editRules:{
        title: [{ required: true, message: '请输入名称', trigger: 'blur' }],
      }
    }
  },
  created() {
    console.log(this.$store.state.user.token)
    if (this.$store.state.user.token=='') {
      this.$router.push('/login')
    }
    // 页面渲染时获取初始数据
    this.initialDepartment()
    this.getVersionDataList()
    // this.getDataList()
    this.getGrouplist()
    this.getDutyclasslist()
    this.getSystemadminlist()
  },
  // 监听数据
  watch: {
    methodList() {
      this.$nextTick(() => {
        this.methodSpanArr=[],
        this.methodPos='',
        //此时就可以获取到在created赋值后的dataList了
      this.getMethodSpanArr(this.methodList);
      });
    },
    versionData() {
      this.$nextTick(() => {
        this.versionSpanArr=[],
        this.versionPos='',
        // this.methodSpanArr1=[],
        // this.methodPos1='',
        //此时就可以获取到在created赋值后的dataList了
      this.getVersionSpanArr(this.versionData);
      // this.getMethodSpanArr1(this.methodList);
      });
    },
    tableData() {
      this.$nextTick(() => {
        this.spanArr=[],
        this.spanArr1=[],
        this.spanArr2=[],
        this.pos2='',
        this.pos='',
        this.pos1='',
        
        //此时就可以获取到在created赋值后的dataList了
        this.getSpanArr(this.tableData);
        this.getSpanArr1(this.tableData);
        this.getSpanArr2(this.tableData);
      });
    },
  },
  methods: {
    getVersionSpanArr(data) {
        // data就是我们从后台拿到的数据
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.versionSpanArr.push(1);
          this.versionPos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].department === data[i - 1].department) {
            this.versionSpanArr[this.versionPos] += 1;
            this.versionSpanArr.push(0);
          } else {
            this.versionSpanArr.push(1);
            this.versionPos = i;
          }
        }
      }
    },
    versionSpanMethod({ row, column, rowIndex, columnIndex }){
      if (columnIndex === 0) {
        const _row = this.versionSpanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col
        };
      }
    },
    // 部门考核详情关闭监听
    detailsClose(){
      this.tableData=[]
    },
    async showDetails(row){
        this.showDetailsRow=row
        this.getDataList()
        this.detailsShow=true
      
    },
    // 删除部门考核
    async deldetePartDuty(row){
      const deleFrom = {
        group: row.group,
        deaprtid: row.parentid
        }
      const res = await deldepartduty(deleFrom)
       if (res.code === 0) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
          this.getDataList()
      }
      
    },
    // 修改说明
    async xiuShuoMing(){
      const res = await eitedepartexplain(this.editTargerFrom)
      this.editTargerFrom={}
      this.getDataList()
      this.contentShow=false 
    },
    // 删除部门考核指标
    async editTarger(row){
      this.editTargerFrom={
        content:row.content,
        group:row.group,
        qualevalid:row.qualevalid,
        deaprtid:row.parentid,
        dimension:row.dimension,
        targetid:row.target
      },
      // this.editTargerFrom.content=row.content
      // this.editTargerFrom.group=row.group
      // this.editTargerFrom.qualevalid=row.qualevalid
      // this.editTargerFrom.deaprtid=row.parentid
      // this.editTargerFrom.dimension=row.dimension
      // this.editTargerFrom.targetid=row.target
      this.contentShow=true
      // const deleFrom = {
      //   group: row.group,
      //   deaprtid: row.parentid,
      //   dimension: "1", //维度
      //   targetid: "1" //指标
      //   }
      // const res = await deldepartdutytarger(deleFrom)
      // if (res.code === 0) {
      //       this.$message({
      //         type: 'success',
      //         message: '删除成功!'
      //       })
      //     this.getDataList()
      // }
    },
    // 删除部门考核指标
    async deldepTarger(row){
      const deleFrom = {
        group: row.group,
        deaprtid: row.parentid,
        dimension: "1", //维度
        targetid: "1" //指标
        }
      const res = await deldepartdutytarger(deleFrom)
      if (res.code === 0) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
          this.getDataList()
      }
    },
    // 指标分值合计
    zhibiaofen(){
      const that=this
      this.Fraction=0
      this.weiDuList.forEach(function(element) {
         element.zhiFraction=0
            });
      this.weiDuList.forEach(function(element) {
        if (element.child!=null) {
               element.child.forEach(function(iteam){
                element.zhiFraction+=iteam.referencescore
              })
             }
      });
      this.weiduFraction=0
      this.weiDuList.forEach(function(element) {
        that.weiduFraction+=element.zhiFraction
      });
    },
    zhuheguan(){
      this.demDialogFormVisible=false
    },
    // 组合提交
    async zhuheTi(){
      if (this.weiduFraction==100) {
        console.log(this.weiDuList)
      this.form.group=this.form.group.toString()
      this.form.parentid=this.form.parentid.toString()
      this.form.child=this.weiDuList
      // const res = await adddepartmentdutyinfo(this.form)
      // const res = await newadddepartduty(this.form)
      const res = await adddepartdutyversio(this.form)
      if (res.code === 0) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
            this.demDialogFormVisible=false
            this.form={
        group:'',
        parentid:'',
        child:[]
      }
          }
          this.weiduFraction=0
          this.form={
        group:'',
        parentid:'',
        child:[]
      }
      }else{
        this.$message({
              type: 'error',
              message: '总分不是100!'
            })
      }
      
    },
    // 提交指标权重
    async tijiao(){
      const that=this
      this.liebiaoList.forEach(function(item, index) {
            //index是循环的索引，从0开始
            that.form.targetlist.push({id:item.target,weight:parseInt(item.targetweight)})
          })
      this.form.group=this.form.group.toString()
      this.form.parentid=this.form.parentid.toString()
      const res = await addqubatch(that.form)
      console.log(that.form)
    },
    // 设置指标权重弹窗
    showIndex(){
      this.demDialogFormVisible=true
    },
    // 考核办法列表合并行
    methodSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const _row = this.methodSpanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col
        };
      }
    },
    getMethodSpanArr(data) {
      
        // data就是我们从后台拿到的数据
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.methodSpanArr.push(1);
          this.methodPos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].targetsun === data[i - 1].targetsun) {
            this.methodSpanArr[this.methodPos] += 1;
            this.methodSpanArr.push(0);
          } else {
            this.methodSpanArr.push(1);
            this.methodPos = i;
          }
        }
      }
    },
    // 查看考核办法
    async showMethod(row){
      const methodData={
        type: 1, //1：定性考核；2：定量考核
        group: row.group, //归属集团
        departmentid: row.parentid, //被考核部门
        dimension: row.dimension, //维度
        target: row.target, //考核指标
      }
      const res = await departmenttasklist(methodData)
      if (res.code==0) {
        this.methodList=res.data
        this.methodShow=true
      }
    },
    // 指标合并
    getSpanArr2(data) {
        // data就是我们从后台拿到的数据
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr2.push(1);
          this.pos2 = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].target === data[i - 1].target) {
            this.spanArr2[this.pos2] += 1;
            this.spanArr2.push(0);
          } else {
            this.spanArr2.push(1);
            this.pos2 = i;
          }
        }
      }
    },
    // 点击查看人员列表
    showUserList(row){
      this.showUser=true
      this.userlistary=row.userlistary
    },
    getSpanArr(data) {
        // data就是我们从后台拿到的数据
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr.push(1);
          this.pos = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].parentid === data[i - 1].parentid) {
            this.spanArr[this.pos] += 1;
            this.spanArr.push(0);
          } else {
            this.spanArr.push(1);
            this.pos = i;
          }
        }
      }
    },
    getSpanArr1(data) {
        // data就是我们从后台拿到的数据
      for (var i = 0; i < data.length; i++) {
        if (i === 0) {
          this.spanArr1.push(1);
          this.pos1 = 0;
        } else {
          // 判断当前元素与上一个元素是否相同
          if (data[i].dimension === data[i - 1].dimension) {
            this.spanArr1[this.pos1] += 1;
            this.spanArr1.push(0);
          } else {
            this.spanArr1.push(1);
            this.pos1 = i;
          }
        }
      }
    },
    // 合并行
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      // if (columnIndex === 0||columnIndex === 10) {
      //   const _row = this.spanArr[rowIndex];
      //   const _col = _row > 0 ? 1 : 0;
      //   return {
      //     // [0,0] 表示这一行不显示， [2,1]表示行的合并数
      //     rowspan: _row,
      //     colspan: _col
      //   };
      // }
      if (columnIndex === 10) {
        const _row = this.spanArr[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col
        };
      }
      if (columnIndex === 0||columnIndex === 1) {
        const _row = this.spanArr1[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col
        };
      }
      if (columnIndex === 2||columnIndex === 3||columnIndex === 4||columnIndex === 5||columnIndex === 6||columnIndex === 7||columnIndex === 8||columnIndex === 9) {
        const _row = this.spanArr2[rowIndex];
        const _col = _row > 0 ? 1 : 0;
        return {
          // [0,0] 表示这一行不显示， [2,1]表示行的合并数
          rowspan: _row,
          colspan: _col
        };
      }
    },
    // 删除行
    deleteRow(row){
      this.rulesCopyList.splice(row.$index,1);
    },
    // 选中指标后获取子栏目
    async selectIndex(val){
      if (val!='') {
      const from={
        id:val
      }
      const res = await gettasktargetsun(from)
      this.targetsunList=res.data
      }
    },
    // 选中子栏目后获取对应的考核细则
    async selectTargetsun(val){
      if (val!='') {
      const from={
        type: 1, //1：定性考核；2：定量考核
        targetid: this.form.target.toString(), //指标
        targetsunid: val.toString() //子栏目
      }
      const res = await gettasktargetcontary(from)
      this.rulesList=JSON.parse(JSON.stringify(res.data))
      this.rulesCopyList=JSON.parse(JSON.stringify(res.data))
      this.tableShow=true
      }
    },
    // 选中部门后显示纬度卡片
    async shouWei(val){
      if (val!='') {
            const From={
              group:this.form.group.toString(),
              parentid:this.form.parentid.toString(),
            }
            const that = this
            // const res = await departmentlistnew(From)
            const res = await newgerderpattarlist(From)
            this.weiDuList=JSON.parse(JSON.stringify(res.data))
            this.weiDuList.forEach(function(element) {
            that.$set(element, 'ordering', '')
            that.$set(element, 'zhiFraction', 0)
             if (element.child!=null) {
               element.child.forEach(function(iteam){
                that.$set(iteam, 'status', 1)
              })
             }
            });
            console.log(this.weiDuList)
      }
    },
    // 选中部门后获取指定的指标列表
    async selectDepartment(val){
      if (val!='') {
      const indexFrom={
        type:val,
        group:this.form.group.toString(),
        departmentid:this.form.parentid.toString(),
      }
      const res = await departmenttasklist(indexFrom)
      this.liebiaoList=res.data
      }
    },
    // 获取考核纬度列表
    async getDutyclasslist(){
       const res = await dutyclasslist(this.dutyClassFrom)
       this.dutyclasslist=res.data.list
    },
    // 选中的公司值
    async selectGroup(val){
      if (val!='') {
      const departmentFrom={
        id:parseInt(val)
      }
      const res = await departmentlist(departmentFrom)
      this.departmentList=res.data
      }
      
    },
    // 搜索时选中的公司值
    async searchSelectGroup(val){
      if (val!='') {
      const departmentFrom={
        id:val
      }
      const res = await departmentlist(departmentFrom)
      this.searchDepartmentList=res.data
      }
      
    },
    // 初始化部门
    async initialDepartment(){
      
      const departmentFrom={
        id:2
      }
      const res = await departmentlist(departmentFrom)
      this.departmentList=res.data
      
      
    },
    // 编辑获取选中组件值
    getEditCheckedfrom(data){
      this.editChildInfo=data
      this.editAdd.parentId=this.editChildInfo.outId
    },
    // 获取员工列表
    async getSystemadminlist(){
      const res = await getgroupuser()
      this.grouplistBackup=res.data.list
    },
    // 获取公司
    async getGrouplist(){
      const idFrom = {
        id:1
      }
      const res = await getgroupdepartmap(idFrom)
      this.companyList=res.data

    },
    // 添加获取选中组件值
    getCheckedfrom(data){
      this.addChildInfo=data
    },
    // 获取选中组件值
    getCheckedInfo(data){
      this.childInfo=data
    },
    //删除操作
    async deleteOperate(row) {
      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(async() => {
          this.deleFrom.state=3;
          this.deleFrom.key=row.key;
          const res = await onoffdepartdutyversio(this.deleFrom)
          if (res.code === 0) {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
            
             this.getVersionDataList()
          }
        })
    },
    // 新增按钮
    showAdd(){
      this.dialogFormVisible=true;
    },
    // 编辑按钮
    async showEdit(row){
      this.editFrom.outid=row.outId
      const res = await getdutyinfo(this.editFrom)
      this.editAdd = res.data
      this.editAdd.parentId=res.data.parentIdStr
      this.editChildInfo.title=res.data.parentTitle
      this.editDialogFormVisible=true;

    },
    // 开关状态监听
   async changeVal(val,id){
       console.log(val)
      this.switchFrom.key=id
      if (val==1) {
        this.switchFrom.state=1;
        const res = await onoffdepartdutyversio(this.switchFrom)
                if (res.code === 0) {
                  this.$message({
                    type: 'success',
                    message: '修改状态成功',
                    showClose: true
                  })
                  this.getVersionDataList()
                }
      } else {
        this.switchFrom.state=2;
        const res = await onoffdepartdutyversio(this.switchFrom)
                if (res.code === 0) {
                  this.$message({
                    type: 'success',
                    message: '修改状态成功',
                    showClose: true
                  })
                  this.getVersionDataList()
                }
      }
    },
    // 重置搜索条件
    onReset() {
      this.searchInfo = {
        assesstype:2,
        page: 1,
        pagesize: 10
      }
      this.childInfo={
        title:''
      }
    },
    // 条件搜索
    onSubmit() {
      // this.page = 1
      // this.pageSize = 10
      // this.searchInfo.parentId=this.childInfo.outId
      this.getVersionDataList()
    },
    // 日期时间戳转日期格式
    formatDate(nS) {     
      return new Date(parseInt(nS) * 1000).toLocaleString().replace(/:\d{1,2}$/,' ');     
    },
   
    // 提交按钮
    async enterDialog(){
      console.log("this.rulesCopyList")
      console.log(this.rulesCopyList)
      
      this.$refs.addForm.validate(async valid => {
        if (valid) {
          const that=this
          this.indexList.forEach(function(item, index) {
            //item 就是当日按循环到的对象
            //index是循环的索引，从0开始
            that.form.rationlist.push({id:item.id.toString(),unit:item.unites,cycle:item.cycle,cycleattr:item.cycleattr,userlist:item.reportlist})
          })
          this.form.group=this.form.group.toString();
          this.form.parentid=this.form.parentid.map(String);
          const res = await addration(this.form)
          if (res.code === 0) {
                  this.$message({
                    type: 'success',
                    message: '添加成功',
                    showClose: true
                  })
                }
          this.getDataList();
          this.closeDialog();
        }
      })
    },

    // 编辑提交按钮
    async editEnterDialog(){
      this.$refs.editForm.validate(async valid => {
        if (valid) {

          const res = await eitedutyinfo(this.editAdd)
          if (res.code === 0) {
                  this.$message({
                    type: 'success',
                    message: '编辑成功',
                    showClose: true
                  })
                }
          this.getDataList();
          this.editCloseDialog();
        }
      })
    },
    // 添加框关闭
    closeDialog() {
      this.initForm()
      this.dialogFormVisible = false
    },
    // 修改框关闭
    editCloseDialog() {
      this.editInitForm()
      this.editDialogFormVisible = false
    },
    // 添加重置表单
    initForm() {
      this.$refs.addForm.resetFields()
      this.form={
        type:2
      }
    },
    // 修改重置表单
    editInitForm() {
      this.$refs.editForm.resetFields()
      this.editAdd = {

      }
    },
    // 改变pageSize
    handleSizeChange(val) {
      this.searchInfo.pagesize=val
      this.getDataList(this.searchInfo)
    },
    // 改变page
    handleCurrentChange(val) {
      this.searchInfo.page=val
      this.getDataList(this.searchInfo)
    },
    // 获取初始数据
    async getDataList() {
      // let searchInfoFrom = {}
      // searchInfoFrom=JSON.parse(JSON.stringify(this.searchInfo));
      // searchInfoFrom.departmentid=searchInfoFrom.departmentid.toString()
      // const res = await departmenttasklist(searchInfoFrom)
      // if (res.data==null) {
      //   this.tableData=[]
      // }
      // this.tableData = res.data
      const from = {
        key:this.showDetailsRow.key
        }
      const res = await lookdepartdutyversio(from)
       if (res.code === 0) {
        this.tableData=res.data
        
      }
    },
    // 获取初始部门考核方案版本列表
    async getVersionDataList() {
      this.searchVersion.deaprtid=this.searchVersion.deaprtid.toString()
      const res = await departdutyplanversion(this.searchVersion)
      if (res.data==null) {
        this.versionData=[]
      }
      this.versionData = res.data
      this.searchVersion={
        group: '',
        deaprtid:'',
        year: "", //年
      }
      // this.searchVersion.deaprtid=parseInt(this.searchVersion.deaprtid )
    }
  }
}
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
