yxh

yxh

2024-01-03 ad33e8834b09f52f3751be207b75346ab6be7494

yxh

 src/api/project/organcharge.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,53 @@
import request from '@/utils/request'

// æŸ¥è¯¢äººä½“器官获取费用列表
export function listOrgancharge(query) {
  return request({
    url: '/project/organcharge/list',
    method: 'get',
    params: query
  })
}

// æŸ¥è¯¢äººä½“器官获取费用详细
export function getOrgancharge(id) {
  return request({
    url: '/project/organcharge/getInfo/' + id,
    method: 'get'
  })
}

// æ–°å¢žäººä½“器官获取费用
export function addOrgancharge(data) {
  return request({
    url: '/project/organcharge/add',
    method: 'post',
    data: data
  })
}

// ä¿®æ”¹äººä½“器官获取费用
export function updateOrgancharge(data) {
  return request({
    url: '/project/organcharge/edit',
    method: 'post',
    data: data
  })
}

// åˆ é™¤äººä½“器官获取费用
export function delOrgancharge(id) {
  return request({
    url: '/project/organcharge/remove' + id,
    method: 'get'
  })
}

// å¯¼å‡ºäººä½“器官获取费用
export function exportOrgancharge(query) {
  return request({
    url: '/project/organcharge/export',
    method: 'get',
    params: query
  })
}

 src/views/project/donorcharge/donorcharge/index.vue

