gdy_pc_8/src/point/views/setting/pk.vue

<template>
  <div>
    <!--规则提示-->
    <div class="diy_tip_bg" >
      <el-alert class="diy-tip" type="success" :closable="false">
        <p><b>团队PK通过自定义档案配置、团队参与人员等。在相同积分规则内对团队进行积分对比</b></p>
        <p><b>PK配置流程</b></p>
        <li class="headLi">指定档案在哪些积分规则分类或者积分规则内有效</li>
        <li class="headLi">创建团队,指定参与者</li>
        <p><b>团队积分构成</b></p>
        <li class="headLi">团队参与者在档案配置中积分规则内的积分总和</li>
        <li class="headLi">单独向团队录入的积分</li>
      </el-alert>
    </div>
    <div style="background-color: #fff;padding: 20px;position: relative;" class="flex-box boxMinHeight">
      <div class="left box-sizing-w scroll-bar" v-loading="menuLoading">
        <div style="text-align: center; padding: 10px 0;">
          <el-button type="primary" @click="addDoc" v-if="!manageAble">创建档案</el-button>
        </div>
        <el-menu v-if="docList.length > 0" :default-active="menuActive"  @select="activeRouter" class="el-menu-vertical-demo" >
          <el-menu-item v-for="(item, index) in docList" :key="index" :index="index.toString()" @click="refreshContent(item)">
            <span slot="title">{{item.name}}</span>
          </el-menu-item>
        </el-menu>
        <div v-if="docList.length == 0"><NoData></NoData></div>
      </div>
      <div style="overflow-x: auto" class="flex-1 scroll-bar">
        <div style="margin-bottom: 20px" >
          <el-button v-if="currentDoc" type="primary" size="small" @click="editDoc">档案配置</el-button>
          <el-button v-if="currentDoc" type="primary" size="small" @click="addTeam">添加团队</el-button>

        </div>
        <el-tabs v-if=" currentDoc && currentDoc.teams.length > 0 " v-model="activeTeam"  type="border-card" closable @tab-remove="removeTeam" v-loading="contentLoading">
          <el-tab-pane v-for="(team,index) in currentDoc.teams" :key="index" :name="index.toString()" :label="team.name" >
            <el-table :data="team.employees" v-if="activeTeam == index.toString()"> <!--v-if="activeTeam == index.toString()"防止标签切换抖动-->
              <el-table-column label="员工" align="left" width="200">
                <template slot-scope="scope">
                  <userImage class="fl" :id="scope.row.id" :user_name="scope.row.name" :img_url="scope.row.img_url" width="50px" height="50px"></userImage>
                  <span style="line-height: 50px; padding-left: 10px;">{{ scope.row.name }}</span>
                </template>
              </el-table-column>
              <el-table-column label="部门" prop="dept_list" align="center"></el-table-column>
              <el-table-column label="操作" align="center">
                <template slot="header" slot-scope="scope" >
                  <el-tooltip effect="light" placement="top" content="团队配置">
                    <el-button type="primary" size="mini" circle icon="el-icon-setting" @click="editTeam"></el-button>
                  </el-tooltip>
                  <el-tooltip effect="light" placement="top" content="添加团队积分">
                    <el-button type="success" size="mini" circle icon="el-icon-folder-add" @click="addTeamPoint"></el-button>
                  </el-tooltip>
                  <el-tooltip effect="light" placement="top" content="团队积分列表">
                    <el-button type="info" size="mini" circle icon="el-icon-document" @click="clickShowPoint" ></el-button>
                  </el-tooltip>
<!--                  <el-button type="primary" size="mini" round @click="editTeam">团队配置</el-button>-->
<!--                  <el-button type="primary" size="mini" round>添加积分</el-button>-->
<!--                  <el-button type="primary" size="mini" round>团队积分</el-button>-->
                </template>
                <template slot-scope="scope">
                  <el-button @click="dropEmployee(team.id,scope.row.id,scope.row.name)" size="medium" type="danger" >移除出团队</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
        </el-tabs>
        <div v-if="!currentDoc || currentDoc.teams.length === 0"><NoData></NoData></div>
      </div>
    </div>

