Vue_New/src/xt_pages/Pharmacy/PatientDispensing.vue

<template>
  <!--患者发药-->
  <div class="main-contain new-main-contain">
    <div class="position">
      <!--      <bread-crumb :crumbs='crumbs'></bread-crumb>-->
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div
      class="app-container"
      style="display: flex; flex: 1; padding: 10px 20px 0px 20px"
    >
      <div class="mainLeft">
        <div>
          <div class="list">
            <el-date-picker
              style="width: 200px"
              v-model="start_time"
              type="date"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              placeholder="选择日期"
              @change="changeTimes()"
            >
            </el-date-picker>
          </div>
          <!--          <el-button @click="testsss">调试1</el-button>-->
          <!--          <el-button @click="testsss2">调试2</el-button>-->
          <div class="list">
            <el-radio-group v-model="state" @change="lala()">
              <el-radio :label="1">待发药{{ waitmount }}人</el-radio>
              <el-radio :label="2">已发药{{ alreadmount }}人</el-radio>
            </el-radio-group>
          </div>
          <div
            class="list"
            style="display: flex; justify-content: space-between"
          >
            <el-input
              size="small"
              style="width: 130px"
              v-model="keywords"
              class="filter-item"
              placeholder="请输入患者名称"
              clearable
            />
            <el-button
              size="small"
              class="filter-item"
              type="primary"
              @click="searchAction"
              >搜索
            </el-button>
          </div>

          <el-table
            height="60vh"
            ref="table01"
            :data="waitmount_data"
            highlight-current-row
            @current-change="handleCurrentChange"
            border
            style="width: 100%"
            v-if="state == 1"
            :row-style="{ color: '#303133' }"
            :header-cell-style="{
              backgroundColor: 'rgb(245, 247, 250)',
              color: '#606266',
            }"
          >
            <el-table-column prop="date" label="患者姓名" width="100">
              <template slot-scope="scope">
                <span>{{ scope.row.Name ? scope.row.Name : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="name" label="透析号" width="100">
              <template slot-scope="scope">
                <span>{{
                  scope.row.DialysisNo ? scope.row.DialysisNo : ""
                }}</span>
              </template>
            </el-table-column>
          </el-table>
          <el-table
            :height="tableHeight"
            ref="table02"
            :data="alreadmount_data"
            highlight-current-row
            @current-change="handleCurrentChange"
            border
            :row-style="{ color: '#303133' }"
            :header-cell-style="{
              backgroundColor: 'rgb(245, 247, 250)',
              color: '#606266',
            }"
            style="width: 100%"
            v-if="state == 2"
          >
            <el-table-column prop="date" label="患者姓名" width="100">
              <template slot-scope="scope">
                <span>{{ scope.row.Name ? scope.row.Name : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column prop="name" label="透析号" width="100">
              <template slot-scope="scope">
                <span>{{
                  scope.row.DialysisNo ? scope.row.DialysisNo : ""
                }}</span>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="mainRight">
        <div class="titlelist">
          <div>
            班次：
            <el-select
              v-model="shift"
              placeholder="请选择"
              @change="searchAction"
            >
              <el-option
                v-for="item in banshift"
                :key="item.value"
                :label="item.text"
                :value="item.value"
              >
              </el-option>
            </el-select>
            分区：
            <el-select
              v-model="partition"
              placeholder="请选择"
              @change="searchAction"
            >
              <el-option
                v-for="item in fen"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </div>
          

          <div>
            <el-button type="primary" @click="toExport" v-if="state == 2"
              >导出</el-button
            >

            <el-button type="primary" @click="dispense" v-if="state == 1"
              >发药</el-button
            >
            <el-button type="primary" @click="endispense" v-if="state == 2"
              >退药</el-button
            >
            <el-button type="primary" @click="toPrint">打印</el-button>
            <!--                    <el-button @click="tiaoshi">调试</el-button>-->
            <el-button type="primary" v-if="state == 1" @click="toSetting"
              >设置</el-button
            >
          </div>
        </div>
        <el-divider style="margin-top: 10px"></el-divider>
        <div>
          <el-table
            :height="tableHeight"
            :data="tableData"
            border
            style="width: 100%"
            :row-style="{ color: '#303133' }"
            :header-cell-style="{
              backgroundColor: 'rgb(245, 247, 250)',
              color: '#606266',
            }"
          >
            <el-table-column
              type="index"
              label="序号"
              width="50"
              align="center"
            >
            </el-table-column>
            <el-table-column label="名称" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Name ? scope.row.Name : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="规格" width="100" align="center">
              <template slot-scope="scope">
                <span>{{getSpecaiName(scope.row.DrugId)}}</span>
              </template>
            </el-table-column>
            <el-table-column label="单次用量" width="100" align="center">
              <template slot-scope="scope">
                <span>{{
                  scope.row.SingleDosage ? scope.row.SingleDosage : ""
                }}</span>
              </template>
            </el-table-column>
            <el-table-column label="用法" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Usage ? scope.row.Usage : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="频率" width="100" align="center">
              <template slot-scope="scope">
                <span>{{
                  scope.row.Frequency ? scope.row.Frequency : ""
                }}</span>
              </template>
            </el-table-column>
            <el-table-column label="天数" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Days ? scope.row.Days : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="总量" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Total ? scope.row.Total : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="生产厂商" width="100" align="center">
              <template slot-scope="scope">
                <span>{{ getManutuer(scope.row.DrugId) }}</span>
              </template>
            </el-table-column>
            <el-table-column label="药品追溯码" width="162" align="center">
              <template slot-scope="scope">
                 <el-input style="width: 100;" v-model="scope.row.DrugCode" @input="changeDrugCode(scope.row.ID,scope.row.DataSources,scope.row.DrugCode)"></el-input>
              </template>
            </el-table-column>
            <el-table-column label="开立医生" width="150" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Doctor ? scope.row.Doctor : "" }}</span>
              </template>
            </el-table-column>
            <el-table-column label="数据来源" width="162" align="center">
              <template slot-scope="scope">
                <span>{{
                  scope.row.DataSources ? scope.row.DataSources : ""
                }}</span>
              </template>
            </el-table-column>
            <el-table-column label="国家编码" width="162" align="center">
              <template slot-scope="scope">
                <span>{{getDrugName(scope.row.DrugId)}}</span>
              </template>
            </el-table-column>

        
            <el-table-column label="备注" width="170" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.Remarks ? scope.row.Remarks : "" }}</span>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!--        <div v-if="state == 2" style="margin-top: 25px">诊断时间：{{ timedate }}</div>-->
      </div>
      <el-dialog title="设置" :visible.sync="dialogVisible" width="30%">
        <span style="font-size: 17px">请选择药品是否要通过药房管理出库</span>
        <span style="display: block; padding: 18px 25px">
          <el-radio v-model="is_open" label="1">是</el-radio>
          <el-radio v-model="is_open" label="2">否</el-radio>
        </span>
        <div
          style="
            height: 50px;
            background: #c7ebfc;
            border-radius: 5px;
            padding: 7px;
          "
        >
          <i class="el-icon-info" style="color: #3399ff; font-size: 17px"></i>
          若选择为是，则通过药房发药的药品都会在发药之后进行出库，否则按原来的方式进行出库管理
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="SaveSetting">保 存</el-button>
        </span>
      </el-dialog>
    </div>

    <patient-print
      ref="patientprint"
      :visibility="isVisibility"
      :propsTable="propsTable"
      
    >
    </patient-print>
    <patientPrintTwo ref="patientprintTwo"
      :visibility="isVisibilityTwo"
      :propsTable="propsTable"
    >
    </patientPrintTwo>
  </div>