ÎļþÃû´Ó src/views/project/donorcharge/index.vue ÐÞ¸Ä
@@ -47,24 +47,19 @@
          <span>{{ parseTime(scope.row.donatetime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="OPO编号" align="center" prop="donateno" />
      <el-table-column label="案例编号" align="center" prop="donateno" />
      <el-table-column label="捐献姓名" align="center" prop="name" />
      <el-table-column label="出生年月" align="center" prop="borthdate" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.borthdate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="性别" align="center" prop="sex" />
      <el-table-column label="年龄" align="center" prop="age" />
      <el-table-column label="捐献类别" align="center" prop="donationcategory" />
      <el-table-column label="捐献器官" align="center" prop="donateorgan" />
      <el-table-column label="实收费用" align="center" prop="chargeamounted" />
      <el-table-column label="应收费用" align="center" prop="chargeamount" />
      <el-table-column label="已收费用" align="center" prop="chargeamounted" />
      <el-table-column label="备注" align="center" prop="remark" />
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
      <el-table-column label="操作" align="center">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
            v-hasPermi="['system:donorcharge:edit']">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleDetail(scope.row)"
            v-hasPermi="['system:donorcharge:edit']">详情</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
            v-hasPermi="['system:donorcharge:remove']">删除</el-button>
        </template>
@@ -132,16 +127,87 @@
              <el-input v-model="form.remark" placeholder="请输入备注" />
            </el-form-item></el-col>
        </el-row>
        <el-row>
          <el-table :data="donorchargerogans" v-loading="loading" max-height="1200" border highlight-current-row>
            <el-table-column prop="orderno" align="center" label="序号" width="80">
              <template slot-scope="scope">
                <el-input v-model="scope.row.orderno" placeholder="序号" />
              </template>
            </el-table-column>
            <el-table-column prop="organno" align="center" label="器官编号" width="90">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organno" placeholder="器官编号" />
              </template>
            </el-table-column>
            <el-table-column prop="organname" align="center" label="器官名称" width="100">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organname" placeholder="器官名称" />
              </template>
            </el-table-column>
            <el-table-column prop="hospitalname" align="center" label="接收医院" width="200">
              <template slot-scope="scope">
                <el-input v-model="scope.row.hospitalname" placeholder="接收医院" />
              </template>
            </el-table-column>
            <el-table-column prop="amounttime" align="center" label="接收时间" width="120">
              <template slot-scope="scope">
                <el-date-picker clearable size="small" style="width: 100%" v-model="scope.row.amounttime" type="date"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="接收时间">
                </el-date-picker> </template>
            </el-table-column>
            <el-table-column prop="amount" align="center" label="已收费用" width="120">
              <template slot-scope="scope">
                <el-input v-model="scope.row.amount" placeholder="已收费用" />
              </template>
            </el-table-column>
            <el-table-column prop="amounttime" align="center" label="收款时间" width="120">
              <template slot-scope="scope">
                <el-date-picker clearable size="small" style="width: 100%" v-model="scope.row.amounttime" type="date"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="收款时间" @blur="getdays(scope.row)">
                </el-date-picker> </template>
            </el-table-column>
            <el-table-column prop="organcharge" align="center" label="标准费用" width="120">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organcharge" placeholder="已收费用" />
              </template>
            </el-table-column>
            <el-table-column prop="remark" align="center" label="备注">
              <template slot-scope="scope">
                <el-input v-model="scope.row.remark" placeholder="备注" />
              </template>
            </el-table-column>
          </el-table>
        </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 :visible.sync="showSelectionDialog" :close-on-click-modal="false" :title="'请选择捐献案例'" width="500px"
      style="text-align: center" v-loading="loading">
      <el-form ref="selectionForm" :model="selectionForm">
        <el-row>
          <el-form-item label="捐献者名字：" prop="donorname" label-width="120px">
            <el-select v-model="selectionForm.donorid" filterable reserve-keyword default-first-option
              placeholder="请输入捐献者的姓名" style="width: 100%">
              <el-option v-for="item in donorlist" :key="item.donorid" :label="item.donorname" :value="item.donorid">
              </el-option>
            </el-select>
          </el-form-item>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showSelectionDialog = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="confirmSelection()">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { listDonatebaseinfo } from "@/api/project/donatebaseinfo";
import { listDonorcharge, getDonorcharge, delDonorcharge, addDonorcharge, updateDonorcharge, exportDonorcharge, listDonorchargeorgan, getDonorchargeorgan, delDonorchargeorgan, addDonorchargeorgan, updateDonorchargeorgan, exportDonorchargeorgan } from "@/api/project/donorcharge";
export default {
  name: "Donorcharge",
@@ -161,27 +227,46 @@
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      //当前案例id
      curInfoId: 0,
      // æçŒ®æ¡ˆä¾‹å™¨å®˜åˆ—表格数据
      donorchargeList: [],
      donorchargerogans: [],
      //捐献案例选择
      showSelectionDialog: false,
      donorlist: [],
      donorinfolist: [],
      selectionForm: {
        index: null,
        donorid: null,
        donorname: null
      },
      loadingdonorlist: false,

      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æŸ¥è¯¢å‚æ•°
      // æŸ¥è¯¢è´¹ç”¨è¡¨å‚æ•°
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        infoid: null,
        donateno: null,
        donatetime: null,
        name: null,
        borthdate: null,
        sex: null,
        age: null,
        donationcategory: null,
        donateorgan: null,
        chargeamount: null,
        chargeamounted: null,
      },
      //查询案例参数
      donorParams: {
        pageNum: 1,
        pageSize: 1000,
      },
      // æŸ¥è¯¢è´¹ç”¨å™¨å®˜è¡¨å‚æ•°
      organParams: {
        pageNum: 1,
        pageSize: 10,
        donorchargeid: null,
      },
      // è¡¨å•å‚æ•°
      form: {},
@@ -193,7 +278,24 @@
  created() {
    this.getList();
  },

  methods: {
    //专家/医疗机构/费用报销机构选择
    confirmSelection() {
      var curdonorinfo = null;
      //从案例列表获取信息
      this.donorinfolist.map(item => {
        if (this.selectionForm.donorid == item.id) {
          curdonorinfo = item;
        }
      });
      this.showSelectionDialog = false;
      this.$router.push({
        path: "/finance/donorchargedetail/",
        query: { id: 0, operation: "add", data: curdonorinfo }
      });
    },

    /** æŸ¥è¯¢æçŒ®æ¡ˆä¾‹å™¨å®˜åˆ—列表 */
    getList() {
      this.loading = true;
@@ -203,6 +305,7 @@
        this.loading = false;
      });
    },

    // å–消按钮
    cancel() {
      this.open = false;
@@ -250,20 +353,102 @@
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.selectionForm.index = null;
      this.selectionForm.donorid = null;
      this.selectionForm.donorname = null;

      if (this.donorlist[0]) {
        this.showSelectionDialog = true;
      }
      else {
        //获取捐献案例列表
        if (this.donorlist.length>0) { }
        else {
          this.loading = true;
          listDonatebaseinfo(this.donorParams).then(res => {
            this.donorinfolist = res.rows;
            this.donorinfolist.forEach(item => {
              this.donorlist.push({
                donorid: item.id,
                donorname: item.name
              });
            });
            this.loading = false;
          });
        }

        this.showSelectionDialog = true;
      };

      /** 
      this.reset();
      this.open = true;
      this.title = "添加捐献案例器官列";
      this.title = "捐献案例器官费用情况";
      this.donorchargerogans = [];
      */
    },

    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.$router.push({
        path: "/finance/donorchargedetail/",
        query: { id: row.id, operation: "update", data: row }
      });

      /** 
      this.reset();
      const id = row.id || this.ids
      getDonorcharge(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改捐献案例器官列";
        this.title = "修改捐献案例器官费用情况";

        //器官费用信息
        // this.organParams.infoid = row.infoid;
        this.organParams.donorchargeid = row.id;
        listDonorchargeorgan(this.organParams).then(res => {
          console.log(res);
          this.donorchargerogans = res.rows;
          if (this.donorchargerogans.length > 0) {
          } else {
            this.addRow(0);
          }
        });
      });
      */
    },

    /** è¯¦æƒ…查看按钮操作 */
    handleDetail(row) {
      this.$router.push({
        path: "/finance/donorchargedetail/",
        query: { id: row.id, operation: "detail", data: row }
      });
    },

    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除捐献案例器官列编号为"' + ids + '"的数据项？').then(function () {
        return delDonorcharge(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => { });
    },

    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      const queryParams = this.queryParams;
      this.$modal.confirm('是否确认导出所有捐献案例器官列数据项？').then(() => {
        this.exportLoading = true;
        return exportDonorcharge(queryParams);
      }).then(response => {
        this.$download.name(response.msg);
        this.exportLoading = false;
      }).catch(() => { });
    },

    /** æäº¤æŒ‰é’® */
    submitForm() {
      this.$refs["form"].validate(valid => {
@@ -284,27 +469,6 @@
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除捐献案例器官列编号为"' + ids + '"的数据项？').then(function () {
        return delDonorcharge(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => { });
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      const queryParams = this.queryParams;
      this.$modal.confirm('是否确认导出所有捐献案例器官列数据项？').then(() => {
        this.exportLoading = true;
        return exportDonorcharge(queryParams);
      }).then(response => {
        this.$download.name(response.msg);
        this.exportLoading = false;
      }).catch(() => { });
    }
  }
};
</script>

 src/views/project/donorcharge/donorchargedetail/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1003 @@