<!--  创建/编辑档案  -->
    <el-dialog :title="isUpdateDoc ? '编辑档案': '创建档案' " width="700px" top="10vh" :visible.sync="showDoc" :close-on-click-modal="false" >
      <el-form ref="docForm" :model="docForm" :rules="docFormValidateRules" label-width="100px" @submit.native.prevent style="margin: 0 auto;">
        <el-form-item label="档案名" prop="name" :required="true">
          <el-input v-model="docForm.name" maxlength="10" auto-complete="off" show-word-limit placeholder="请输入档案名" ></el-input>
        </el-form-item>
        <el-form-item label="积分规则" :required="true" >
          <el-select v-model="docForm.ruleType" style="margin-bottom: 6px;width: 400px;" >
            <el-option label="全部" :value="1"></el-option>
            <el-option label="指定规则分类" :value="2"></el-option>
            <el-option label="指定规则" :value="3"></el-option>
          </el-select>

          <el-cascader
            style="width: 400px;"
            v-if="docForm.ruleType == 2"
            v-model="rule_list_value"
            ref="ruleCascader"
            :show-all-levels="false"
            filterable
            :options="rule_list"
            :props="{children:'child',label: 'name',value: 'id', checkStrictly: true,multiple: true}"
          ></el-cascader>

          <div v-if="docForm.ruleType == 3" style="position: relative;"  >
            <div class="inputBox" @click="showItem = true">
              <span v-if="selectItem.length > 0">已选择了{{selectItem.length}}条</span>
              <span v-else style="color: #909399;">请选择</span>
            </div>
          </div>
          <div>
            <span v-if="docForm.ruleType==1">统计全部积分事件，不包含基础分和工龄分</span>
            <span v-if="docForm.ruleType==2">包含指定规则分类的积分，不包含基础分和工龄分</span>
            <span v-if="docForm.ruleType==3">按已指定的积分规则进行积分统计并排名，不包含基础分和工龄分</span>
          </div>
        </el-form-item>
      </el-form>
      <div class="flex-box-ce">
        <el-button type="danger" v-if="isUpdateDoc" :loading="commitLoading" @click="deleteDoc">删 除</el-button>
        <div class="flex-1"></div>
        <el-button type="primary"  :loading="commitLoading" @click="commitDocForm('docForm')" >提 交</el-button>
      </div>

    </el-dialog>

<!--  创建编辑团队  -->
    <el-dialog :title="isUpdateTeam ? '编辑团队' : '创建团队'" width="700px" top="10vh" :visible.sync="showTeam" :close-on-click-modal="false" >
      <el-form ref="teamForm" :model="teamForm" :rules="teamFormValidateRules" label-width="100px" @submit.native.prevent style="margin: 0 auto;" >
        <el-form-item label="团队名" prop="name" :required="true">
          <el-input v-model="teamForm.name" maxlength="10" auto-complete="off" show-word-limit placeholder="请输入团队名" ></el-input>
        </el-form-item>
        <el-form-item label="参与人员" :required="true">
          <div class="cursor" style="border-radius: 4px;border: 1px solid #dcdfe6;line-height: 34px;width: 400px;padding: 0 15px;" @click="showEmployeeSelect">
            <div class="flex-box-ce fontColorB font-flex-word" v-if="employees_selected.employee.length>0">
              <span v-for="item in employees_selected.employee" :key="item.id"> {{item.name}},</span>
            </div>
            <div v-else style="color: #C0C4CF;">请选择参与人员</div>
          </div>
        </el-form-item>
      </el-form>
      <div class="flex-box-ce">
        <el-button type="danger" v-if="isUpdateTeam" :loading="commitLoading" @click="deleteTeam">删 除</el-button>
        <div class="flex-1"></div>
        <el-button type="primary"  :loading="commitLoading" @click="commitTeamForm('teamForm')" >提 交</el-button>
      </div>
    </el-dialog>