</template>

<script>
import BreadCrumb from "@/xt_pages/components/bread-crumb";
import patientPrint from "./print/patientPrint.vue";
import patientPrintTwo from './print/patientPrintTwo'
import { getPharmacyConfig, SaveSetting } from "@/api/his/advice";
import {
  waitingdrug,
  issueddrugs,
  todaynumber,
  getpharmacycontent,
  dispensingmedicine,
  drugwithdrawal,
  getpartitionlist,
  changeDrugCode
} from "@/api/pharmacy";
import dataDruguse from "../../router/modules/dataDruguse";
const moment = require("moment");
export default {
  components: {
    BreadCrumb,
    patientPrint,
    patientPrintTwo
  },
  data() {
    return {
      patient_id: 0,
      crumbs: [
        { path: false, name: "药房管理" },
        { path: "/Pharmacy/patiantDispensing", name: "患者发药" },
      ],
      tableHeight: 400,
      start_time: moment(new Date()).add("year", 0).format("YYYY-MM-DD"),
      start_time2: moment(new Date()).add("year", 0).format("YYYY-MM-DD HH:mm"),
      state: 1, //1待发药，2已发药
      waitmount: 0, //待发药人数
      waitmount_data: [],
      alreadmount: 0, //已发药人数
      alreadmount_data: [],
      keywords: "",
      tableData: [],
      propsTable: [],
      tableData_list: [],
      isVisibility: false,
      isVisibilityTwo:false,
      currentRow: null,
      dialogVisible: false,
      is_open: "2",
      banshift: [
        { value: 0, text: "全部班" },
        { value: 1, text: "上午" },
        { value: 2, text: "下午" },
        { value: 3, text: "晚上" },
      ],
      shift: 0, //班次
      fen: [],
      partition: 0, //分区
      drugList:[],
      baseList:[],
      org_id:'',
      patients:{},
      doctors:[],
      diagnosearr:[],
      diagnosis:'',
    };
  },
  watch: {},
  created() {
    this.init();
    this.gettodaynumber();
    this.fun3();
    this.getgetpartitionlist();
    this.org_id = this.$store.getters.xt_user.org.id
    // this.getwaitmount();//fun3
    // this.selectedbydefault();
  },
  methods: {
    getgetpartitionlist() {
      var params = {};
      getpartitionlist(params).then((res) => {
        if (res.data.state == 1) {
          this.fen = res.data.data.list;
        }
      });
    },
    tiaoshi() {
      console.log("this.shift", this.shift);
      console.log("this.partition", this.partition);
      console.log("this.waitmount_data", this.waitmount_data);
      console.log("this.alreadmount_data", this.alreadmount_data);
      console.log("this.waitmount", this.waitmount);
      console.log("this.alreadmount", this.alreadmount);
    },
    async fun3() {
      console.log("fun3");
      this.fun1().then((val) => {
        this.fun2();
      });
    },
    async fun4(tmp) {
      console.log("fun3");
      this.fun1().then((val) => {
        console.log("this.alreadmount_data", this.alreadmount_data);
        for (let i = 0; i < this.alreadmount_data.length; i++) {
          console.log("tmp = ", tmp);
          if (this.alreadmount_data[i].PatientID == tmp) {
            console.log("i = ", i);
            this.$refs.table02.setCurrentRow(this.alreadmount_data[i]);
            this.handleCurrentChange(this.alreadmount_data[i]);
          }
        }
      });
    },
    async fun5(tmp) {
      console.log("fun5555");
      this.fun1().then((val) => {
        console.log("this.alreadmount_data", this.waitmount_data);
        for (let i = 0; i < this.waitmount_data.length; i++) {
          console.log("tmp = ", tmp);
          if (this.waitmount_data[i].PatientID == tmp) {
            console.log("i = ", i);
            this.$refs.table01.setCurrentRow(this.waitmount_data[i]);
            this.handleCurrentChange(this.waitmount_data[i]);
          }
        }
      });
    },

    lala() {
      console.log("this.state!!!!!!", this.state);
      //初始化状态
      this.tableData = null;
      this.currentRow = null;
      this.selectedbydefault();
    },
    //选中行数
    handleCurrentChange(val) {
      console.log("state--",this.state)
      this.currentRow = val;
      console.log("this.currentRow", this.currentRow);
      if (this.state == 1) {
        this.getpatientdetails(0);
      }
      if (this.state == 2) {
        this.getpatientdetails(1);
      }
    },
    init() {
      // console.log("初始化了")
      this.state = 1;
      this.tableData = null;
      this.currentRow = null;
      this.partition = 0;
      this.shift = 0;
    },
    testsss() {
      this.state = 1;
    },
    //默认选中的
    selectedbydefault() {
      if (this.state == 1 && this.waitmount_data.length > 0) {
        this.$refs.table01.setCurrentRow(this.waitmount_data[0]);
        this.handleCurrentChange(this.waitmount_data[0]);
      }
      if (this.state == 2 && this.alreadmount_data.length > 0) {
        this.$refs.table02.setCurrentRow(this.alreadmount_data[0]);
        this.handleCurrentChange(this.alreadmount_data[0]);
      }
    },
    //包装selectedbydefault
    fun2() {
      console.log("3333333this.waitmount_data", this.waitmount_data);
      // return new Promise((resolve, reject) => {
      if (this.state == 1 && this.waitmount_data.length > 0) {
        this.$refs.table01.setCurrentRow(this.waitmount_data[0]);
        this.handleCurrentChange(this.waitmount_data[0]);
      }
      if (this.state == 2 && this.alreadmount_data.length > 0) {
        this.$refs.table02.setCurrentRow(this.alreadmount_data[0]);
        this.handleCurrentChange(this.alreadmount_data[0]);
      }
      // });
    },
    changeTimes() {
      this.gettodaynumber();
      this.getwaitmount();
      this.fun3();
    },
    //获取当天发药的人数
    gettodaynumber() {
      var params = {
        time: this.start_time,
      };
      todaynumber(params).then((res) => {
        if (res.data.state == 1) {
          console.log('3333333',res.data.data);
          this.waitmount = res.data.data.itotal;
          this.alreadmount = res.data.data.wtotal;
          this.drugList = res.data.data.drug
        }
      });
      // console.log("2222222")
    },
    //获取发药人列表
    getwaitmount() {
      var params = {
        keyword: this.keywords,
        time: this.start_time,
        shift: this.shift,
        partition: this.partition,
      };
      console.log("班次---------------------",params)
      waitingdrug(params).then((res) => {
        if (res.data.state == 1) {
          this.waitmount_data = res.data.data.list;
          this.baseList =[]
          this.baseList = res.data.data.baseList
          if (this.shift != 0 || this.partition != 0) {
            if (this.waitmount_data == null) {
              this.waitmount = 0;
            } else {
              this.waitmount = this.waitmount_data.length;
            }
          }
        }
      });
      issueddrugs(params).then((res) => {
        if (res.data.state == 1) {
          this.alreadmount_data = res.data.data.list;
          if (this.shift != 0 || this.partition != 0) {
            if (this.alreadmount_data == null) {
              this.alreadmount = 0;
            } else {
              this.alreadmount = this.alreadmount_data.length;
            }
          }
        }
      });
    },
    //包装getwaitmount
    async fun1() {
      // return new Promise((resolve, reject) => {
      var params = {
        keyword: this.keywords,
        time: this.start_time,
        shift: this.shift,
        partition: this.partition,
      };
      await waitingdrug(params).then((res) => {
        if (res.data.state == 1) {
          this.waitmount_data = res.data.data.list;
          console.log("1111111");
        }
      });
      await issueddrugs(params).then((res) => {
        if (res.data.state == 1) {
          this.alreadmount_data = res.data.data.list;
          console.log("1111111s");
        }
      });
      console.log("222222222");

      // })
    },
    //获取患者信息详情
    getpatientdetails(val) {
      console.log("val2332323223",this.currentRow)
      var params = {
        patient_id: this.currentRow.PatientID,
        is_medicine: val,
        time: this.start_time,
      };
      getpharmacycontent(params).then((res) => {
        if (res.data.state == 1) {
           var list = res.data.data.list;
           console.log("hhhhawoowowow",res.data.data)
           this.baseList =[]
          this.baseList = res.data.data.baseList
          this.doctors = res.data.data.doctors
          this.diagnosearr = res.data.data.diagnose
          this.diagnosis = res.data.data.prescription.diagnosis
          const obj={
            age:res.data.data.patients.age,
            gender: res.data.data.patients.gender,
            diagnose:res.data.data.patients.diagnose,
            zhixing:res.data.data.patients.created_time      
          }
          this.patients =obj
          if(this.$store.getters.xt_user.org.id == 10188 || this.$store.getters.xt_user.org.id == 10217 || this.$store.getters.xt_user.org.id == 10387 ||  this.$store.getters.xt_user.org.id == 0  ||  this.$store.getters.xt_user.org.id == 10480  ){
            this.tableData = []
            if(list!=null && list.length >0){
              for(let i=0;i<list.length;i++){
                if(list[i].DataSources != "临时医嘱"){
                  this.tableData.push(list[i])
                }
              }
            }

          }
          if(this.$store.getters.xt_user.org.id != 10188 && this.$store.getters.xt_user.org.id != 10217 && this.$store.getters.xt_user.org.id != 10387 && this.$store.getters.xt_user.org.id != 0 && this.$store.getters.xt_user.org.id != 10480 ){
            this.tableData = []
            this.tableData = list
          }
          console.log("tableDatawoowow",this.tableData)
        } else {
          this.$message.error(res.data.msg);
        }
      });
    },
    // 跳转打印页面
    toPrint() {
      if (this.tableData == null) {
        this.$message.error("未选择任何数据");
        return;
      }else{
        if(this.org_id != 10653 && this.org_id !=0){
          this.$refs.patientprint.show(
            this.tableData,
            this.currentRow,
            this.state,
            this.start_time
          );
        }else{
          this.$refs.patientprintTwo.show(
            this.tableData,
            this.currentRow,
            this.state,
            this.start_time,
            this.baseList,
            this.patients,
            this.doctors,
            this.diagnosearr,
            this.diagnosis,
          )
        }
      }

      
      
    },
    toExport() {
      import("@/vendor/Export2Excel").then((excel) => {
        for (let i = 0; i < this.tableData.length; i++) {
          this.tableData[i].index = i + 1;
          this.tableData[i].time = this.start_time;
          this.tableData[i].uname = this.currentRow.Name;
        }

        const tHeader = [
          "序号",
          "日期",
          "患者名称",
          "名称",
          "单次用量",
          "用法",
          "频率",
          "天数",
          "总量",
          "开立医生",
          "数据来源",
          "备注",
        ];
        const filterVal = [
          "index",
          "time",
          "uname",
          "Name",
          "SingleDosage",
          "Usage",
          "Frequency",
          "Days",
          "Total",
          "Doctor",
          "DataSources",
          "Remarks",
        ];

        const data = this.formatJson(filterVal, this.tableData);
        excel.export_json_to_excel({
          header: tHeader,
          data,
          filename: "领药单",
        });
        this.downloadLoading = false;
      });
    },
    formatJson(filterVal, jsonData) {
      return jsonData.map((v) => filterVal.map((j) => v[j]));
    },

    // 搜索患者
    searchAction() {
      this.tableData = null;
      this.getwaitmount();
      if (this.shift != 0 || this.partition != 0) {
      } else {
        this.gettodaynumber();
      }
    },

    // 药品发药
    dispense() {
      var tmp = this.currentRow.PatientID;
      var params = {
        patient_id: this.currentRow.PatientID,
        time: this.start_time,
      };
      this.$confirm("确定是否对该患者进行发药?", "患者发药", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
          dispensingmedicine(params).then((res) => {
            if (res.data.state == 1) {
              this.$message.success("操作成功");
              this.gettodaynumber();
              this.searchAction();
              this.tableData = null;
              this.fun4(tmp);
              this.state = 2;
           
            } else {
              this.$message.error(res.data.msg);
            }
          });
        })
        .catch(() => {});
    },

    toSetting() {
      getPharmacyConfig().then((response) => {
        if (response.data.state == 1) {
          this.dialogVisible = true;
          var config = response.data.data.config;
          this.is_open = config.is_open.toString();
        }
      });
    },
    SaveSetting() {
      var params = {
        is_open: parseInt(this.is_open),
      };
      SaveSetting(params).then((response) => {
        if (response.data.state == 1) {
          var config = response.data.data.config;
          this.$message.success("保存成功!");
          this.dialogVisible = false;
        }
      });
    },
    // 药品退药
    endispense() {
      var tmp = this.currentRow.PatientID;
      var params = {
        patient_id: this.currentRow.PatientID,
        time: this.start_time,
      };
      this.$confirm("确定是否对该患者进行退药?", "患者退药", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
          drugwithdrawal(params).then((res) => {
            if (res.data.state == 1) {
              this.$message.success("操作成功");
              this.gettodaynumber();
              this.searchAction();
              this.tableData = null;
              this.fun5(tmp);
              this.state = 1;
            } else {
              this.$message.error(res.data.msg);
            }
          });
        })
        .catch(() => {});
    },
    getDrugName(drug_id){
    
      var  medical_insurance_number = ""
      for(let i=0;i<this.drugList.length;i++){
       if(drug_id == this.drugList[i].id){
        medical_insurance_number = this.drugList[i].medical_insurance_number
       }
      }
      return medical_insurance_number
    },
    getManutuer(drug_id){
       var manufacturer_name = ""
       for(let i=0;i<this.baseList.length;i++){
         if(drug_id == this.baseList[i].id){
            manufacturer_name = this.baseList[i].manufacturer_name
         }
       }
       return manufacturer_name
    },
    getSpecaiName(drug_id){
       var spc =""
       for(let i=0;i<this.baseList.length;i++){
         if(drug_id == this.baseList[i].id){
           spc = this.baseList[i].dose + this.baseList[i].dose_unit +"*"+this.baseList[i].min_number+this.baseList[i].min_unit+"/"+this.baseList[i].max_unit
         }
       }
       return spc
    },
    changeDrugCode(id,DataSources,drug_code){
       var is_source =0
       if (DataSources == "his处方"){
        is_source = 1
       }
       if (DataSources == "临时医嘱"){
         is_source = 2
       }
       var params = {
        id:id,
        data_source:is_source,
        drug_code:drug_code,
       }
       console.log("paramss",params)
      changeDrugCode(params).then(response=>{
         if(response.data.state == 1){
            this.$message.success("保存成功!")
         }
      })
    

    }
  },
};
</script>