<template>
  <div class="Modifydetailscla">
    <div class="boxdiv">
      <div class="top-text">{{ title }}</div>
      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
        <el-row>
          <el-col :span="5">
            <el-form-item label="案例姓名" prop="name">
              <el-input v-model="form.name" placeholder="请输入姓名" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="性别" prop="sex">
              <el-select v-model="form.sex" placeholder="请输入性别">
                <el-option v-for="dict in dict.type.sys_user_sex" :key="dict.label" :label="dict.label"
                  :value="parseInt(dict.value)"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="年龄" prop="age">
              <el-input v-model="form.age" placeholder="请输入年龄" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="出生年月" prop="borthdate">
              <el-date-picker clearable size="small" v-model="form.borthdate" type="date" value-format="yyyy-MM-dd"
                placeholder="选择出生年月">
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row><el-row><el-col :span="10"><el-form-item label="案例编号" prop="donateno">
              <el-input v-model="form.donateno" placeholder="请输入案例编号" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="案例时间" prop="donatetime">
              <el-date-picker clearable size="small" v-model="form.donatetime" type="date" value-format="yyyy-MM-dd"
                placeholder="选择捐献时间">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="捐献类别" prop="donationcategory">
              <el-input v-model="form.donationcategory" placeholder="请输入捐献类别" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="5">
            <el-form-item label="应收金额" prop="chargeamount">
              <el-input v-model="form.chargeamount" placeholder="请输入应收金额" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="实收金额" prop="chargeamounted">
              <el-input v-model="form.chargeamounted" placeholder="请输入实收金额" :disabled="true" />
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="备注" prop="remark">
              <el-input v-model="form.remark" placeholder="请输入备注" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row style="margin-top: 10px">
          <el-table :data="donorchargeorgans" ref="table" border max-height="800" highlight-current-row
            :summary-method="getSummaries" show-summary>
            <el-table-column prop="organno" align="center" label="器官编号" width="90">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organno" placeholder="器官编号" :disabled="true" />
              </template>
            </el-table-column>
            <el-table-column prop="organname" align="center" label="器官名称" width="120">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organname" placeholder="器官名称" />
              </template>
            </el-table-column>
            <el-table-column prop="amount" align="center" label="实收金额" width="150">
              <template slot-scope="scope">
                <el-input v-model="scope.row.amount" placeholder="实收金额" />
              </template>
            </el-table-column>
            <el-table-column prop="amounttime" align="center" label="实收时间" width="200">
              <template slot-scope="scope">
                <el-date-picker clearable size="small" style="width: 100%" v-model="scope.row.amounttime" type="date"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="实收时间">
                </el-date-picker> </template>
            </el-table-column>
            <el-table-column prop="organcharge" align="center" label="标准费用" width="150">
              <template slot-scope="scope">
                <el-input v-model="scope.row.organcharge" placeholder="标准费用" />
              </template>
            </el-table-column>
            <el-table-column prop="hospitalname" align="center" label="接收医院" width="280">
              <template slot-scope="scope">
                <el-input v-model="scope.row.hospitalname" placeholder="接收医院" />
              </template>
            </el-table-column>
            <el-table-column prop="organtime" align="center" label="移植时间" width="200">
              <template slot-scope="scope">
                <el-date-picker clearable size="small" style="width: 100%" v-model="scope.row.organtime" type="date"
                  value-format="yyyy-MM-dd HH:mm:ss" placeholder="移植时间">
                </el-date-picker> </template>
            </el-table-column>
            <el-table-column prop="remark" align="center" label="备注">
              <template slot-scope="scope">
                <el-input v-model="scope.row.remark" placeholder="备注" />
              </template>
            </el-table-column>
          </el-table>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" v-if="operationType == 'add' || operationType == 'update'">保
          å­˜</el-button>
        <el-button type="primary" @click="cancel">关闭</el-button>
      </div>
    </div>

    <el-dialog v-dialogDrags :modal="false" :close-on-click-modal="false" :title="pdftitle" :visible.sync="pdfVisible"
      width="60%">
      <el-tabs style="margin-top: 20px;" v-model="activeName" type="border-card" @tab-click="handleClick">
        <el-tab-pane label="普通附件" :name="1">
          <div class="pdfimg">
            <div class="box-pdf">
              <div>
                <el-upload size="mini" class="upload-demo" :action="uploadFileUrl" :file-list="fileListto"
                  :show-file-list="false" multiple drag :headers="headers" :on-success="(response, file, fileList) =>
                    uploadSccess(response, file, fileList)
                    " :on-preview="downFile" :disabled="operationType == 'detail'" :on-error="handleUploadError"
                  :on-remove="remove" accept="image/*,.pdf">
                  <i class="el-icon-upload"></i>
                  <div class="el-upload__text">
                    å°†ç¥¨æ®æ‹–到此处，或
                    <em><el-button :disabled="operationType == 'detail'" size="small" type="primary">点击上传</el-button></em>
                  </div>
                </el-upload>
                <el-table :data="fileListto" @row-click="downFile" style="width: 100%" height="400">
                  <el-table-column prop="name" :show-overflow-tooltip="true" label="名称">
                    <template slot-scope="scope">
                      <i style="color:#409EFF" class=" el-icon-s-order" />{{
                        scope.row.name
                      }}
                    </template>
                  </el-table-column>

                  <el-table-column prop="name" width="180" :show-overflow-tooltip="true" label="功能">
                    <template slot-scope="scope">
                      <el-button type="primary" size="mini"
                        @click.native.prevent.stop="deletedowfile(scope.row)">删除</el-button>
                      <el-button type="primary" size="mini"
                        @click.native.prevent.stop="moveupdowfile(scope.row)">上移</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>

            <div v-if="this.previewpdf && pdfimgsrcList.length" class="pdfimgmin">
              <!-- <img :src="pdfimg" /> -->
              <el-image style="width: 95%; height: 90%" :src="pdfimg" :preview-src-list="pdfimgsrcList">
                <!-- <div slot="error" class="image-slot">
              <i class="el-icon-picture-outline"></i>
            </div> -->
              </el-image>
            </div>
            <div v-else class="pdfimgmins">{{ hintitle }}</div>
          </div>
        </el-tab-pane>
        <el-tab-pane label="发票文件" :name="2">
          <div class="pdfimg">
            <div class="box-pdf">
              <div>
                <el-upload size="mini" class="upload-demo" :action="uploadFileUrl" :file-list="invoicefileList"
                  :show-file-list="false" multiple drag :headers="headers" :on-success="(response, file, fileList) =>
                    uploadSccess(response, file, fileList)
                    " :on-preview="downFile" :disabled="operationType == 'detail'" :on-error="handleUploadError"
                  :on-remove="remove" accept="image/*,.pdf">
                  <i class="el-icon-upload"></i>
                  <div class="el-upload__text">
                    å°†å‘票文件拖到此处，或
                    <em><el-button :disabled="operationType == 'detail'" size="small" type="primary">点击上传</el-button></em>
                  </div>
                </el-upload>
                <el-table :data="invoicefileListto" @row-click="downFile" style="width: 100%" height="400">
                  <el-table-column prop="name" :show-overflow-tooltip="true" label="名称">
                    <template slot-scope="scope">
                      <i style="color:#409EFF" class=" el-icon-s-order" />{{
                        scope.row.name
                      }}
                    </template>
                  </el-table-column>

                  <el-table-column prop="name" width="180" :show-overflow-tooltip="true" label="功能">
                    <template slot-scope="scope">
                      <el-button type="primary" size="mini"
                        @click.native.prevent.stop="deletedowfile(scope.row)">删除</el-button>
                      <el-button type="primary" size="mini"
                        @click.native.prevent.stop="moveupdowfile(scope.row)">上移</el-button>
                    </template>
                  </el-table-column>
                </el-table>
              </div>
            </div>

            <div v-if="this.previewpdf && invoicepdfimgsrcList.length" class="pdfimgmin">
              <el-image style="width: 95%; height: 90%" :src="invoicepdfimg" :preview-src-list="invoicepdfimgsrcList">
              </el-image>
            </div>
            <div v-else class="pdfimgmins">{{ hintitle }}</div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>
    <el-dialog title="提示" :visible.sync="Savereminder" width="30%">
      <el-alert :title="'您已添加' +
        totalquantity +
        '条数据，为防止数据丢失是否提交保存再继续添加。'
        " type="warning">
      </el-alert>
      <span slot="footer" class="dialog-footer">
        <el-button @click="unsave">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="Savenow">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import pdf from "vue-pdf";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import { regionDataPlus, CodeToText } from "element-china-area-data";