<!--  添加团队积分  -->
    <el-dialog title="添加团队积分" width="700px" top="10vh" :visible.sync="showAddPoint" :close-on-click-modal="false" >
      <el-form ref="pointForm" :model="pointForm" :rules="pointFormValidateRules" label-width="100px" @submit.native.prevent style="margin: 0 auto;">
        <el-form-item label="积分" prop="point" :required="true">
          <el-input-number v-model="pointForm.point" :min="-999999" :max="999999" ></el-input-number>
        </el-form-item>
        <el-form-item label="日期" prop="date" :required="true">
          <el-date-picker
            v-model="pointForm.date"
            type="date"
            value-format="yyyy-MM-dd"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="说明" prop="remark" >
          <el-input
            placeholder="积分说明"
            type="textarea"
            v-model="pointForm.remark"
            maxlength="100"
            rows="4"
            show-word-limit
            clearable></el-input>
        </el-form-item>
        <div class="flex-box-ce">
          <div class="flex-1"></div>
          <el-button type="primary"  :loading="commitLoading" @click="commitPointForm('pointForm')" >提 交</el-button>
        </div>
      </el-form>
    </el-dialog>

    <el-dialog title="团队积分事件" width="700px" top="10vh" :visible.sync="showPoint" :close-on-click-modal="false" >
      <el-form :inline="true" @submit.native.prevent >
        <el-date-picker
          v-model="pointSearchDateScope"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          value-format="yyyy-MM-dd"
          editable
        ></el-date-picker>
      </el-form>
      <el-table :data="pointListData.list" style="width: 100%" v-loading="pointListLoading" >
        <el-table-column label="积分" align="center" prop="point"></el-table-column>
        <el-table-column label="日期" align="center" prop="date"></el-table-column>
        <el-table-column label="说明" align="center" prop="remark"></el-table-column>
        <template slot="empty">
          <NoData></NoData>
        </template>
      </el-table>
      <el-pagination
        @current-change="handlePointPageChange"
        :current-page="pointSearchForm.page"
        :page-size="pointSearchForm.pageSize"
        :total="pointListData.total"
      ></el-pagination>
    </el-dialog>

    <EmployeeSelector
      title="选择成员"
      :selected="employees_selected"
      :close_clear_data="false"
      :visible.sync="showEmployeeSelector"
      @confirm="move_employee_confirm"
      :isChecKedAll="true"
      :max="0"
    />

    <SelectRule :isAll="true" :visible.sync="showItem" @confirm="ruleConfirm" :ptId="docForm.ptId" :selectItems="selectItem"></SelectRule>
  </div>

</template>


