su

su1124

2024-03-08 facb80c84fb77e0003213572cfa1851017286584

 src/views/team/teams/index.vue

@@ -1,719 +1,889 @@
<template>
    <div class="app-container">
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
                <el-form :model="objs" :rules="rules" ref="form" size="small" :inline="true" label-width="80px">
                    <el-form-item label="单位名称" prop="firmId">
                        <el-select :remote-method="getRemoteData" v-model="objs.firmId" remote filterable
                            style="width: 200px" placeholder="请选择单位名称" clearable @change="idFn">
                            <el-option v-for="dict in CompanyList" :key="dict.cnName" :label="dict.cnName"
                                :value="dict.drugManufacturerId" />
                        </el-select>
                    </el-form-item>
                    <el-form-item label="部门" prop="dwDeptId">
                        <el-select v-model="objs.dwDeptId" placeholder="请选择部门" style="width: 200px" clearable
                            @change="idBm">
                            <el-option v-for="dict in deptList" :key="dict.id" :label="dict.dwDeptName" :value="dict.id" />
                        </el-select>
                    </el-form-item>
                    <el-form-item label="分组" prop="groupId">
                        <el-select v-model="objs.groupId" placeholder="请选择结算方式" style="width: 200px" clearable>
                            <el-option v-for="dict in groupingList" :key="dict.id" :label="dict.groupingName"
                                :value="dict.id" />
                        </el-select>
                    </el-form-item>
                    <el-form-item label="登记时间" prop="createTimeList">
                        <el-date-picker v-model="createTimeList" type="datetimerange" align="right"
                            :picker-options="pickerOptions" style="width: 260px" start-placeholder="开始日期"
                            end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
                            @change="dateChangebirthday1">
                        </el-date-picker>
                    </el-form-item>
                </el-form>
  <div class="app-container">
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-form
          :model="objs"
          :rules="rules"
          ref="form"
          size="small"
          :inline="true"
          label-width="80px"
        >
          <el-form-item label="单位名称" prop="firmId">
            <el-select
              :remote-method="getRemoteData"
              v-model="objs.firmId"
              remote
              filterable
              style="width: 200px"
              placeholder="请选择单位名称"
              clearable
              @change="idFn"
            >
              <el-option
                v-for="dict in CompanyList"
                :key="dict.cnName"
                :label="dict.cnName"
                :value="dict.drugManufacturerId"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="部门" prop="dwDeptId">
            <el-select
              v-model="objs.dwDeptId"
              placeholder="请选择部门"
              style="width: 200px"
              clearable
              @change="idBm"
            >
              <el-option
                v-for="dict in deptList"
                :key="dict.id"
                :label="dict.dwDeptName"
                :value="dict.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="分组" prop="groupId">
            <el-select
              v-model="objs.groupId"
              placeholder="请选择结算方式"
              style="width: 200px"
              clearable
            >
              <el-option
                v-for="dict in groupingList"
                :key="dict.id"
                :label="dict.groupingName"
                :value="dict.id"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="登记时间" prop="createTimeList">
            <el-date-picker
              v-model="createTimeList"
              type="datetimerange"
              align="right"
              :picker-options="pickerOptions"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :default-time="['00:00:00', '23:59:00']"
              format="yyyy-MM-dd HH:mm"
              value-format="yyyy-MM-dd HH:mm"
              @change="dateChangebirthday1"
            >
            </el-date-picker>
          </el-form-item>
        </el-form>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          size="mini"
          @click="handlequery"
          v-hasPermi="['system:user:import']"
          >查询</el-button
        >
      </el-col>
    </el-row>

            </el-col>
            <el-col :span="1.5">
                <el-button type="primary" size="mini" @click="handlequery"
                    v-hasPermi="['system:user:import']">查询</el-button>
            </el-col>

        </el-row>

        <div style="margin: 5px 20px;width: 94%">
            <el-row :gutter="10" class="mb8">
                <!-- <el-col :span="1.5">
    <div style="margin: 5px 20px; width: 94%">
      <el-row :gutter="10" class="mb8">
        <!-- <el-col :span="1.5">
                    <el-button type="primary" size="mini" :disabled="single" @click="handleTeamfees">保存团队收费明细</el-button>
                </el-col> -->
                <el-col :span="1.5">
                    <el-button type="primary" size="mini" @click="handleAll">查看详细信息</el-button>
                </el-col>
                <el-col :span="1.5">
                    <el-button type="primary" size="mini" @click="handleothen"
                        v-hasPermi="['system:user:import']">导出团队信息</el-button>
                </el-col>
            </el-row>
            <div style="display: flex;" v-if="userList.length != 0">
                <div>人数合计：{{ Listdata.all }}</div>
                <div style="margin: 0 20px;">检中：{{ Listdata.jianzhong }}</div>
                <div style="margin: 0 15px;">未检：{{ Listdata.weijian }}</div>
                <div>已完成：{{ Listdata.yijian }}</div>
            </div>
            <el-table v-loading="loading" ref="tree" :data="userList" border @selection-change="handleSelectionChange">
                <el-table-column label="状态" align="center" prop="tjStatus" width="75">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.tj_status" :value="scope.row.tjStatus" />
                    </template>
                </el-table-column>
                <el-table-column label="体检号" align="center" prop="tjNumber" width="165" />
                <el-table-column label="姓名" align="center" prop="name" width="75" />
                <el-table-column label="性别" align="center" prop="sex" width="75">
                    <template slot-scope="scope">
                        <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.sex" />
                    </template>
                </el-table-column>
                <el-table-column label="年龄" align="center" prop="age" width="120" />
                <el-table-column label="联系电话" align="center" prop="phoe" width="120" />
                <el-table-column label="身份证号" align="center" prop="idCard" width="200" />
                <el-table-column label="单位名称" align="center" prop="company" width="200" />
                <el-table-column label="部门" align="center" prop="department" />
                <el-table-column label="分组" align="center" prop="groupingName" />
                <el-table-column label="创建时间" align="center" prop="updateTime" width="165" />
                <el-table-column label="预约时间" align="center" prop="reservationTime" />
            </el-table>
        </div>
        <el-col :span="1.5">
          <el-button type="primary" size="mini" @click="handleAll"
            >查看详细信息</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="primary"
            size="mini"
            @click="handleothen"
            v-hasPermi="['system:user:import']"
            >导出团队信息</el-button
          >
        </el-col>
      </el-row>
      <div style="display: flex" v-if="userList.length != 0">
        <div>人数合计：{{ Listdata.all }}</div>
        <div style="margin: 0 20px">检中：{{ Listdata.jianzhong }}</div>
        <div style="margin: 0 15px">未检：{{ Listdata.weijian }}</div>
        <div>已完成：{{ Listdata.yijian }}</div>
      </div>
      <el-table
        v-loading="loading"
        ref="tree"
        :data="userList"
        border
        @selection-change="handleSelectionChange"
      >
        <el-table-column label="状态" align="center" prop="tjStatus" width="75">
          <template slot-scope="scope">
            <dict-tag
              :options="dict.type.tj_status"
              :value="scope.row.tjStatus"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="体检号"
          align="center"
          prop="tjNumber"
          width="165"
        />
        <el-table-column label="姓名" align="center" prop="name" width="75" />
        <el-table-column label="性别" align="center" prop="sex" width="75">
          <template slot-scope="scope">
            <dict-tag
              :options="dict.type.sys_user_sex"
              :value="scope.row.sex"
            />
          </template>
        </el-table-column>
        <el-table-column label="年龄" align="center" prop="age" width="120" />
        <el-table-column
          label="联系电话"
          align="center"
          prop="phoe"
          width="120"
        />
        <el-table-column
          label="身份证号"
          align="center"
          prop="idCard"
          width="200"
        />
        <el-table-column
          label="单位名称"
          align="center"
          prop="company"
          width="200"
        />
        <el-table-column label="部门" align="center" prop="department" />
        <el-table-column label="分组" align="center" prop="groupingName" />
        <el-table-column
          label="创建时间"
          align="center"
          prop="updateTime"
          width="165"
        />
        <el-table-column
          label="预约时间"
          align="center"
          prop="reservationTime"
        />
      </el-table>
    </div>

    <!-- 查看详细信息对话框 -->
    <div class="dia">
      <el-dialog
        :title="title"
        :visible.sync="open"
        width="1300px"
        append-to-body
      >
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-input
              v-model="bingZhong"
              placeholder="请输入病种名称"
              clearable
              @keyup.enter.native="handleQuery1"
              style="width: 160px"
            />
          </el-col>

        <!-- 查看详细信息对话框 -->
        <div class="dia">
            <el-dialog :title="title" :visible.sync="open" width="1300px" append-to-body>
                <el-row :gutter="10" class="mb8">
                    <el-col :span="1.5">
                        <el-input v-model="bingZhong" placeholder="请输入病种名称" clearable @keyup.enter.native="handleQuery1"
                            style="width: 160px;" />
                    </el-col>

                    <!-- <el-col :span="1.5">
          <!-- <el-col :span="1.5">
                        <el-button type="primary" size="mini" :disabled="single" @click="handlecan"
                            style="margin-top: 5px;">查看</el-button>
                    </el-col> -->
                    <el-col :span="1.5">
                        <el-button type="primary" size="mini" @click="handlesetup" v-hasPermi="['system:user:import']"
                            style="margin-top: 5px;">查看统计图</el-button>
                    </el-col>
                    <!-- <el-col :span="1.5">
          <el-col :span="1.5">
            <el-button
              type="primary"
              size="mini"
              @click="handlesetup"
              v-hasPermi="['system:user:import']"
              style="margin-top: 5px"
              >查看统计图</el-button
            >
          </el-col>
          <!-- <el-col :span="1.5">
                        <el-button type="primary" size="mini" @click="handlechart" v-hasPermi="['system:user:import']"
                            style="margin-top: 5px;">查看统计图</el-button>
                    </el-col> -->
        </el-row>
        <el-row :gutter="20">
          <!--部门数据-->
          <el-col :span="7" :xs="24">
            <el-table
              v-loading="loading"
              ref="treeTable"
              :data="ListdataAll"
              height="500"
              border
              @selection-change="handleChange"
            >
              <el-table-column type="selection" width="45"> </el-table-column>
              <el-table-column
                label="病种"
                align="center"
                prop="rules.bingzhong"
              />

                </el-row>
                <el-row :gutter="20">
                    <!--部门数据-->
                    <el-col :span="7" :xs="24">
                        <el-table v-loading="loading" ref="treeTable" :data="ListdataAll" height="500" border
                            @selection-change="handleChange">
                            <el-table-column type="selection" width="45">
                            </el-table-column>
                            <el-table-column label="病种" align="center" prop="rules.bingzhong" />
              <el-table-column
                label="数量"
                align="center"
                prop="num"
                width="75"
              />
            </el-table>
          </el-col>

                            <el-table-column label="数量" align="center" prop="num" width="75" />
                        </el-table>
                    </el-col>

                    <!--用户数据-->
                    <el-col :span="16" :xs="24">
                        <el-table v-loading="loading" ref="tree" :data="orderList" border height="500">
                            <el-table-column label="病种" align="center" prop="bingzhong" width="100" />
                            <el-table-column label="体检号" align="center" prop="tjNumber" />
                            <el-table-column label="姓名" align="center" prop="cusName" width="60" />
                            <el-table-column label="性别" align="center" prop="cusSex" width="55">
                                <template slot-scope="scope">
                                    <dict-tag :options="dict.type.sys_user_sex" :value="scope.row.cusSex" />
                                </template>
                            </el-table-column>
                            <el-table-column label="年龄" align="center" prop="cusAge" width="55" />
                            <el-table-column label="单位名称" align="center" prop="dwName" width="150" />
                            <el-table-column label="部门" align="center" prop="dwDeptName" />
                            <el-table-column label="分组" align="center" prop="groupName" width="78" />
                        </el-table>
                    </el-col>
                </el-row>
            </el-dialog>
        </div>

        <!-- 查看统计图 -->
        <div class="dia">
            <el-dialog :title="title2" :visible.sync="open2" width="1300px" append-to-body>
                <div style=" height:620px;margin-top: 10px;">
                    <div id="main" style="width:95%;height:400px"> </div>
                </div>
            </el-dialog>
        </div>

        <!-- 设置对话框 -->
        <div class="dia">
            <el-dialog :title="title1" :visible.sync="open1" width="960px" append-to-body>
                <div style="text-align: center;">
                    <el-transfer style="text-align: left; display: inline-block;" v-model="value" filterable
                        :render-content="renderFunc" :titles="['显示病种', '隐藏病种']" :button-texts="['显示', '隐藏']"
                        @change="handleChange1" :data="datalist">
                    </el-transfer>
                </div>
                <div slot="footer" class="dialog-footer2">
                    <el-button type="primary" @click="submitFormS">生成统计图</el-button>
                </div>
            </el-dialog>
        </div>

          <!--用户数据-->
          <el-col :span="16" :xs="24">
            <el-table
              v-loading="loading"
              ref="tree"
              :data="orderList"
              border
              height="500"
            >
              <el-table-column
                label="病种"
                align="center"
                prop="bingzhong"
                width="100"
              />
              <el-table-column label="体检号" align="center" prop="tjNumber" />
              <el-table-column
                label="姓名"
                align="center"
                prop="cusName"
                width="60"
              />
              <el-table-column
                label="性别"
                align="center"
                prop="cusSex"
                width="55"
              >
                <template slot-scope="scope">
                  <dict-tag
                    :options="dict.type.sys_user_sex"
                    :value="scope.row.cusSex"
                  />
                </template>
              </el-table-column>
              <el-table-column
                label="年龄"
                align="center"
                prop="cusAge"
                width="55"
              />
              <el-table-column
                label="单位名称"
                align="center"
                prop="dwName"
                width="150"
              />
              <el-table-column label="部门" align="center" prop="dwDeptName" />
              <el-table-column
                label="分组"
                align="center"
                prop="groupName"
                width="78"
              />
            </el-table>
          </el-col>
        </el-row>
      </el-dialog>
    </div>

    <!-- 查看统计图 -->
    <div class="dia">
      <el-dialog
        :title="title2"
        :visible.sync="open2"
        width="1300px"
        append-to-body
      >
        <div style="height: 620px; margin-top: 10px">
          <div id="main" style="width: 95%; height: 400px"></div>
        </div>
      </el-dialog>
    </div>

    <!-- 设置对话框 -->
    <div class="dia">
      <el-dialog
        :title="title1"
        :visible.sync="open1"
        width="960px"
        append-to-body
      >
        <div style="text-align: center">
          <el-transfer
            style="text-align: left; display: inline-block"
            v-model="value"
            filterable
            :render-content="renderFunc"
            :titles="['显示病种', '隐藏病种']"
            :button-texts="['显示', '隐藏']"
            @change="handleChange1"
            :data="datalist"
          >
          </el-transfer>
        </div>
        <div slot="footer" class="dialog-footer2">
          <el-button type="primary" @click="submitFormS">生成统计图</el-button>
        </div>
      </el-dialog>
    </div>
  </div>