import { getDonorcharge, addDonorcharge, updateDonorcharge, listDonorchargeorgan, getDonorchargeorgan, delDonorchargeorgan, addDonorchargeorgan, updateDonorchargeorgan, exportDonorchargeorgan } from "@/api/project/donorcharge";
import { listDonatebaseinfo } from "@/api/project/donatebaseinfo";
import { listDonatecomporgan } from "@/api/project/donatecompletioninfo";
import { listOrgancharge } from "@/api/project/organcharge";
import Li_area_select from "@/components/Address";
import { getUserProfile } from "@/api/system/user";
import { getToken } from "@/utils/auth";
import debounce from "lodash/debounce";
export default {
  components: {
    Treeselect,
    Li_area_select,
    pdf
  },
  dicts: [
    "sys_user_sex",
    "sys_0_1",
  ],
  name: "Donorcharge",
  data() {
    return {
      activeName: 1, //文件类型
      // éƒ¨é—¨æ ‘选项

      //票据文件
      pdftitle: "",
      pdfimg: "",
      pdfVisible: false,
      costtypeobj: {
        value: 0,
        label: ""
      },
      pdfimgsrcList: [],
      Savereminder: false, //提醒保存弹框
      Reminderquantity: 0, //提醒数量
      totalquantity: 0, //总数量

      hintitle: "选中左侧已上传文件预览查看",
      atpresent: "",
      iframeurl: "",
      options: regionDataPlus,
      selectedOptions: [],
      value1: "",
      previewpdf: false,
      // é®ç½©å±‚
      loading: true,
      // å¯¼å‡ºé®ç½©å±‚
      exportLoading: false,
      // ç½‘络请求头
      Networkheader: null,

      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // æçŒ®æ¡ˆä¾‹å™¨å®˜åˆ—表格数据
      donorchargeList: [],
      donorchargeorgans: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æŸ¥è¯¢è´¹ç”¨è¡¨å‚æ•°
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        infoid: null,
        name: null,
        donationcategory: null,
        donateorgan: null,
        chargeamounted: null,
      },
      // æŸ¥è¯¢è´¹ç”¨å™¨å®˜è¡¨å‚æ•°
      organParams: {
        pageNum: 1,
        pageSize: 10,
        donorchargeid: null,
      },

      // å½“前用户信息
      userprofile: {},
      // è¡¨å•å‚æ•°
      form: {},
      reimbursementList: [],

      // è¡¨å•æ ¡éªŒ
      rules: {
        reason: [
          { required: true, message: "请输入出差事由", trigger: "blur" }
        ],
        deptmentname: [
          { required: true, message: "请输入所属业务组", trigger: "blur" }
        ]
      },

      baselist: [],
      donorList: [],
      organchargelist: [],
      standardlevel: 0,
      defaultperson: {},
      fundflowList: [],
      showApproveRecordDialog: false,

      // å½“前单据ID
      curId: 0,
      curCase: null,
      //业务操作类型
      operationType: "edit",

      //上传发票文件路径
      uploadFileUrl: process.env.VUE_APP_BASE_API + "/common/upload",
      //文件列表
      fileList: [],
      fileListto: [],
      invoicefileList: [],
      invoicefileListto: [],
      invoicepdfimg: "",
      invoicepdfimgsrcList: [],
      invoDatatop: [],
      //人员类别
      persontype: null,

      headers: {
        Authorization: "Bearer " + getToken()
      },

      jurisdiction: false,

      //保存按钮控制
      idisabled: false
    };
  },

  created() {
    console.log(234);
    this.Getnetworkheader();

    //获取登录者信息
    getUserProfile().then(response => {
      this.userprofile = response.data;
      this.defaultperson = response.data;
      this.standardlevel = response.data.standardlevel;
    });


    //获取参数
    this.getroute();
  },

  mounted() {
    window.addEventListener("beforeunload", e => this.beforeunloadHandler(e));
  },

  updated() {
    this.$nextTick(() => {
      this.$refs["table"].doLayout();
    });
  },
  
  destroyed() {
    window.removeEventListener("beforeunload", e => this.beforeunloadFn(e));
  }, //生命周期 - é”€æ¯å®Œæˆ

  methods: {
    // æµè§ˆå™¨é¡µé¢å…³é—­æˆ–刷新提示
    beforeunloadHandler(e) {
      if (
        (JSON.stringify(this.form) == sessionStorage.getItem("apiform") &&
          JSON.stringify(this.donorchargeorgans) ==
          sessionStorage.getItem("apifunddetail")) ||
        !sessionStorage.getItem("apifunddetail")
      ) {
      } else {
        this._beforeUnload_time = new Date().getTime();
        e = e || window.event;
        if (e) {
          e.returnValue = "关闭提示";
        }
        return "关闭提示";
      }
    },

    handleUploadError() { },
    // èŽ·å–请求头
    Getnetworkheader() {
      let string = window.location.href;
      if (string.includes("9091")) {
        const index = string.indexOf("9091");
        this.Networkheader = string.slice(0, index + 4); // æˆªå–9091及其前部字符
      } else {
        const index = string.indexOf("8032");
        this.Networkheader = string.slice(0, index + 4); // æˆªå–8032及其前部字符
      }
    },
    // å‘票切换
    handleClick(tab, event) {
      if (this.activeName == 1) {
        this.pdftitle = "共" + this.pdfimgsrcList.length + "项";
      } else {
        this.pdftitle = "共" + this.invoicepdfimgsrcList.length + "项";
      }
    },
    remove(file, fileList) {
      const donorchargeorgans = [...this.donorchargeorgans];
      if (this.activeName == 1) {
        this.fileListto.splice(this.fileListto.indexOf(file), 1);
        donorchargeorgans[this.atpresent].annexfilesList = this.fileListto;
      } else {
        this.invoicefileListto.splice(this.invoicefileListto.indexOf(file), 1);
        donorchargeorgans[this.atpresent].invoicefilesList = this.invoicefileListto;
      }
    },

    handleExceed() {
      this.$message.error(`上传文件数量不能超过 ${5} ä¸ª!`);
    },

    //文件上传成功回调
    uploadSccess(response, file, fileList) {
      this.donorchargeorgans;
      //获取票据信息位置
      if (this.activeName == 1) {
        if (response.code == 200) {
          // this.form.filename = file.raw.name;
          this.previewpdf = true;
          this.$modal.msgSuccess(response.msg);
          this.fileListto.push({
            name: file.name,
            url: response.fileName
          });
          this.pdfimgsrcList.push(
            this.Networkheader + "/prod-api" + response.fileName
          );

          this.pdftitle = "共" + this.pdfimgsrcList.length + "项";
          this.pdfimg = this.Networkheader + "/prod-api" + response.fileName;
          this.donorchargeorgans[this.atpresent].annexfilesList = this.fileListto;
        } else {
          console.log(response.msg);
        }
      } else {
        if (response.code == 200) {
          // this.form.filename = file.raw.name;
          this.previewpdf = true;
          this.$modal.msgSuccess(response.msg);
          this.invoicefileListto.push({
            name: file.name,
            url: response.fileName
          });
          this.invoicepdfimgsrcList.push(
            this.Networkheader + "/prod-api" + response.fileName
          );

          this.pdftitle = "共" + this.invoicepdfimgsrcList.length + "项";
          this.pdfimg = this.Networkheader + "/prod-api" + response.fileName;
          this.donorchargeorgans[
            this.atpresent
          ].invoicefilesList = this.invoicefileListto;
        } else {
          console.log(response.msg);
        }
      }
    },
    // ç‚¹å‡»ç¥¨æ®
    Filepopup(index, rows, row) {
      this.tableDatatop = [];
      this.pdfimgsrcList = [];
      this.invoDatatop = [];
      this.invoicepdfimgsrcList = [];
      this.invoDatatop.push(row);
      this.tableDatatop.push(row);
      this.atpresent = index;
      this.pdfVisible = true;


      if (this.donorchargeorgans[index].annexfilesList) {
        this.previewpdf = true;
        this.fileListto = this.donorchargeorgans[index].annexfilesList;
        this.pdfimg = this.Networkheader + "/prod-api" + this.fileListto[0].url;
        this.fileListto.forEach(item => {
          this.pdfimgsrcList.push(this.Networkheader + "/prod-api" + item.url);
        });
      } else {
        this.fileListto = [];
        this.pdfimg = "";
        this.pdftitle = "";
      }
      // -发票文件
      if (this.donorchargeorgans[index].invoicefilesList) {
        this.previewpdf = true;
        this.invoicefileListto = this.donorchargeorgans[index].invoicefilesList;
        this.invoicepdfimg =
          this.Networkheader + "/prod-api" + this.invoicefileListto[0].url;
        this.invoicefileListto.forEach(item => {
          this.invoicepdfimgsrcList.push(
            this.Networkheader + "/prod-api" + item.url
          );
        });

      } else {
        this.invoicefileListto = [];
        this.invoicepdfimg = "";
        this.pdftitle = "";
      }

      if (this.activeName == 1) {
        this.pdftitle = "共" + this.pdfimgsrcList.length + "项";
      } else {
        this.pdftitle = "共" + this.invoicepdfimgsrcList.length + "项";
      }
    },

    // ç‚¹å‡»å·²ä¸Šä¼ æ–‡ä»¶
    downFile(item) {
      if (this.activeName == 1) {
        this.pdftitle =
          "共" + this.pdfimgsrcList.length + "项，当前选中" + item.name;
        let name = item.name.split(".");
        if (name[1] == "pdf") {
          this.$modal.msgWarning("当前文件暂不支持预览");
          this.previewpdf = false;
          this.hintitle = "当前文件暂不支持预览";
        } else if (name[1] == "jpg" || "png") {
          this.previewpdf = true;
          if (item.url) {
            this.pdfimg = this.Networkheader + "/prod-api" + item.url;
          } else {
            this.pdfimg = this.Networkheader + "/prod-api" + item.response.url;
          }
        } else {
          this.hintitle = "当前文件暂不支持预览";
          this.$modal.msgWarning("当前文件暂不支持预览");
          this.previewpdf = false;
        }
      } else {
        console.log(item, "点击文件拿item");
        this.pdftitle =
          "共" + this.invoicepdfimgsrcList.length + "项，当前选中" + item.name;
        let name = item.name.split(".");
        if (name[1] == "pdf") {
          this.$modal.msgWarning("当前文件暂不支持预览");
          this.previewpdf = false;
          this.hintitle = "当前文件暂不支持预览";
        } else if (name[1] == "jpg" || "png") {
          this.previewpdf = true;
          if (item.url) {
            this.invoicepdfimg = this.Networkheader + "/prod-api" + item.url;
          } else {
            this.invoicepdfimg =
              this.Networkheader + "/prod-api" + item.response.url;
          }
        } else {
          this.hintitle = "当前文件暂不支持预览";
          this.$modal.msgWarning("当前文件暂不支持预览");
          this.previewpdf = false;
        }
      }
    },
    getIndexInArray(arr, obj) {
      return arr.indexOf(obj);
    },
    // ç‚¹å‡»åˆ é™¤
    deletedowfile(row) {
      if (this.activeName == 1) {
        const indexlist = this.getIndexInArray(
          this.pdfimgsrcList,
          this.Networkheader + "/prod-api" + row.url
        );
        this.pdfimgsrcList.splice(indexlist, 1);
        const index = this.getIndexInArray(this.fileListto, row);
        this.fileListto.splice(index, 1);
      } else {
        const indexlist = this.getIndexInArray(
          this.invoicepdfimgsrcList,
          this.Networkheader + "/prod-api" + row.url
        );
        this.invoicepdfimgsrcList.splice(indexlist, 1);
        const index = this.getIndexInArray(this.invoicefileListto, row);
        this.invoicefileListto.splice(index, 1);
      }
    },
    // ç‚¹å‡»ä¸Šç§»
    moveupdowfile(row) {
      if (this.activeName == 1) {
        const index = this.getIndexInArray(this.fileListto, row);
        const item = this.fileListto.splice(index, 1)[0]; // ç§»é™¤æŒ‡å®šç´¢å¼•å¤„的元素，并保存到item变量中
        this.fileListto.splice(index - 1, 0, item); // å°†item插入到索引位置的前一位
      } else {
        const index = this.getIndexInArray(this.invoicefileListto, row);
        const item = this.invoicefileListto.splice(index, 1)[0]; // ç§»é™¤æŒ‡å®šç´¢å¼•å¤„的元素，并保存到item变量中
        this.invoicefileListto.splice(index - 1, 0, item); // å°†item插入到索引位置的前一位
      }
    },

    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        id: null,
        infoid: null,
        donateno: null,
        donatetime: null,
        name: null,
        borthdate: null,
        sex: null,
        age: null,
        donationcategory: null,
        donateorgan: null,
        chargeamount: null,
        chargeamounted: null,
        remark: null,
        delFlag: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null
      };
      this.resetForm("form");
    },

    /** é€šè¿‡å‚数获取业务类型 */
    getroute() {
      //选择业务类型:1、新增；2、修改；3、查看
      this.operationType = this.$route.query.operation;
      this.curId = this.$route.query.id;
      this.curCase = this.$route.query.data;
      console.log("this.$route.query",this.$route.query);

      if (this.operationType == "add") {
        this.title = "新建案例器官费用表";
        this.handleAdd();
        console.log("1")

      } else if (this.operationType == "update") {
        this.title = "修改案例器官费用表";
        this.handleUpdate();
        console.log("2")

      } else if (this.operationType == "detail") {
        this.title = "查看案例器官费用表";
        this.handleDetail();
        console.log("3")
      }
    },

    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },

    // å–消按钮
    cancel() {
      this.$store.dispatch("tagsView/delView", this.$route);
      this.$router.go(-1);
    },

    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length
    },

    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "新增捐献案例器官费用表";

      if (this.curCase) {
        this.form.infoid = this.curCase.id;
        this.form.donateno = this.curCase.donorno;
        this.form.donatetime = this.curCase.donatetime;
        this.form.name = this.curCase.name;
        this.form.borthdate = this.curCase.birthday;
        this.form.sex = this.curCase.sex;
        this.form.age = this.curCase.age;
        this.form.donationcategory = this.curCase.donationcategory;

        //获取完成登记的器官表
        if (this.curCase.id > 0) { }
        else { this.curCase.id = 0 }
        let searchParam = {
          infoid: this.curCase.id
        };
        listDonatecomporgan(searchParam).then(res => {
          if (res.code == 200) {
            // æŸ¥è¯¢å™¨å®˜è´¹ç”¨è¡¨
            let tempParam = {
              organcode: null,
              organname: null,
              charge: null
            };
            listOrgancharge(tempParam).then(res1 => {
              if (res1.code == 200) {
                this.organchargelist = res1.rows;
              }

              //插入器官表
              res.rows.forEach(item => {
                //获取费用金额
                this.organchargelist.map(rescharge => {
                  if (rescharge.organcode == item.organno) {
                    this.donorchargeorgans.push({
                      organno: item.organno,
                      organname: item.organname,
                      organcharge: rescharge.charge,
                      infoid: item.infoid,
                      hospitalname: item.transplanthospitalname,
                      hospitalno: item.transplanthospitalno,
                      organtime: item.transplanttime,
                      chargestate: '0'
                    });
                  }
                });
              });
            });
          }
        });
      }
    },

    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate() {
      this.reset();
      this.open = true;

      getDonorcharge(this.curId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改捐献案例器官费用表";

        //器官费用信息
        this.organParams.donorchargeid = this.curId;
        listDonorchargeorgan(this.organParams).then(res => {
          this.donorchargeorgans = res.rows;
          if (this.donorchargeorgans.length > 0) {
          } else {
            this.addRow(0);
          }
        });
      });
    },

    /** ä¿®æ”¹æŸ¥çœ‹æ“ä½œ */
    handleDetail() {
      this.reset();
      this.open = true;

      getDonorcharge(this.curId).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "查看捐献案例器官费用表";

        //器官费用信息
        this.organParams.donorchargeid = this.curId;
        listDonorchargeorgan(this.organParams).then(res => {
          this.donorchargeorgans = res.rows;
          if (this.donorchargeorgans.length > 0) {
          } else {
            this.addRow(0);
          }
        });
      });
    },

    /** æäº¤ä¿å­˜æŒ‰é’® */
    submitForm: debounce(function (data) {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateDonorcharge(this.form).then(response => {
              if (response.code == 200) {
                this.$modal.msgSuccess("保存成功！");
              }
              this.open = false;
            });
          } else {
            addDonorcharge(this.form).then(response => {
              if (response.code == 200) {
                console.log(response);
                this.$modal.msgSuccess("保存成功！");
              }
              this.open = false;
            });
          }
        }
      });
    }, 500),

    //计算费用合计
    sumTotalFee() {
      let allSum = 0;

      //捐献者家属费用
      if (!isNaN(parseFloat(this.form.donoramount))) {
        allSum += parseFloat(this.form.donoramount);
      }

      //报销明细费用
      try {
        for (let i = 0; i < this.donorchargeorgans.length; i++) {
          /*
          let totalFee = 0;
          //计算当前报销内容费用合计
          if (!isNaN(parseFloat(this.donorchargeorgans[i].total))) {
            totalFee += parseFloat(this.donorchargeorgans[i].total);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].cityfee))) {
            totalFee += parseFloat(this.donorchargeorgans[i].cityfee);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].hotelexpense))) {
            totalFee += parseFloat(this.donorchargeorgans[i].hotelexpense);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].otherexpense))) {
            totalFee += parseFloat(this.donorchargeorgans[i].otherexpense);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].foodexpenses))) {
            totalFee += parseFloat(this.donorchargeorgans[i].foodexpenses);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].foodallowance))) {
            totalFee += parseFloat(this.donorchargeorgans[i].foodallowance);
          }
          if (!isNaN(parseFloat(this.donorchargeorgans[i].otherfeeamount))) {
            totalFee += parseFloat(this.donorchargeorgans[i].otherfeeamount);
          }
          this.donorchargeorgans[i].total = parseFloat(totalFee).toFixed(2);
          this.$set(this.donorchargeorgans, i, this.donorchargeorgans[i]);
          */

          if (!isNaN(parseFloat(this.donorchargeorgans[i].total))) {
            allSum += parseFloat(this.donorchargeorgans[i].total);
          }
        }

        this.form.amountrequested = allSum.toFixed(2);
      } catch { }
    },

    //表格合计
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      var columnnames = ["organno", "organname", "amount", "amounttime", "organcharge", "hospitalname", "organtime", "remark"];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        // if (index === 2) {
        //   sums[index] = this.form.chargeamounted;
        //   return;
        // } 
        // if (index === 4) {
        //   sums[index] = this.form.chargeamount;
        //   return;
        // }
        //去除部分字段计算
        if (columnnames.indexOf(column.property) > -1) {
          return;
        }

        const values = data.map(item => Number(item[column.property]));
        if (!values.every(value => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          sums[index] = sums[index].toFixed(2); // ä¿ç•™2位小数，解决小数合计列;
        } else {
          sums[index] = "";
        }
      });
      return sums;
    }
  }
};
</script>

