jiaoyuju/ruoyi-ui/src/views/system/eport/index.vue

<template>
  <div class="app-container">
    <div class="app-containergt"  style="padding: 0;">
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            @click="handleAdd"
          >添加报表</el-button>
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="mini"
            :disabled="multiple"
            @click="handleDelete"
          >删除</el-button>
        </el-col>
        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
      </el-row>
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
        <el-form-item label="报表标题" prop="reportName">
          <el-input
            v-model="queryParams.reportName"
            placeholder="请输入报表标题"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="开始时间：" prop="sTime">
          <el-date-picker
            v-model="queryParams.sTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="截止时间：" prop="eTime">
          <el-date-picker
            v-model="queryParams.eTime"
            type="datetime"
            value-format="yyyy-MM-dd HH:mm:ss"
            format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="状态" prop="status">
          <el-select v-model="queryParams.status" placeholder="状态" clearable size="small">
            <el-option
              v-for="dict in statusOptions"
              :key="dict.dictValue"
              :label="dict.dictLabel"
              :value="dict.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
        </el-form-item>
      </el-form>

      <el-table
        v-loading="loading"
        :data="reportList"
        row-key="id"
        default-expand-all
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
     @selection-change="handleSelectionChange" >
       <el-table-column type="selection" width="55" align="center" />
        <el-table-column prop="id" label="序号" width="60"></el-table-column>
        <el-table-column prop="reportName" label="标题" width="200" align="center"></el-table-column>
        <el-table-column label="开始时间" align="center" prop="startTime" width="180">
          <!-- <template slot-scope="scope">
            <span>{{ parseTime(scope.row.startTime) }}</span>
          </template> -->
        </el-table-column>
        <el-table-column label="截止时间" align="center" prop="endTime" width="180">
          <!-- <template slot-scope="scope">
            <span>{{ parseTime(scope.row.endTime) }}</span>
          </template> -->
        </el-table-column>
        <el-table-column label="当前状态" align="center" prop="reportStatus" width="100">
          <template slot-scope="scope">
            <span :class="[scope.row.reportStatus == 1 ? 'jheuy' : scope.row.reportStatus == 2? 'neuiq' : 'bgeyy']">{{scope.row.reportStatus == 1 ? '未开始' : scope.row.reportStatus == 2? '进行中' : '已结束' }}</span>
          </template>
          </el-table-column>
        <!-- //走字典 -->
       <el-table-column label="状态" align="center" key="status" >
         <!-- v-if="columns[5].visible" -->
         <template slot-scope="scope">
           <el-switch
             v-model="scope.row.status"
             active-value="2"
             inactive-value="1"
             @change="handleStatusChange(scope.row)"
           ></el-switch>
         </template>
       </el-table-column>
        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdatety(scope.row)"
              v-hasPermi="['sys_dept:M']"
            >编辑</el-button>
            <el-button
              size="mini"
              type="text"
              icon="el-icon-view"
              @click="handleAddchak(scope.row)"
              v-hasPermi="['sys_dept:A']"
            >查看</el-button>
            <!-- <el-button
              size="mini"
              type="text"
              icon="el-icon-upload2"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['sys_dept:A']"
            >上传</el-button> -->
            <el-button
              v-if="scope.row.id != 0"
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              v-hasPermi="['sys_dept:D']"
            >删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getReportList"
      />

      <!-- 添加或修改部门对话框 -->
      <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="open" width="900px" append-to-body >
        <el-form ref="form" :model="form" :rules="rules" label-width="120px">
          <el-row>
            <el-col :span="24" v-if="!xiug">
              <el-form-item label="报表名称：" prop="reportName">
                <el-input v-model="form.reportName" placeholder="请输入报表名称" />
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="!xiug">
              <el-form-item label="报表设计器：" prop="reportId" :rules="[
      { required: true, message: '请选择报表设计器', trigger: 'blur' },
    ]">
                <treeselect v-model="form.reportId" :options="deptOptionstwofr" :normalizer="normalizerghy" placeholder="选择报表设计器" />
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="!xiug">
              <el-form-item label="参与人员：" prop="userName">
                 <!-- <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择报表设计器" /> -->
                 <el-button style="padding: 9px 15px; font-size: 12px; border-radius: 3px; margin-bottom: 5px;" size="small" type="primary"  @click="changeren">选择人员</el-button>
                 <!-- slot="prepend" -->
                <el-input v-model="messageReun"  :disabled="true" type="textarea" >

                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item :label="xiug == true? '上传报表：' : '表格模板：'" prop="orderNum">
                <el-upload
                 :disabled="false" class="upload-demo" :headers="{Authorization: 'Bearer ' + getToken()}"
                 :action="process + '/boman-file/upload'" :on-change="handleChangert"
                 :on-success="upImageFn"
                 :on-error="err"
                 :on-remove="reseImage"
                 :file-list="configtwo"
                 :on-preview="handlePictureCardPreview"
                 :before-upload="befors"
                 :multiple="false" >
                 <el-button size="small" type="primary">点击上传</el-button>
                 <div slot="tip" class="el-upload__tip" style="color: red; font-size: 14px;">只能上传xls/xlsx文件，且不超过50MB</div>
                </el-upload>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="!xiug">
              <el-form-item label="开始时间：" prop="startTime" :rules="[
      { required: true, message: '请选择开始时间', trigger: 'blur' },
    ]">
                <el-date-picker
                      v-model="form.startTime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-if="!xiug">
              <el-form-item label="截止时间：" prop="endTime" :rules="[
      { required: true, message: '请选择截止时间', trigger: 'blur' },
    ]">
                <el-date-picker
                      v-model="form.endTime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>

            <el-col :span="24" v-if="!xiug">
              <el-form-item label="注意事项：">
                <el-input   type="textarea"
    :rows="2" v-model="form.remark" placeholder="请输入注意事项" style="width: 100%;" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitForm">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>
      <!-- 分配角色数据权限对话框 -->
      <el-dialog   :close-on-click-modal="false" title="选择人员" :visible.sync="modalShow" width="980px" append-to-body>
        <!-- <Flowshoe  :instanceId="instanceId"></Flowshoe> -->
        <div class="tab_bott">
          <div class="tabBot_oje">
            <el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
              <!-- :setCheckedKeys='setCheckedKeys' :getCheckedKeys = "getCheckedKeys" -->
              <el-tab-pane label="按部门" name="first">
                <div class="head-container">
                  <el-input
                    v-model="deptName"
                    placeholder="请输入部门名称"
                    clearable
                    size="small"
                    prefix-icon="el-icon-search"
                    style="margin-bottom: 20px"
                  />
                </div>
                <div class="head-container">
                  <el-tree
                    :data="deptOptions"
                    :expand-on-click-node="false"
                    :props="defaultProps"
                    :filter-node-method="filterNode"
                    ref="tree"
                    default-expand-all
                    @node-click="handleNodeClick"
                  />
                </div>
              </el-tab-pane>
              <el-tab-pane label="按角色" name="second" style="height: 400px;">
                 <treeselect v-model="form.parentId" :options="deptOptionstwo" :normalizer="normalizer" :flat="true" :maxHeight="150" @select="djieskle" placeholder="点击选择角色" />
              </el-tab-pane>
              <el-tab-pane label="按组" name="third" style="height: 400px;">
               <treeselect  v-model="form.parentIdty" :options="deptOptionsthre" :normalizer="normalizerty" :flat="true" @select="djieskletwo" :maxHeight="350" placeholder="点击选择组" />
              </el-tab-pane>
            </el-tabs>
          </div>
          <div class="tabBot_two">
            <el-card class="box-card box-cardtt" shadow="always">
                <div slot="header" class="clearfix">
                  <span>人员</span>
                 <el-button style=" float: right;  padding: 3px 10px;" type="danger" plain @click="eledelte">删除</el-button>
                 <el-button style=" float: right; padding: 3px 10px;margin-right: 20px;" type="primary" plain @click="quande">全选</el-button>
                </div>
                <ul class="infinite-list infinite-listty" v-infinite-scroll="load" style="overflow:auto">
                    <li
                      v-for="(item, index) in liseh"
                      :class="[ quandet==true? 'infinite-list-itemty infinite-list-itemss' : item.id == idneese.id ? 'infinite-list-itemty infinite-list-itemss' : 'infinite-list-itemty']"
                      :key="index"
                      @click="reyantt(item)"
                    >
                      {{ item.nickName }}
                    </li>
                  </ul>
                </el-card>
                <el-card class="box-card box-cardtt" shadow="always">
                  <div slot="header" class="clearfix">
                    <span>已选择</span>
                    <el-button style="float: right; padding: 3px 0" type="text" @click = 'determine'>确定</el-button>
                  </div>
                  <ul class="infinite-list infinite-listty" v-infinite-scroll="load" style="overflow:auto">
                    <li v-for="item in lisehtwo" @click="lidele(item)" :key="item.id" class="infinite-list-item">
                      {{ item.nickName }}
                      <img src="../../../assets/images/dele.png" alt="" class="index_navTimeimg" />
                    </li>
                  </ul>
                </el-card>
          </div>
        </div>
      </el-dialog>

    <!-- 修改 -->
    <el-dialog :close-on-click-modal="false" :title="title" :visible.sync="opentr" width="900px" append-to-body >
        <el-form ref="formty" :model="formty" :rules="rulesty" label-width="120px">
          <el-row>
            <el-col :span="24" >
              <el-form-item label="报表名称：" prop="reportName" >
                <el-input v-model="formty.reportName" placeholder="请输入报表名称" />
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item label="报表设计器：" prop="reportId" :rules="[
      { required: true, message: '请选择报表设计器', trigger: 'blur' },
    ]">
                <treeselect v-model="formty.reportId" :options="deptOptionstwofr" :normalizer="normalizerghy" placeholder="选择报表设计器" />
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item label="参与人员：" prop="userName">
                 <!-- <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择报表设计器" /> -->
                <el-button style="padding: 9px 15px; font-size: 12px; border-radius: 3px; margin-bottom: 5px;" size="small" type="primary"  @click="changeren">选择人员</el-button>
                 <!-- slot="prepend" -->
                <el-input v-model="messageReun"  :disabled="true" type="textarea" />
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item label="'表格模板："  prop="repUploadFile" :rules="[
      { required: true, message: '请上传表格模板', trigger: 'blur' },
    ]">
                <el-upload
                 :disabled="false" class="upload-demo" :headers="{Authorization: 'Bearer ' + getToken()}"
                 :action="process + '/boman-file/upload'" :on-change="handleChangert"
                 :on-success="upImageFn"
                 :on-error="err"
                 :on-remove="reseImage"
                 :file-list="configtwo"
                 :on-preview="handlePictureCardPreview"
                 :before-upload="befors"
                 :multiple="false" >
                 <el-button size="small" type="primary">点击上传</el-button>
                 <div slot="tip" class="el-upload__tip" style="color: red; font-size: 14px;">只能上传xls/xlsx文件，且不超过50MB</div>
                </el-upload>
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item label="开始时间：" prop="startTime" :rules="[
      { required: true, message: '请选择开始时间', trigger: 'blur' },
    ]">
                <el-date-picker
                      v-model="formty.startTime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                      format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="24" >
              <el-form-item label="截止时间：" prop="endTime" :rules="[
      { required: true, message: '请选择截止时间', trigger: 'blur' },
    ]">
                <el-date-picker
                      v-model="formty.endTime"
                      type="datetime"
                      value-format="yyyy-MM-dd HH:mm:ss"
                       format="yyyy-MM-dd HH:mm:ss"
                      placeholder="选择日期">
                </el-date-picker>
              </el-form-item>
            </el-col>

            <el-col :span="12" >
              <el-form-item label="注意事项：">
                <el-input   type="textarea"
    :rows="2" v-model="formty.remark" placeholder="请输入注意事项" style="width: 100%;" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitFormty">确 定</el-button>
          <el-button @click="cancel">取 消</el-button>
        </div>
      </el-dialog>

    </div>
  </div>