<style rel="stylesheet/css" lang="scss" scoped>
.new-main-contain {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.app-container {
  height: 100%;
}
.mainLeft {
  width: 200px;
  height: 100%;
  display: flex;
  flex-direction: column;

  .el-radio {
    margin-right: 5px;
  }

  .list {
    margin: 10px 0;
  }
}
.mainRight {
  margin-left: 10px;
  flex: 1;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  .titlelist {
    display: flex;
    justify-content: space-between;
    white-space: nowrap;
    color: #909399;
    font-size: 14px;
    /deep/ .el-input__inner {
      font-size: 13px !important;
    }
  }
  .el-table {
    margin-top: -13px;
  }
  .el-button {
    height: 34px;
    width: 65px;
  }
  /deep/ .el-divider {
    height: 2px;
    margin-top: 10px;
  }

  /deep/ .el-table__body-wrapper {
    overflow-x: scroll !important;
  }
}

/deep/ .el-input__inner {
  padding-right: 15px;
}

/deep/ .el-table--scrollable-x .el-table__body-wrapper {
  overflow: auto;
  overflow-x: hidden;
}
/deep/ .gutter {
  width: 15px !important;
  display: inline-block !important;
}
/deep/ .el-table__fixed-right-patch {
  width: 15px !important;
}

/deep/ .el-table__fixed-right {
  bottom: 0 !important;
  left: auto;
  right: 0;
}
/deep/ .el-table__body-wrapper::-webkit-scrollbar {
  width: 15px !important;
  height: 15px !important;
}
</style>