<script>
import SelectRule from "@/components/SelectRule.vue";
import EmployeeSelector from "@/components/EmployeeSelector.vue";
import Template from "../../../examine/components/Template.vue";
export default {
  components: {Template, SelectRule,EmployeeSelector},
  data(){
    return {
      manageAble: this.$supremeAuthority('dept_manager') || this.$supremeAuthority('employee'),
      menuActive: '0',
      menuLoading: false,
      contentLoading: false,
      currentDoc: null,
      currentTeam: null,
      activeTeam: 0,
      docList: [],
      isUpdateDoc: false,
      isUpdateTeam: false,
      showDoc: false,
      showTeam: false,
      showEmployeeSelector: false,
      docForm:{
        docId:0,
        name:'',
        ptId:3,
        ruleType:1,
        rules:[],
        items:[],
      },
      docFormValidateRules:{
        name: [
          {required: true,message:'请输入档案名称'},
          { min: 3, max: 10, message: '长度在 3 到 10 个字符'}
        ]
      },
      teamFormValidateRules:{
        name: [
          {required: true,message:'请输入档案名称'},
          { min: 3, max: 10, message: '长度在 3 到 10 个字符'}
        ]
      },
      // 规则分类
      rule_list: [],
      rule_tree:[],
      rule_list_value:[],
      showItem:false,
      selectItem:[],
      commitLoading:false,
      teamForm:{
        docId:0,
        teamId:0,
        name:"",
        employees:[]
      },
      employees_selected: { employee: [], dept: [] },
      showAddPoint:false,
      showPoint:false,
      pointForm:{
        teamId:0,
        teamName:'',
        point:0,
        date:"",
        remark:""
      },
      pointFormValidateRules:{
        point:[
          {type:'integer'},
          {required:true,message:"必须填写积分"},
        ],
        remark:[
          {type:'string'},
          {min:0,max:100,message:"最多100个字符"}
        ],
        date:[
          {type:'string'},
          {required:true,message:'积分日期必须填写'}
        ]
      },
      pointSearchDateScope:[],
      pointSearchForm:{
        timeScope:[],
        teamId:0,
        docId:0,
        page:1,
        pageSize:10
      },
      pointListLoading:false,
      pointListData:{
        list:[],
        total:0
      }
    }
  },
  methods: {
    initDocForm(){
      this.docForm.docId = 0;
      this.docForm.name = '';
      this.docForm.ruletype = 1;
      this.docForm.rules = [];
      this.docForm.items = [];
      this.selectItem = [];
      this.rule_list_value = [];
    },
    initTeamForm(){
      this.teamForm.docId = this.currentDoc.id;
      this.teamForm.teamId = 0;
      this.teamForm.name = '';
      this.teamForm.employees = [];
      this.employees_selected = { employee: [], dept: [] };
    },
    initPointForm(){
      this.pointForm.teamName = '';
      this.pointForm.point = 0;
      this.pointForm.teamId = 0;
      this.pointForm.remark = '';
      this.pointForm.date = '';
    },
    initPointListData(){
      this.pointListData = {
        list:[],
        total:0
      }
    },
    addDoc(){
      //封装表单数据
      this.initDocForm()

      //打开表单弹窗
      this.isUpdateDoc = false;
      this.showDoc = true;
    },
    editDoc(){
      //封装表单数据
      this.docForm.docId = this.currentDoc.id;
      this.docForm.name = this.currentDoc.name;
      if (this.currentDoc.items.length > 0){
        this.docForm.ruleType = 3;
        this.docForm.rules = [];
        this.docForm.items = this.currentDoc.items.map(e => e.id)
        this.selectItem = this.currentDoc.items.map(e => {
          return {
            id:e.id,
            remark:e.name
          }
        })
      }else if (this.currentDoc.rules.length > 0){
        this.docForm.ruleType = 2;
        this.docForm.items = [];
        this.docForm.rules = this.currentDoc.rules.map(e => e.id)
        let rule_list_value = [];
        if(this.currentDoc.rules.length > 0){
          this.docForm.rules.forEach(id => {
            let arr = [];
            this.returnRuleVal(id,arr);
            rule_list_value.push(arr);
            this.rule_list_value = rule_list_value;
          })
        }
      }else {
        this.docForm.ruleType = 1;
        this.docForm.rules = [];
        this.docForm.rules = [];
        this.selectItem = [];
        this.rule_list_value = [];
      }
      //打开表单弹窗
      this.isUpdateDoc = true;
      this.showDoc = true;
    },
    deleteDoc(){
      this.$confirm('确认删除当前档案吗?','删除档案',{confirmButtonText:'确定',cancelButtonText:'取消',type:"warning"}).then(() => {
          this.commitDeleteDoc();
      })
    },
    getDocList(){
      this.menuLoading = true;
      this.$axiosUser('get','/api/pro/pk/doc/list').then(res => {
         this.docList = res.data.data.list;
         if(this.docList.length > 0 && !this.currentDoc){
           this.refreshContent(this.docList[this.menuActive]);
         }
      }).finally(()=>{
        this.menuLoading = false;
      })
    },
    //获取分类规则
    get_rule_trees() {
      let params = {pt_id:3,cycle_type:1};
      this.$axiosUser('get', '/api/pro/integral/rule/trees', params).then(res => {
        this.rule_list = this.getTreeData(res.data.data.rule_tree);
        this.rule_tree = this.flatten(res.data.data.rule_tree);
      })
    },
    // 递归判断列表，把最后的child设为undefined
    getTreeData(data) {
      for (var i = 0; i < data.length; i++) {
        if (data[i].child.length < 1) {
          // child若为空数组，则将child设为undefined
          data[i].child = undefined;
        } else {
          // child若不为空数组，则继续 递归调用 本方法
          this.getTreeData(data[i].child);
        }
      }
      return data;
    },
    flatten(arr) {
      return arr.reduce((result, item) => {
        return result.concat(item, Array.isArray(item.child) ? this.flatten(item.child) : []);
      }, []);
    },
    returnRuleVal(rule_id,arr){
      arr.unshift(rule_id)
      let list = this.rule_tree.filter(x => x.id == rule_id)
      if(list[0]&&list[0].pid != 0){
        this.returnRuleVal(list[0].pid,arr)
      }
      return arr;
    },
    activeRouter(index, indexPath){
      this.menuActive = index.toString();
    },
    //加载右边内容页
    refreshContent(doc){
      if (!doc || !doc.id) return;
      this.currentTeam = null;
      this.currentDoc = null;
      this.contentLoading = true;
      this.$axiosUser('get','/api/pro/pk/doc/info',{doc_id:doc.id})
        .then(res => {
          this.currentDoc = res.data.data;
          this.activeTeam = 0;    //只能在这里设置不能在开头初始化
          if (this.currentDoc.teams.length > 0) this.currentTeam = this.currentDoc.teams[0];
        })
        .finally(() => {
          this.contentLoading = false;
        })
    },
    addTeam(){
      //封装表单数据
      this.initTeamForm();
      //打开表单弹窗
      this.isUpdateTeam = false;
      this.showTeam = true;
    },
    editTeam(){
      //封装表单数据
      this.teamForm.docId = this.currentDoc.id;
      this.teamForm.teamId = this.currentTeam.id;
      this.teamForm.name = this.currentTeam.name;
      this.teamForm.employees = this.currentTeam.employees.map(e => e.id);
      this.employees_selected.employee = this.currentTeam.employees;

      //打开表单弹窗
      this.isUpdateTeam = true;
      this.showTeam = true;
    },
    deleteTeam(){
      this.$confirm('确认删除当前团队吗?','删除团队',{
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.commitDeleteTeam(this.teamForm.teamId);
      })
    },
    removeTeam(i){
      if (this.currentDoc.teams.length < i) return;
      let team = this.currentDoc.teams[i];
      let message = '确认删除团队<<' + team.name + '>>吗?';
      this.$confirm(message,'删除团队',{
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.commitDeleteTeam(team.id)
      })
    },
    commitDeleteTeam(teamId){
      this.commitLoading = true;
      this.$axiosUser('POST','/api/pro/pk/team/d',{team_id:teamId})
        .then(res => {
          this.$message.success(res.data.msg);
          this.isUpdateTeam = false;
          this.showTeam = false;
          this.initTeamForm();
          this.refreshContent(this.currentDoc);
        })
        .finally(() => {
          this.commitLoading = false;
        })
    },
    dropEmployee(teamId,employeeId,employeeName){
      let message = "确认将<<" + employeeName + ">>移出团队吗?"
      this.$confirm(message,"移出团队",{confirmButtonText:"确定",cancelButtonText:"取消",type:"warning"})
        .then(() => {
          this.commitDeleteEmployee(teamId,employeeId);
        })
    },
    //选择规则
    ruleConfirm(rules) {
      if (rules.length > 0) {
        this.docForm.items = rules.map(e=> e.id);
      } else {
        this.docForm.items = [];
      }
      this.selectItem = rules;
    },
    commitDocForm(formName) {
      this.$refs[formName].validate(valid => {
        if (!valid) return;
        if (this.isUpdateDoc){
          this.commitUpdateDoc();
        }else{
          this.commitCreateDoc();
        }
      })
    },
    commitCreateDoc(){
      let params = {
        name:this.docForm.name,
        rules:[],
        items:[]
      };
      if (this.docForm.docId > 0){
        this.$message.error("表单状态异常");
        return;
      }
      if(this.docForm.ruleType === 2) {
        if (this.docForm.rules.length === 0){
          this.$message.error("选择规则分类");
          return;
        }
        params.rules = this.docForm.rules;
      }else if(this.docForm.ruleType === 3){
        if (this.docForm.items.length === 0){
          this.$message.error("请选择规则");
          return;
        }
        params.items = this.docForm.items;
      }

      this.commitLoading = true
      this.$axiosUser('POST','/api/pro/pk/doc/c',params).then(res => {
          this.$message.success(res.data.msg);
          this.showDoc = false;
          this.initDocForm();
          this.getDocList();
      })
        .finally(() => {
          this.commitLoading = false
        });
    },
    commitUpdateDoc(){
      let params = {
        doc_id:this.docForm.docId,
        name:this.docForm.name,
        rules:[],
        items:[]
      }
      if (this.docForm.docId <= 0){
        this.$message.error("表单状态异常");
        return;
      }
      if(this.docForm.ruleType === 2) {
        if (this.docForm.rules.length === 0){
          this.$message.error("选择规则分类");
          return;
        }
        params.rules = this.docForm.rules;
      }else if(this.docForm.ruleType === 3){
        if (this.docForm.items.length === 0){
          this.$message.error("请选择规则");
          return;
        }
        params.items = this.docForm.items;
      }
      this.commitLoading = true
      this.$axiosUser('POST','/api/pro/pk/doc/e',params).then(res => {
        this.$message.success(res.data.msg);
        this.showDoc = false;
        this.initDocForm();
        this.getDocList();
      })
        .finally(() => {
          this.commitLoading = false
        });

    },
    // 选人组件提交
    move_employee_confirm(data) {
      this.teamForm.employees = data.employee.map(element => {
        return element.id
      });
      this.employees_selected.employee = data.employee;
    },
    showEmployeeSelect(){
      this.showEmployeeSelector = true;
    },
    commitTeamForm(formName){
      this.$refs[formName].validate(valid => {
        if (!valid) return;
        if (this.isUpdateTeam){
          this.commitUpdateTeam();
        }else {
          this.commitCreateTeam();
        }
      })
    },
    commitUpdateTeam(){
      let params = {
        team_id:this.teamForm.teamId,
        name:this.teamForm.name,
        employees:this.teamForm.employees
      }

      this.commitLoading = true;
      this.$axiosUser('POST','/api/pro/pk/team/e',params).then(res => {
        this.$message.success(res.data.msg);
        this.showTeam = false;
        this.initTeamForm();
        this.refreshContent(this.currentDoc)
      })
        .finally(() => {
          this.commitLoading = false
        });
    },
    commitCreateTeam(){
      let params = {
        doc_id: this.teamForm.docId,
        name: this.teamForm.name,
        employees:this.teamForm.employees
      }

      this.$axiosUser('POST','/api/pro/pk/team/c',params).then(res => {
        this.$message.success(res.data.msg);
        this.showTeam = false;
        this.initTeamForm();
        this.refreshContent(this.currentDoc)
      })
        .finally(() =>{
          this.commitLoading = false
        });
    },
    commitDeleteEmployee(teamId,employeeId){
      this.commitLoading = true;
      this.$axiosUser('POST','/api/pro/pk/team/employee/d',{team_id:teamId,employee_id:employeeId})
        .then(res => {
          this.$message.success(res.data.msg);
          this.refreshContent(this.currentDoc);
        })
        .finally(()=>{
          this.commitLoading = false
        })
    },
    commitDeleteDoc(){
      this.commitLoading = true;
      this.$axiosUser('POST','/api/pro/pk/doc/d',{doc_id:this.currentDoc.id})
        .then(res => {
          this.$message.success(res.data.msg);
          this.showDoc = false;
          this.currentDoc = null;
          this.currentTeam = null;
          this.initDocForm();
          this.getDocList();
        })
        .finally(() => {
          this.commitLoading = false;
        })
    },
    addTeamPoint(){
      this.pointForm.teamId = this.currentTeam.id;
      this.pointForm.teamName = this.currentTeam.name;
      this.showAddPoint = true;
      this.pointForm.date = this.$moment(new Date()).format('YYYY-MM-DD');
    },
    commitPointForm(formName){
      this.$refs[formName].validate(valid => {
        if (!valid) return;
        this.commitLoading = true;
        let params = {
          team_id: this.pointForm.teamId,
          point: this.pointForm.point,
          date: this.pointForm.date,
          remark: this.pointForm.remark
        }

        this.$axiosUser('POST','/api/pro/pk/team/point',params)
          .then(res => {
            this.$message.success(res.data.msg);
            this.showAddPoint = false;
            this.initPointForm();
          })
          .finally(()=>{
            this.commitLoading = false;
          })
      })
    },
    initPointSearchDateRange(){
      //初始化积分列表时间区间
      const pkStartData = new Date();
      const pkEndData = new Date();
      pkStartData.setTime(pkStartData.getTime() - 3600 * 1000 * 24 * 30);
      this.pointSearchDateScope[0] = this.$moment(pkStartData).format('YYYY-MM-DD');
      this.pointSearchDateScope[1] = this.$moment(pkEndData).format('YYYY-MM-DD');
      this.pointSearchForm.timeScope = this.pointSearchDateScope;
    },
    initPointSearchForm(){
      this.initPointSearchDateRange();
      this.pointSearchForm.teamId = this.currentTeam.id;
      this.pointSearchForm.docId = this.currentDoc.id;
      this.pointSearchForm.page = 1;
      this.pointSearchForm.pageSize = 10;
    },
    handlePointPageChange(page){
      this.pointSearchForm.page = page;
      this.getPointList();
    },
    getPointList(){
      if (this.pointSearchForm.teamId === 0 || this.pointSearchForm.docId === 0 || !this.pointSearchForm.timeScope || this.pointSearchForm.timeScope.length !== 2) {
        this.initPointListData();
        return;
      }
      this.pointListLoading = true;
      let params = {
        doc_id: this.pointSearchForm.docId,
        team_id: this.pointSearchForm.teamId,
        page: this.pointSearchForm.page,
        page_size: this.pointSearchForm.pageSize,
        start_date: this.pointSearchForm.timeScope[0],
        end_date: this.pointSearchForm.timeScope[1]
      }
      this.$axiosUser('get','/api/pro/pk/team/point/list',params)
        .then(res => {
          this.pointListData = res.data.data;
        })
        .finally(()=>{
          this.pointListLoading = false;
        })
    },
    clickShowPoint(){
      //初始化积分搜索数据
      this.initPointSearchForm();
      this.getPointList();
      this.showPoint = true;
    }


  },
  created() {
    this.get_rule_trees();

  },
  watch:{
    activeTeam(value){
      this.currentTeam = this.currentDoc.teams.length > value ? this.currentDoc.teams[value] : null;
    },
    rule_list_value(val){
      if(val.length > 0){
        this.docForm.rules = val.map(e => e[e.length - 1]);
      }else {
        this.docForm.rules = [];
      }
    },
    pointSearchDateScope(val){
      this.pointSearchForm.timeScope = val ? val : [];
      this.getPointList();
    }
  },
  mounted() {
    this.getDocList();
  }

}

</script>

<style scoped lang="scss">
.diy_tip_bg {
  background: #f5f6f9;
  overflow: hidden;
  .diy-tip {
    margin-bottom: 10px;
    border: 1px solid #67c23a;
    padding: 20px 16px;
    p {
      color: #67c23a !important;
      font-size: 15px;
      margin: 0 !important;
      padding-bottom: 4px;
    }
  }
}
.headLi {
  padding: 4px;
  list-style: disc;
  font-size: 14px;
}

.left{
  padding:10px;
  overflow: auto;
  max-height: 800px;
}

.boxMinHeight{
  background-color: #fff;
}

.inputBox {
  height: 36px;
  line-height: 36px;
  padding-right: 30px;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: none;
  border-radius: 4px;
  border: 1px solid #dcdfe6;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #606266;
  display: inline-block;
  font-size: inherit;
  width: 400px;
  outline: 0;
  padding: 0 15px;
  cursor: pointer;
  -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
}

</style>