</template>
  
<script>
import { Deptlist, getDwAndDwDept } from "@/api/system/comp";
import { getCompany, queryCompany } from "@/api/team/tuanti";
import { tuanTiListById, tuanTiBingById, tuanTiBingChart } from "@/api/team/teams";
const echarts = require('echarts/lib/echarts');
require('echarts/lib/component/title');
require('echarts/lib/component/tooltip');
require('echarts/lib/component/legend');
require('echarts/lib/chart/pie');
import {
  tuanTiListById,
  tuanTiBingById,
  tuanTiBingChart,
} from "@/api/team/teams";
import { getNewDateList } from "@/api/hosp/order";
import moment from "moment";
const echarts = require("echarts/lib/echarts");
require("echarts/lib/component/title");
require("echarts/lib/component/tooltip");
require("echarts/lib/component/legend");
require("echarts/lib/chart/pie");

export default {
    name: "Tijian",
    dicts: [
        "dict_user_national",
        "dict_user_marry",
        "sys_yes_no",
        "sys_user_sex",
        "reservation_pay_type",
        "sys_normal_disable",
        "tj_status"
    ],
    data() {
        let checkPhoneNum = (rule, value, callback) => {
         console.log( value)
  name: "Tijian",
  dicts: [
    "dict_user_national",
    "dict_user_marry",
    "sys_yes_no",
    "sys_user_sex",
    "reservation_pay_type",
    "sys_normal_disable",
    "tj_status",
  ],
  data() {
    let checkPhoneNum = (rule, value, callback) => {
      console.log(value);
      let patter = new RegExp(/^1\s*[3456789]\s*(\d\s*){9}$/);
      if (value == "" && value == undefined && !value) {
        return callback('');
      }  else if(value != undefined && value != ""){
        return callback("");
      } else if (value != undefined && value != "") {
        return callback();
      }else if (!patter.test(value)) {
        return callback('');
      } else if (!patter.test(value)) {
        return callback("");
      }
    };
        return {
            datalist: [],
            value: [],
            renderFunc(h, option) {
                return <span>{option.label}</span>;
    return {
      datalist: [],
      value: [],
      renderFunc(h, option) {
        return <span>{option.label}</span>;
      },
      objs: {
        firmId: "",
        dwDeptId: "",
        groupId: "",
        beginTime: "",
        endTime: "",
        pageNum: 1,
        pageSize: 10,
      },
      data: {
        dwId: "",
        deptId: "",
      },
      // 弹出层标题
      title: "",
      bingZhong: "",
      Listdata: {},
      ListdataAll: [],
      aidList: [],
      // 弹出层标题
      title1: "",
      title2: "",
      deptList: [],
      CompanyList: [],
      groupingList: [],
      orderList: [],
      userList: [],
      menuIds: [],
      proIds: [],
      valueList: [],
      // 是否显示弹出层
      open: false,
      open1: false,
      open2: false,
      // 非单个禁用
      single: false,
      cnName: "",
      // 表单参数
      form: {},
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date(new Date().setHours(0, 0, 0, 0));
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
            objs: {
                firmId: "",
                dwDeptId: "",
                groupId: "",
                beginTime: "",
                endTime: "",
                pageNum: 1,
                pageSize: 10,
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date(new Date().setHours(0, 0, 0, 0));
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date(new Date().setHours(0, 0, 0, 0));
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      // 表单校验
      rules: {
        firmId: [
          { required: true, validator: checkPhoneNum, trigger: "change" },
        ],
        beginTime: [
          { required: true, validator: checkPhoneNum, trigger: "blur" },
        ],
        dwDeptId: [
          { required: true, validator: checkPhoneNum, trigger: "change" },
        ],
        groupId: [
          { required: true, validator: checkPhoneNum, trigger: "change" },
        ],
      },
    };
  },
  created() {
    // this.getNowTime();
    this.getList();
    this.getdate();
  },

            },
            data: {
                dwId: "",
                deptId: "",
            },
            // 弹出层标题
            title: "",
            bingZhong: "",
            Listdata: {},
            ListdataAll: [],
            aidList: [],
            // 弹出层标题
            title1: "",
            title2: "",
            deptList: [],
            CompanyList: [],
            groupingList: [],
            orderList: [],
            userList: [],
            menuIds: [],
            proIds: [],
            valueList: [],
            // 是否显示弹出层
            open: false,
            open1: false,
            open2: false,
            // 非单个禁用
            single: false,
            cnName: "",
            // 表单参数
            form: {},
            pickerOptions: {
                shortcuts: [
                    {
                        text: "最近一周",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date(new Date().setHours(0, 0, 0, 0));
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            picker.$emit("pick", [start, end]);
                        },
                    },
                    {
                        text: "最近一个月",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date(new Date().setHours(0, 0, 0, 0));
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                            picker.$emit("pick", [start, end]);
                        },
                    },
                    {
                        text: "最近三个月",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date(new Date().setHours(0, 0, 0, 0));
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                            picker.$emit("pick", [start, end]);
                        },
                    },
                ],
            },
            // 表单校验
            rules: {
                firmId: [
                    { required: true, validator: checkPhoneNum,  trigger: "change" },
                ],
                beginTime: [
                    { required: true, validator: checkPhoneNum,  trigger: "blur" },
                ],
                dwDeptId: [
                    { required: true, validator: checkPhoneNum,  trigger: "change" },
                ],
                groupId: [
                    { required: true, validator: checkPhoneNum,  trigger: "change" },
                ],
            },
  methods: {
    getdate() {
      getNewDateList().then((res) => {
        this.createTimeList = [
          moment(res.data).format("YYYY-MM-DD 00:00:00"),
          moment(res.data).format("YYYY-MM-DD 23:59:00"),
        ];
        console.log(this.createTimeList, 111);
      });
    },
    getList() {
      this.loading = true;
      getCompany(this.queryParam).then((response) => {
        this.CompanyList = response.data;
        this.total = response.total;
        this.loading = false;
      });
    },
    handlequery() {
      if (this.objs.firmId && this.objs.dwDeptId) {
        this.objs.beginTime = this.createTimeList[0];
        this.objs.endTime = this.createTimeList[1];
        tuanTiListById(this.objs).then((response) => {
          this.Listdata = response.data;
          this.userList = response.data.list;
        });
      } else {
        this.$message.warning("带星号为必填项");
      }
    },
    handleQuery1() {
      let data = {
        firmId: this.data.dwId,
        firmDeptId: this.data.deptId,
        bingZhong: this.bingZhong,
      };
      tuanTiBingById(data).then((response) => {
        this.ListdataAll = response.data;
      });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      // this.ids = selection.map((item) => item.id);
      this.single = selection.length !== 1;
    },
    // 表单重置
    reset() {
      this.form = {
        company: null,
        payType: null,
        name: null,
        phoe: null,
        signingPic: null,
        pacStatus: "启用",
      };
      this.resetForm("form");
    },
    idFn(value) {
      if (value) {
        this.data.dwId = value;
        Deptlist(value).then((response) => {
          this.deptList = response.data;
        });
      }
    },
    idBm(value) {
      if (value) {
        this.data.deptId = value;
        getDwAndDwDept(this.data).then((response) => {
          this.groupingList = response.data;
        });
      }
    },

    // 搜索
    getRemoteData(query) {
      if (query) {
        let compName = query;
        queryCompany(compName).then((response) => {
          this.CompanyList = response.data;
          this.CompanyList.forEach((item) => {
            this.objs = item;
          });
        });
      }
    },
    // / 处理默认选中当前日期
    getNowTime() {
      var curDate = new Date().getTime();
      var dayNum = 7 * 24 * 3600 * 1000;
      var threeDays = curDate - dayNum;
      var sDay = this.getLocalTime(threeDays);
      var end = this.getLocalTime(curDate);
      this.createTimeList = [sDay, end];
    },
    add0(m) {
      return m < 10 ? "0" + m : m;
    },
    getLocalTime(nS) {
      var time = new Date(nS);
      var y = time.getFullYear();
      var m = time.getMonth() + 1;
      var d = time.getDate();
      // var h = time.getHours();
      // var mm = time.getMinutes();
      return y + "-" + this.add0(m) + "-" + this.add0(d);
    },
    //获取时间
    dateChangebirthday1(val) {
      if (val == null) {
        this.createTimeList = [];
      } else {
        this.createTimeList = val;
      }
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    /** 查看详细信息按钮操作 */
    handleAll() {
      if (this.data.dwId && this.data.deptId) {
        this.open = true;
        this.title = "团检检出率";
        let data = {
          firmId: this.data.dwId,
          firmDeptId: this.data.deptId,
        };
        tuanTiBingById(data).then((response) => {
          this.ListdataAll = response.data;
        });
      } else {
        this.$message.warning("请选择单位或部门");
      }
    },
    created() {
        this.getNowTime()
        this.getList();
    handleothen() {},
    handleChange(selection) {
      if (selection.length > 1) {
        const newRows = selection.filter((it, index) => {
          if (index == selection.length - 1) {
            this.$refs.treeTable.toggleRowSelection(it, true);
            return true;
          } else {
            this.$refs.treeTable.toggleRowSelection(it, false);
            return false;
          }
        });

        newRows.forEach((item) => {
          this.orderList = item.orderList;
        });
      } else {
        selection.forEach((item) => {
          this.orderList = item.orderList;
        });
      }
    },
    handleTeamfees() {},
    handlecan() {},

    methods: {
        getList() {
            this.loading = true;
            getCompany(this.queryParam).then((response) => {
                this.CompanyList = response.data;
                this.total = response.total;
                this.loading = false;
            });
        },
        handlequery() {
            if (this.objs.firmId && this.objs.dwDeptId) {
                this.objs.beginTime = this.createTimeList[0]
                this.objs.endTime = this.createTimeList[1]
                tuanTiListById(this.objs).then((response) => {
                    this.Listdata = response.data
                    this.userList = response.data.list;
                });
            } else {
                this.$message.warning("带星号为必填项")
            }
    handlechart() {
      this.open2 = true;
      this.title2 = "统计图表";
      let data = {
        firmId: this.data.dwId,
        firmDeptId: this.data.deptId,
        aidList: this.aidList,
      };
      console.log(data);
      tuanTiBingChart(data).then((res) => {
        console.log(res);
        this.$nextTick(() => {
          var chartDom = document.getElementById("main");
          var myChart = echarts.init(chartDom);
          var option;

        },
        handleQuery1() {
            let data = {
                firmId: this.data.dwId,
                firmDeptId: this.data.deptId,
                bingZhong: this.bingZhong
            }
            tuanTiBingById(data).then((response) => {
                this.ListdataAll = response.data
            });
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
          const data = genData(50);
          option = {
            title: {
              text: "团队体检情况",
              // subtext: '纯属虚构',
              left: "center",
            },
            tooltip: {
              trigger: "item",
              formatter: "{a} <br/>{b} : {c} ({d}%)",
            },
            legend: {
              // type: 'scroll',
              orient: "vertical",
              right: 10,
              top: 80,
              bottom: 20,
              data: data.legendData,
            },
            series: [
              {
                name: "姓名",
                type: "pie",
                radius: "55%",
                center: ["25%", "60%"],
                // labelLine: {
                //     normal: {
                //         length: 40,
                //         length2: 30,
                //         lineStyle: {
                //             width: 1
                //         }
                //     }
                // },

            // this.ids = selection.map((item) => item.id);
            this.single = selection.length !== 1;
        },
        // 表单重置
        reset() {
            this.form = {
                company: null,
                payType: null,
                name: null,
                phoe: null,
                signingPic: null,
                pacStatus: "启用"
            };
            this.resetForm("form");
        },
        idFn(value) {
            if (value) {
                this.data.dwId = value
                Deptlist(value).then((response) => {
                    this.deptList = response.data;
                });
            }

        },
        idBm(value) {
            if (value) {
                this.data.deptId = value
                getDwAndDwDept(this.data).then((response) => {
                    this.groupingList = response.data;
                });
            }
        },

        // 搜索
        getRemoteData(query) {
            if (query) {
                let compName = query;
                queryCompany(compName).then((response) => {
                    this.CompanyList = response.data;
                    this.CompanyList.forEach((item) => {
                        this.objs = item;
                    });
                });
            }
        },
        // / 处理默认选中当前日期
        getNowTime() {
            var curDate = new Date().getTime();
            var dayNum = 7 * 24 * 3600 * 1000;
            var threeDays = curDate - dayNum;
            var sDay = this.getLocalTime(threeDays);
            var end = this.getLocalTime(curDate);
            this.createTimeList = [sDay, end];
        },
        add0(m) {
            return m < 10 ? "0" + m : m;
        },
        getLocalTime(nS) {
            var time = new Date(nS);
            var y = time.getFullYear();
            var m = time.getMonth() + 1;
            var d = time.getDate();
            // var h = time.getHours();
            // var mm = time.getMinutes();
            return (
                y +
                "-" +
                this.add0(m) +
                "-" +
                this.add0(d)
            );
        },
        //获取时间
        dateChangebirthday1(val) {
            if (val == null) {
                this.createTimeList = []
            } else {
                this.createTimeList = val;
            }
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        /** 查看详细信息按钮操作 */
        handleAll() {
            if (this.data.dwId && this.data.deptId) {
                this.open = true;
                this.title = "团检检出率";
                let data = {
                    firmId: this.data.dwId,
                    firmDeptId: this.data.deptId,
                }
                tuanTiBingById(data).then((response) => {
                    this.ListdataAll = response.data
                });
            } else {
                this.$message.warning("请选择单位或部门")
            }

        },
        handleothen() {

        },
        handleChange(selection) {

            if (selection.length > 1) {
                const newRows = selection.filter((it, index) => {
                    if (index == selection.length - 1) {
                        this.$refs.treeTable.toggleRowSelection(it, true);
                        return true;
                    } else {
                        this.$refs.treeTable.toggleRowSelection(it, false);
                        return false;
                    }
                });

                newRows.forEach(item => {
                    this.orderList = item.orderList
                })
            } else {
                selection.forEach(item => {
                    this.orderList = item.orderList
                })
            }
        },
        handleTeamfees() {

        },
        handlecan() {

        },

        handlechart() {
            this.open2 = true;
            this.title2 = "统计图表";
            let data = {
                firmId: this.data.dwId,
                firmDeptId: this.data.deptId,
                aidList: this.aidList
            }
            console.log(data)
            tuanTiBingChart(data).then(res => {
                console.log(res)
                this.$nextTick(() => {

                    var chartDom = document.getElementById('main');
                    var myChart = echarts.init(chartDom);
                    var option;

                    const data = genData(50);
                    option = {
                        title: {
                            text: '团队体检情况',
                            // subtext: '纯属虚构',
                            left: 'center',
                        },
                        tooltip: {
                            trigger: 'item',
                            formatter: '{a} <br/>{b} : {c} ({d}%)'
                        },
                        legend: {
                            // type: 'scroll',
                            orient: 'vertical',
                            right: 10,
                            top: 80,
                            bottom: 20,
                            data: data.legendData
                        },
                        series: [
                            {
                                name: '姓名',
                                type: 'pie',
                                radius: '55%',
                                center: ['25%', '60%'],
                                // labelLine: {
                                //     normal: {
                                //         length: 40,
                                //         length2: 30,
                                //         lineStyle: {
                                //             width: 1
                                //         }
                                //     }
                                // },

                                data: data.seriesData,
                                emphasis: {
                                    itemStyle: {
                                        shadowBlur: 10,
                                        shadowOffsetX: 0,
                                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                                    }
                                }
                            }
                        ]
                    };
                    function genData(count) {
                        // prettier-ignore
                        const nameList = [
                data: data.seriesData,
                emphasis: {
                  itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: "rgba(0, 0, 0, 0.5)",
                  },
                },
              },
            ],
          };
          function genData(count) {
            // prettier-ignore
            const nameList = [
                            '赵', '钱', '孙', '李', '周', '吴', '郑', '王', '冯', '陈', '褚', '卫', '蒋', '沈', '韩', '杨', '朱', '秦', '尤', '许', '何', '吕', '施', '张', '孔', '曹', '严', '华', '金', '魏', '陶', '姜', '戚', '谢', '邹', '喻', '柏', '水', '窦', '章', '云', '苏', '潘', '葛', '奚', '范', '彭', '郎', '鲁', '韦', '昌', '马', '苗', '凤', '花', '方', '俞', '任', '袁', '柳', '酆', '鲍', '史', '唐', '费', '廉', '岑', '薛', '雷', '贺', '倪', '汤', '滕', '殷', '罗', '毕', '郝', '邬', '安', '常', '乐', '于', '时', '傅', '皮', '卞', '齐', '康', '伍', '余', '元', '卜', '顾', '孟', '平', '黄', '和', '穆', '萧', '尹', '姚', '邵', '湛', '汪', '祁', '毛', '禹', '狄', '米', '贝', '明', '臧', '计', '伏', '成', '戴', '谈', '宋', '茅', '庞', '熊', '纪', '舒', '屈', '项', '祝', '董', '梁', '杜', '阮', '蓝', '闵', '席', '季', '麻', '强', '贾', '路', '娄', '危'
                        ];
                        const legendData = [];
                        const seriesData = [];
                        for (var i = 0; i < count; i++) {
                            var name =
                                Math.random() > 0.65
                                    ? makeWord(4, 1) + '·' + makeWord(3, 0)
                                    : makeWord(2, 1);
                            legendData.push(name);
                            seriesData.push({
                                name: name,
                                value: Math.round(Math.random() * 100000)
                            });
                        }
                        return {
                            legendData: legendData,
                            seriesData: seriesData
                        };
                        function makeWord(max, min) {
                            const nameLen = Math.ceil(Math.random() * max + min);
                            const name = [];
                            for (var i = 0; i < nameLen; i++) {
                                name.push(nameList[Math.round(Math.random() * nameList.length - 1)]);
                            }
                            return name.join('');
                        }
                    }

                    option && myChart.setOption(option);
                    let sizeFun = function () {
                        myChart.resize()
                    }
                    window.addEventListener("resize", sizeFun)

                });
            })


        },
        handlesetup() {
            this.open1 = true;
            this.title1 = "统计图设置";
            this.datalist = []
            if (this.data.dwId && this.data.deptId) {
                let data = {
                    firmId: this.data.dwId,
                    firmDeptId: this.data.deptId,
                }
                tuanTiBingById(data).then((response) => {
                    response.data.forEach((item, index) => {
                        this.datalist.push(
                            {
                                key: item.rules.aid,
                                label: item.rules.bingzhong,
                            }
                        )
                    })
                });
            } else {
                this.$message.warning("请选择单位或部门")
            const legendData = [];
            const seriesData = [];
            for (var i = 0; i < count; i++) {
              var name =
                Math.random() > 0.65
                  ? makeWord(4, 1) + "·" + makeWord(3, 0)
                  : makeWord(2, 1);
              legendData.push(name);
              seriesData.push({
                name: name,
                value: Math.round(Math.random() * 100000),
              });
            }

        },
        handleChange1(value, direction, movedKeys) {
            this.valueList = value
        },
        submitFormS() {
            if (this.valueList.length >= 1) {
                this.aidList = []
                this.datalist.forEach((item, index) => {
                    this.aidList.push(item.key)
                })
                let num = this.valueList.length
                this.aidList.forEach((item, index) => {
                    this.valueList.forEach((item1, index1) => {
                        if (item == item1) {
                            this.aidList.splice(index, num)
                        }
                    })
                })
            }else if(this.valueList.length == 0){
                this.aidList = []
                this.datalist.forEach((item, index) => {
                    this.aidList.push(item.key)
                })
            return {
              legendData: legendData,
              seriesData: seriesData,
            };
            function makeWord(max, min) {
              const nameLen = Math.ceil(Math.random() * max + min);
              const name = [];
              for (var i = 0; i < nameLen; i++) {
                name.push(
                  nameList[Math.round(Math.random() * nameList.length - 1)]
                );
              }
              return name.join("");
            }
            this.open2 = true;
            this.title2 = "统计图表";
            let bingZhongVO = {
                firmId: this.data.dwId,
                firmDeptId: this.data.deptId,
                aidList: this.aidList
            }
            tuanTiBingChart(bingZhongVO).then(res => {
                this.echartsList = res.data
                this.$nextTick(() => {
                    var chartDom = document.getElementById('main');
                    var myChart = echarts.init(chartDom);
                    var option;
          }

                    option = {
                        title: {
                            text: '团队体检情况',
                            // subtext: '纯属虚构',
                            left: 'center',
                        },
                        tooltip: {
                            trigger: 'item',
                            formatter: '{a} <br/>{b} : {c} ({d}%)'
                        },
                        legend: {
                            // type: 'scroll',
                            orient: 'vertical',
                            right: 10,
                            top: 80,
                            bottom: 20,
                            data:this.echartsList 
                        },
                        series: [
                            {
                                name: '病种名称',
                                type: 'pie',
                                radius: '55%',
                                center: ['25%', '60%'],

                                data: this.echartsList ,
                                emphasis: {
                                    itemStyle: {
                                        shadowBlur: 10,
                                        shadowOffsetX: 0,
                                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                                    }
                                }
                            }
                        ]
                    };


                    option && myChart.setOption(option);
                    let sizeFun = function () {
                        myChart.resize()
                    }
                    window.addEventListener("resize", sizeFun)

                });
            })
        }
          option && myChart.setOption(option);
          let sizeFun = function () {
            myChart.resize();
          };
          window.addEventListener("resize", sizeFun);
        });
      });
    },
    handlesetup() {
      this.open1 = true;
      this.title1 = "统计图设置";
      this.datalist = [];
      if (this.data.dwId && this.data.deptId) {
        let data = {
          firmId: this.data.dwId,
          firmDeptId: this.data.deptId,
        };
        tuanTiBingById(data).then((response) => {
          response.data.forEach((item, index) => {
            this.datalist.push({
              key: item.rules.aid,
              label: item.rules.bingzhong,
            });
          });
        });
      } else {
        this.$message.warning("请选择单位或部门");
      }
    },
    handleChange1(value, direction, movedKeys) {
      this.valueList = value;
    },
    submitFormS() {
      if (this.valueList.length >= 1) {
        this.aidList = [];
        this.datalist.forEach((item, index) => {
          this.aidList.push(item.key);
        });
        let num = this.valueList.length;
        this.aidList.forEach((item, index) => {
          this.valueList.forEach((item1, index1) => {
            if (item == item1) {
              this.aidList.splice(index, num);
            }
          });
        });
      } else if (this.valueList.length == 0) {
        this.aidList = [];
        this.datalist.forEach((item, index) => {
          this.aidList.push(item.key);
        });
      }
      this.open2 = true;
      this.title2 = "统计图表";
      let bingZhongVO = {
        firmId: this.data.dwId,
        firmDeptId: this.data.deptId,
        aidList: this.aidList,
      };
      tuanTiBingChart(bingZhongVO).then((res) => {
        this.echartsList = res.data;
        this.$nextTick(() => {
          var chartDom = document.getElementById("main");
          var myChart = echarts.init(chartDom);
          var option;

          option = {
            title: {
              text: "团队体检情况",
              // subtext: '纯属虚构',
              left: "center",
            },
            tooltip: {
              trigger: "item",
              formatter: "{a} <br/>{b} : {c} ({d}%)",
            },
            legend: {
              // type: 'scroll',
              orient: "vertical",
              right: 10,
              top: 80,
              bottom: 20,
              data: this.echartsList,
            },
            series: [
              {
                name: "病种名称",
                type: "pie",
                radius: "55%",
                center: ["25%", "60%"],

                data: this.echartsList,
                emphasis: {
                  itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: "rgba(0, 0, 0, 0.5)",
                  },
                },
              },
            ],
          };

          option && myChart.setOption(option);
          let sizeFun = function () {
            myChart.resize();
          };
          window.addEventListener("resize", sizeFun);
        });
      });
    },
  },
};
</script>
  
<style>
.el-transfer-panel {
    width: 360px;
    height: 480px;
  width: 360px;
  height: 480px;
}

.el-transfer-panel__body {
    /* border: 1px solid red; */
    height: 480px;
  /* border: 1px solid red; */
  height: 480px;
}

.el-transfer-panel__list.is-filterable {
    height: 352px;
  height: 352px;
}

.el-button--primary.el-transfer__button {
    display: flex;
    justify-content: center;
    align-items: center;

  display: flex;
  justify-content: center;
  align-items: center;
}

.el-transfer__button:first-child {
    width: 82px;
    margin-bottom: 10px;
  width: 82px;
  margin-bottom: 10px;
}

.el-button+.el-button {
    margin-left: 0px;
.el-button + .el-button {
  margin-left: 0px;
}
</style>