<style lang="scss" scoped>
.Modifydetailscla {
  padding: 10px;

  .boxdiv {
    font-size: 18px;
    padding: 0 30px;
    padding-bottom: 60px;

    .top-text {
      text-align: center;

      font-size: 23px;
      font-weight: 600;
      margin: 20px 0;
      margin-bottom: 50px;
    }

    .dialog-footer {
      text-align: left;
      margin-top: 10px;
    }
  }
}

.upload-demo {
  text-align: center;
}

.pdfimg {
  display: flex; // text-align: center;
  width: 100%;
  height: 600px;

  .box-pdf {
    width: 400px;
    padding-top: 20px;
    margin-right: 30px;
    border: 1px solid #dcdfe6;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
      0 0 6px 0 rgba(0, 0, 0, 0.04);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1); // <- Add this to fix.
  }

  .pdftit {
    width: 200px;
    padding: 20px;
    font-size: 18px;
  }

  .pdftit:hover {
    background: #c0cef7;
  }

  .pdfimgmin {
    width: 60%;

    img {
      width: 100%;
    }
  }

  .pdfimgmins {
    font-size: 28px;
    width: 60%;
    text-align: center;
  }
}

::v-deep .el-input--medium .el-input__inner {
  height: 36px;
  line-height: 36px;
  text-align: center;
}