</template>

<script>
import { listDept,   updateDept, listDeptExcludeChild } from "@/api/system/dept";
import { tistDept,addDeptiu,reportList,reportListrt,delDept,addDeptiugt,getDept,addDeptiyuit } from "@/api/system/tatementsetr";
import { listRoles,listIndex,   delRole, addRole,addbjectSave, updateRole, exportRole, dataScope, changeRoleStatus, buent,issdanelist,issdaneid,weiduhegw,addbjectSawen } from "@/api/system/isses";
import { treeselect } from "@/api/system/dept";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import {
    getToken
  } from "@/utils/auth";
  import { group , getRole, getPersonnel, getMembers,delRoleses } from '@/api/system/election';
  import { listRole } from "@/api/system/role";
export default {
  name: "Dept",
  components: { Treeselect },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 表格树数据
      reportList: [],
      deptOptionstwofr:[],
      // 总条数
      total: 0,
      opentr:false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 部门树选项
      deptOptions: [],
      // 角色
      deptOptionstwo:[],
      deptOptionsthre:[],
      configtwo: [],
      // 弹出层标题
      title: "添加报表",
      process: process.env.VUE_APP_BASE_API,
      // 是否显示弹出层
      open: false,
      // 状态数据字典
      statusOptions: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        reportName: undefined,
        startTime: undefined,
        endTime: undefined,
        status: undefined
      },
      queryParamsjuegt:{
       pageNum:1,
       pageSize:1000,
       reportType:'datainfo'
      },
      deptName:undefined,
      // 表单参数
      form: {
        personnels:[{
           deptId: 0,
           deptName: "",
           userId: 0,
           userName: ""
        }]
      },
      formty:{

      },
      activeName:'first',
      modalShow:false,
      // 表单校验
      rules: {
        reportName: [
          { required: true, message: "报表名称不能为空", trigger: "blur" }
        ],

      },
      rulesty:{
        reportName: [
          { required: true, message: "报表名称不能为空", trigger: "blur" }
        ],
      },
       quandet:false,
       lisehtwo:[
       ],
       liseh: [
             ],
      idneese: {},
      messageReun:'',
      frowtse:{

      },
      // 单位  名称
      mpany:{
        ompany:[],
        name:[]
        },
        config:[],
        defaultProps: {
          children: "children",
          label: "label"
        },
       xiug:false, //false为新增报表   true 为上传报表
       bieoa:{
         tableName:'',
         personnelId:undefined,
       },
       hyeqa:false, //false 修改取消  true 修改确定
    };
  },
  created() {
    //this.getList();
    this.getReportList();
    this.getDicts("report_status").then(response => {
      this.statusOptions = response.data;
    });
    this.getTreeselect()
  },
  methods: {
    dateString() {
        let year = new Date().toLocaleDateString().substring(0, 4);
        let month = new Date().toLocaleDateString().substring(5, 6);
        let day = new Date().toLocaleDateString().substring(7, 9);
        return year+"-"+month+"-"+day+" "+"20:30:00";
      },
    /** 查询部门列表 */
    getList() {
      this.loading = true;
      tistDept().then(response => {
        this.deptOptionstwofr = response.data.reports
        this.loading = false;
      });
    },

    /** 查询报表列表 */
    getReportList() {
      this.loading = true;
      reportListrt(this.queryParams).then(response => {
        this.reportList = response.rows
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 转换部门数据结构 */
    /** 转换角色数据结构 */
    normalizer(node) {
      // if (node.children && !node.children.length) {
      //   delete node.children;
      // }
      return {
        id: node.id,
        label: node.roleName,
      };
    },
    /** 转换组数据结构 */
    normalizerty(node) {
      return {
        id: node.id,
        label: node.groupName,
      };
    },
    normalizerghy(node){
      return {
        id: node.id,
        label: node.name,
      };
    },
    // 字典状态字典翻译
    statusFormat(row, column) {
      return this.selectDictLabel(this.statusOptions, row.status);
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.opentr = false;
      this.hyeqa = false;
      this.messageReun = ''
      this.configtwo = []
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        personnels:[{
           deptId: 0,
           deptName: "",
           userId: 0,
           userName: ""
        }]
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.getReportList();

     // this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 新增按钮操作 */
    handleAdd(row) {
      this.reset();
      if (row != undefined) {
        // this.form.parentId = row.id;
      }
      this.open = true;
      this.title = "添加报表";
      this.xiug = false
      this.configtwo = []
      this.messageReun = ''
      this.lisehtwo = []
      this.getList()
      // listDept().then(response => {
	     //    this.deptOptions = this.handleTree(response.data, "id");
      // });
    },
    /** 上传按钮操作 */
    handleUpdate(row) {
      this.reset();
      // getDept(row.id).then(response => {
        // this.form = response.data;
        this.open = true;
        this.title = "上传报表";
        this.bieoa.personnelId = row.personnelId
        this.bieoa.tableName = row.tableName
        this.configtwo = []
        this.xiug = true
        // this.getList()
      // });
      // listDeptExcludeChild(row.id).then(response => {
	     //    this.deptOptions = this.handleTree(response.data, "id");
      // });
    },
    /** 修改按钮操作 */
    handleUpdatety(row){
      this.reset();
      console.log(row,34)
      this.hyeqa =  true
      this.formty.startTime = row.startTime
      this.formty.endTime = row.endTime
      this.formty.reportName = row.reportName
      this.formty.reportId = row.reportId
      this.formty.templateName = row.templateName
      this.formty.remark = row.remark


      if(row.repUploadFile !== null){

      }

      getDept(row.id).then(response => {
        // this.form = response.data;
        this.formty = response.data;
        if(response.data.personnels !== null){
            let jues = []
            response.data.personnels.filter( route=>{
              jues.push(route.userName)
            })
           console.log(jues)
           let nahe = jues.join(',')
           this.messageReun = '已选择' +nahe

        }
        if(response.data.repUploadFile !== null){
          console.log(JSON.parse(response.data.repUploadFile).name)
           this.configtwo = [{name:'',url:''}]
           this.configtwo[0].url = JSON.parse(response.data.repUploadFile).url
           this.configtwo[0].name = JSON.parse(response.data.repUploadFile).name
           // this.formty.repUploadFile = row.repUploadFile
           console.log(this.configtwo)

        }
        this.opentr = true;
        this.title = "编辑信息";
        // this.xiug = false
        this.getList()
        // this.getList()
        });
        // listDeptExcludeChild(row.id).then(response => {
         //    this.deptOptions = this.handleTree(response.data, "id");
        // });
    },
    // 查看按钮
    handleAddchak(row){
      this.$router.push({
        path: '/business/sonnel',
        query: {
          id:row.id,
        },
      })
    },
    /** 提交按钮 */
    submitForm: function() {
      if(this.xiug == false){
       this.$refs["form"].validate(valid => {
        console.log(this.lisehtwo)
        if(this.form.templateName == undefined || this.form.templateName == ''){
          this.msgSuccess("请上传表格模板");
          return false
        }
       if(this.lisehtwo.length == 0){
          this.msgSuccess("请选择分发人员");
          return false
       }
       for(var i = 0 ; i < this.lisehtwo.length; i++){
         this.form.personnels[i] = {deptId:0,deptName:'',userId:0,userName:''}
         this.form.personnels[i].userId = this.lisehtwo[i].id
         this.form.personnels[i].userName = this.lisehtwo[i].userName
         this.form.personnels[i].deptId  = this.lisehtwo[i].deptId
         if(this.lisehtwo[i].dept !== undefined && this.lisehtwo[i].dept !==null){
           this.form.personnels[i].deptName = this.lisehtwo[i].dept.deptName
           // this.form.personnels[i].deptId  = this.lisehtwo[i].dept.deptId
         }else{
           this.form.personnels[i].deptName = this.lisehtwo[i].deptName

         }
       }
       console.log(this.form)
           addDeptiu(this.form).then(response => {
             this.msgSuccess("新增成功");
             this.open = false;
             this.getReportList();
            // this.getList();
           });
         // if (valid) {
         //   if (this.form.id != undefined) {
         //     updateDept(this.form).then(response => {
         //       this.msgSuccess("修改成功");
         //       this.open = false;
         //       this.getList();
         //     });
         //   } else {
         //     addDept(this.form).then(response => {
         //       this.msgSuccess("新增成功");
         //       this.open = false;
         //       this.getList();
         //     });
         //   }
         // }
       });
      }else{
        if(this.bieoa.file == undefined || this.form.templateName == '{}'){
          this.msgSuccess("请上传报表");
          return false
        }
        addDeptiugt(this.bieoa).then(response => {
          this.msgSuccess("新增成功");
          this.open = false;
          this.getReportList();
         // this.getList();
        });
      }

    },
    /** 修改按钮 */
    submitFormty: function() {
      // if(this.xiug == false){
       this.$refs["formty"].validate(valid => {
        console.log(this.lisehtwo)
        if(this.formty.personnels == null){
          if(this.lisehtwo.length == 0){
             this.msgSuccess("请选择分发人员");
             return false
          }
          for(var i = 0 ; i < this.lisehtwo.length; i++){
            this.formty.personnels[i] = {deptId:0,deptName:'',userId:0,userName:''}
            this.formty.personnels[i].userId = this.lisehtwo[i].id
            this.formty.personnels[i].userName = this.lisehtwo[i].userName
            this.formty.personnels[i].deptId  = this.lisehtwo[i].deptId
            if(this.lisehtwo[i].dept !== undefined && this.lisehtwo[i].dept !==null){
              this.formty.personnels[i].deptName = this.lisehtwo[i].dept.deptName
              // this.form.personnels[i].deptId  = this.lisehtwo[i].dept.deptId
            }else{
              this.formty.personnels[i].deptName = this.lisehtwo[i].deptName

            }
          }
        }else{
          if(this.lisehtwo.length !== 0){
            console.log(345)
            for(var i = 0 ; i < this.lisehtwo.length; i++){
              this.formty.personnels[i] = {deptId:0,deptName:'',userId:0,userName:''}
              this.formty.personnels[i].userId = this.lisehtwo[i].id
              this.formty.personnels[i].userName = this.lisehtwo[i].userName
              this.formty.personnels[i].deptId  = this.lisehtwo[i].deptId
              if(this.lisehtwo[i].dept !== undefined && this.lisehtwo[i].dept !==null){
                this.formty.personnels[i].deptName = this.lisehtwo[i].dept.deptName
                // this.form.personnels[i].deptId  = this.lisehtwo[i].dept.deptId
              }else{
                this.formty.personnels[i].deptName = this.lisehtwo[i].deptName

              }
            }
          }
        }

       console.log(this.formty)
           addDeptiu(this.formty).then(response => {
             this.msgSuccess("修改成功");
             this.opentr = false;
             this.hyeqa = false;
             this.getReportList();
            // this.getList();
           });
         // if (valid) {
         //   if (this.form.id != undefined) {
         //     updateDept(this.form).then(response => {
         //       this.msgSuccess("修改成功");
         //       this.open = false;
         //       this.getList();
         //     });
         //   } else {
         //     addDept(this.form).then(response => {
         //       this.msgSuccess("新增成功");
         //       this.open = false;
         //       this.getList();
         //     });
         //   }
         // }
       });
      // }else{

      // }

    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!=1
      this.multiple = !selection.length
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      let ids = []
      if(row.id !== undefined){
        const id = []
        id.push(row.id)
        ids = id
      }else{
        ids = this.ids
      }
      let hue= {}
      hue.idList = ids
      hue.table = 'statistic_report'
      hue.logicDelName ="is_del",
       hue.logicDelValue ="Y",
      this.$confirm('是否确认删除', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delDept(hue);
        }).then(() => {
        this.getReportList();
        //this.getList();
          this.msgSuccess("删除成功");
        })
    },
    // 上传文件
    handleChangert(file, fileList) {
      // this.configtwo = []
      const jieg = []
      jieg.push(fileList[fileList.length - 1])
      console.log(jieg)
      this.configtwo = jieg.slice(-3);
    },
    upImageFn(res, file) {
      if(res.code !== 200){
        this.msgInfo('上传失败');
        return false
      }else{
        this.msgSuccess('上传成功');
        // this.msgInfo('上传失败');
        this.config= res.data
        console.log(res.data)
        console.log(res.data.name.substr(0,res.data.name.length-4))
        // this.querjtgoe.message_upload = this.config
        // console.log(this.querjtgoe.message_upload)
        if(this.xiug == false){
          console.log(3456)
          this.form.templateName = res.data.name
          this.form.repUploadFile = JSON.stringify(this.config)
        }else{
           this.bieoa.file = this.config
        }

        if(this.hyeqa == true){
          this.formty.templateName = res.data.name
          this.formty.repUploadFile = JSON.stringify(this.config)
        }
        // this.querjtgoe.message_title = res.data.name.substr(0,res.data.name.length-4)
        // this.querjtgoe.message_upload = JSON.stringify(this.querjtgoe.message_upload)
      }
      // querjtgoe.message_title
      console.log(res)
      // console.log(res.data.name.substr(-4))
    },
    err(){
      this.msgSuccess("上传失败");
     console.log(35)
    },
    reseImage(file, fileList) {
      let urls = ""
      this.configtwo = []
      // if (file.response) {
      //   urls = file.response.url
      // } else {
      //   urls = file.url
      // }
      // for (let i = this.configtwo.length - 1; i >= 0; i--) {
      //   if (this.configtwo[i].url == urls) {
      //     this.configtwo.splice(i, 1);
      //   }
      // }
     console.log(this.configtwo)
     // if(this.configtwo.length == 0){
     //   this.querjtgoe.message_enclosure = undefined
     // }else{
     //   this.querjtgoe.message_enclosure = JSON.stringify(this.configtwo)
     // }

    },
    getToken() {
      return getToken()
    },
    // 上传前控制
    befors(res, file){
      console.log(res,file)
      console.log(res.name.substr(0,res.name.length-4))
      if(res.type !== 'application/vnd.ms-excel'  ){
        if(res.type !== 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'){
          this.msgSuccess('只能上传xls文件');
          return false
        }

      }else{
        return true
      }
      // return   true
    },
    // 图片预览
    handlePictureCardPreview(file) {
      console.log(file,87)
      console.log(file.name.split('.'))
      let hegs = file.name.split('.')
      console.log(hegs[hegs.length - 1])
      // if(hegs[hegs.length - 1] == 'pdf'){
      //   this.shouewhu = true
      // }else{
      //   this.shouewhu = false
      // }
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
      this.imashow = true
    },
    // 人员选择
    changeren(){
    this.modalShow = true
    },
    handleClick(index){
    if(index.index == 0){
      this.getTreeselect()
    }else if(index.index == 1){
      this.getTreeselectjue()
    }else if(index.index == 2){
      this.getTreeselecu()
    }
    },
    /** 查询部门下拉树结构 */
    getTreeselect() {
      treeselect().then(response => {
        this.deptOptions = response.data;
      });
    },
    // 查询角色
    getTreeselectjue() {
      this.loading = true;
      listRole(this.queryParams).then(response => {
        this.deptOptionstwo = this.handleTree(response.rows, "id");
        this.loading = false;
      });
    },
    // 查询组
    getTreeselecu() {
      this.loading = true;
      group(this.queryParams).then(response => {
        this.deptOptionsthre = this.handleTree(response.data, "id");
        this.loading = false;
      });
    },
    // 筛选节点
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    // 节点单击事件
    handleNodeClick(data) {
      console.log(data);
      // this.queryParams.deptId = data.id;
      this.staff(data.id);
      this.quandet = false
      // this.getList();
    },
    // 点击组/角色
      djieskle(node, instanceId) {
        this.personnel(node.id);
        console.log(node, instanceId);
      },
      djieskletwo(node, instanceId) {
        this.members(node.id);
        this.elezu = node.id
        console.log(node, instanceId);
      },
      // 点击全部删除
      eledelte(){
       this.lisehtwo = []
      },
      // 点击全选
      quande(){
        var dueg = []
        dueg = (this.dhiuw)
       this.quandet = true
       var that =  this
       // dueg.push(index)
       // this.lisehtwo = dueg
       // this.lisehtwo.push(index);
       // this.lisehtwo = [...new Set(this.lisehtwo)];
       // that.positions.map(train => {
       //   that.new_Positions.push(train.trainId);
       // });
       // that.resultArr = []; //去重后的数组
       var flag;
       for (var i in dueg) {
         flag = true;
         for (var j in that.lisehtwo) {
           if (that.lisehtwo[j].id == dueg[i].id) {
             flag = false;
             break;
           }
         }
         if (flag) {
           that.lisehtwo.push(dueg[i]);
         }
       }
      },
      // 点击添加
      reyantt(index) {
        var dueg = [];
        this.idneese = index;
        var that =  this
        dueg.push(index)
        // this.lisehtwo = dueg
        // this.lisehtwo.push(index);
        // this.lisehtwo = [...new Set(this.lisehtwo)];
        // that.positions.map(train => {
        //   that.new_Positions.push(train.trainId);
        // });
        // that.resultArr = []; //去重后的数组
        var flag;
        for (var i in dueg) {
          flag = true;
          for (var j in that.lisehtwo) {
            if (that.lisehtwo[j].id == dueg[i].id) {
              flag = false;
              break;
            }
          }
          if (flag) {
            that.lisehtwo.push(dueg[i]);
          }
        }
        // for(var i = 0 ; i <this.lisehtwo.length; i++ ){
        //   if(this.lisehtwo[i].id == index.id){
        //     this.lisehtwo.splice(i,1)
        //   }
        // }
        // })
      },
      // 点击确定
      determine(){
        var eledete = []
       this.lisehtwo.filter(route=>{
         eledete.push(route.id)
       })
       eledete  = eledete.join(',')
       console.log(this.lisehtwo)


       // this.elezu
       this.loading = true;
       buent(this.lisehtwo).then(response => {
         // this.lisehtwo = response.data;
         // this.dhiuw = response.data
         this.mpany.ompany = response.deptNameList
         this.mpany.name = response.nikeNameList
         console.log( this.mpany.ompany)

         let nahe = this.mpany.name.join(',')
         console.log( nahe)
         this.messageReun = '已选择' +nahe
         if(response.code == 200){
           this.msgSuccess('操作成功');
           this.modalShow = false
         }
         this.loading = false;
       });
      },
      load(){

      },
      // 按照部门查询人员
      staff(index) {
        this.loading = true;
        var that = this;
        getRole(index).then(response => {
          // this.deptOptionsthre = this.handleTree(response.data, "id");
          // this.rtuer = true
          this.liseh = []
          this.liseh = response.data;
          this.dhiuw = response.data
          this.loading = false;
        });
      },
      // 按照角色查询人员
      personnel(index) {
        this.loading = true;
        getPersonnel(index).then(response => {
          // this.deptOptionsthre = this.handleTree(response.data, "id");        this.liseh = response.data;
          this.liseh = []
          this.liseh = response.data;
          this.dhiuw = response.data
          this.loading = false;
        });
      },
      // 按照组查询人员
      members(index) {
        this.loading = true;
        getMembers(index).then(response => {
          // this.deptOptionsthre = this.handleTree(response.data, "id");
          // this.liseh = response.data;
          // response.data
          // this.lisehtwo.push(response.data)
          this.liseh = []
          this.liseh = response.data;
          this.dhiuw = response.data
          // this.dhiuw.filter(route=>{
          //   this.lisehtwo.push(route)
          // })
          this.loading = false;
        });
      },
      // 点击删除
      lidele(index) {
        for (let i = this.lisehtwo.length - 1; i >= 0; i--) {
          if (this.lisehtwo[i].id == index.id) {
            this.lisehtwo.splice(i, 1)
          }
        }
        this.jeihqdcee = this.lisehtwo
      },
      handleStatusChange(row) {
        let text = row.status === "0" ? "启用" : "停用";
        let nheu = {
          condition:{

          },
          commitData:{

          }
        }
        nheu.tableName = 'statistic_report'
        nheu.condition.id = row.id
        nheu.commitData.status = row.status
        this.$confirm('确认要改变此用户状态值吗?', "警告", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }).then(function() {
            return addDeptiyuit(nheu);
          }).then(() => {
            this.msgSuccess('操作成功');
          }).catch(function() {
            row.status = row.status === "0" ? "1" : "0";
          });
      },
  }
};
</script>
<style lang="scss">
  .infinite-list {
    // height: 150px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    .infinite-list-item {
      // flex:1!important;
      display: flex;
      // justify-content: space-between;
      align-items: center;
      text-align: center;
      list-style: none;
      height: 23px;
      margin-left: 10px;
      // line-height: 30px;
    }
    .infinite-list-itemss {
      color: #1890ff;
    }
  }
  .infinite-listty {
    display: flex;
    flex-wrap: wrap;
    .infinite-list-itemty {
      // flex:1;
      display: flex;
      // justify-content: space-between;
      height: 23px;
      line-height: 23px;
      // text-align: center;
      list-style: none;
      margin-left: 10px;
      // border-radius: 40px;
      // border: 1px solid #eee;
      // border-bottom: 1px solid #eee;
    }

  }
  // 分发人员
  .infinite-listopma{
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: flex-start;
   align-items: center;
   li{
     list-style: none;
     // width: 20%;
     margin-left: 10px;
     line-height: 23px;
   }
  }

</style>
<style lang="scss" scoped="">
  .app-container{
    padding: 0 20px !important;
    padding-top: 20px !important;
    background-color: #eef0ff;
  }
  .app-containergt{
    background-color: #fff;
    border-radius: 6px;
    padding: 23px !important;
  }

  .tab_bott {
    display: flex;
  }
  .tabBot_oje {
    width: 40%;
  }
  .tabBot_two {
    width: 50%;
    margin-left: 30px;
  }
  .box-cardtt{
    margin-top: 30px;
  }
  .index_navTimeimg {
    width: 10px;
    height: 10px;
    margin-left: 5px;
  }
  .jheuy{
    color: #FE4141;
  }
  .neuiq{
    color: #FE9A41;
  }
  .bgeyy{
    color: #27C949;
  }
</style>