::v-deep .el-alert__title {
  font-size: 20px;
  line-height: 20px;
}
</style>

 src/views/project/donorcharge/organcharge/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,294 @@
<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="器官编码" prop="organcode">
        <el-input
          v-model="queryParams.organcode"
          placeholder="请输入器官编码"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="器官名称" prop="organname">
        <el-input
          v-model="queryParams.organname"
          placeholder="请输入器官名称"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="获取费用" prop="charge">
        <el-input
          v-model="queryParams.charge"
          placeholder="请输入获取费用"
          clearable
          size="small"
          @keyup.enter.native="handleQuery"
        />
      </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-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['system:organcharge:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['system:organcharge:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['system:organcharge:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          :loading="exportLoading"
          @click="handleExport"
          v-hasPermi="['system:organcharge:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="organchargeList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="获取费用" align="center" prop="id" />
      <el-table-column label="器官编码" align="center" prop="organcode" />
      <el-table-column label="器官名称" align="center" prop="organname" />
      <el-table-column label="获取费用" align="center" prop="charge" />
      <el-table-column label="备注" align="center" prop="remark" />
      <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="handleUpdate(scope.row)"
            v-hasPermi="['system:organcharge:edit']"
          >修改</el-button>
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:organcharge:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- æ·»åŠ æˆ–修改人体器官获取费用对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        <el-form-item label="器官编码" prop="organcode">
          <el-input v-model="form.organcode" placeholder="请输入器官编码" />
        </el-form-item>
        <el-form-item label="器官名称" prop="organname">
          <el-input v-model="form.organname" placeholder="请输入器官名称" />
        </el-form-item>
        <el-form-item label="获取费用" prop="charge">
          <el-input v-model="form.charge" placeholder="请输入获取费用" />
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input v-model="form.remark" placeholder="请输入备注" />
        </el-form-item>
      </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>
  </div>
</template>

<script>
import { listOrgancharge, getOrgancharge, delOrgancharge, addOrgancharge, updateOrgancharge, exportOrgancharge } from "@/api/project/organcharge";

export default {
  name: "Organcharge",
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // å¯¼å‡ºé®ç½©å±‚
      exportLoading: false,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // äººä½“器官获取费用表格数据
      organchargeList: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æŸ¥è¯¢å‚æ•°
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        organcode: null,
        organname: null,
        charge: null,
      },
      // è¡¨å•å‚æ•°
      form: {},
      // è¡¨å•æ ¡éªŒ
      rules: {
      }
    };
  },
  created() {
    this.getList();
  },
  methods: {
    /** æŸ¥è¯¢äººä½“器官获取费用列表 */
    getList() {
      this.loading = true;
      listOrgancharge(this.queryParams).then(response => {
        this.organchargeList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // å–消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        id: null,
        organcode: null,
        organname: null,
        charge: null,
        delFlag: null,
        remark: null,
        createBy: null,
        createTime: null,
        updateBy: null,
        updateTime: null
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加人体器官获取费用";
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getOrgancharge(id).then(response => {
        this.form = response.data;
        this.open = true;
        this.title = "修改人体器官获取费用";
      });
    },
    /** æäº¤æŒ‰é’® */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          if (this.form.id != null) {
            updateOrgancharge(this.form).then(response => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addOrgancharge(this.form).then(response => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$modal.confirm('是否确认删除人体器官获取费用编号为"' + ids + '"的数据项？').then(function() {
        return delOrgancharge(ids);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      const queryParams = this.queryParams;
      this.$modal.confirm('是否确认导出所有人体器官获取费用数据项？').then(() => {
        this.exportLoading = true;
        return exportOrgancharge(queryParams);
      }).then(response => {
        this.$download.name(response.msg);
        this.exportLoading = false;
      }).catch(() => {});
    }
  }
};
</script>