peisweb/src/components/patientRegister/AsbChargeRequest.vue

<template>
  <div style="margin-top: -10px;">
    <div>
      <el-tabs v-model="tabChoosed" style="margin-top: 0px;">
        <el-tab-pane label="待收费项目" name="1">
          <el-table :data="tableData" border style="width: 100%" row-key="id" height="450" highlight-current-row
            size="small" @selection-change="handleSelectionChange" :row-style="{ height: '25px' }">
            <el-table-column type="selection" align="center" width="40" />
            <el-table-column type="index" label="序号" align="center" width="40" />
            <el-table-column label="组合项目" min-width="150" prop="asbitemName"></el-table-column>
            <el-table-column label="标准价格" prop="standardPrice" min-width="70" align="center" />
            <el-table-column label="数量" prop="amount" min-width="50" align="center"></el-table-column>
            <el-table-column label="实收价格" prop="chargePrice" min-width="70" align="center"></el-table-column>
            <el-table-column prop="total" label="金额" min-width="70" align="center" />
            <el-table-column prop="standardPrice" label="标准金额" min-width="70" align="center" />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="已收费项目" name="2">
          <el-table :data="hisRequestData" border style="width: 100%" row-key="id"
            height="160" highlight-current-row size="small" @row-click="rowClick" :row-style="{ height: '25px' }">
            <el-table-column type="index" label="序号" align="center" width="40" />
            <el-table-column label="申请单号" min-width="100" prop="chargeRequestNo"></el-table-column>
            <el-table-column prop="hisChargeNo" label="his收费单" min-width="80" align="center" />
            <el-table-column prop="charges" label="金额" min-width="80" align="center" />
            <el-table-column prop="chargeRequestFlag" label="收费状态" width="70" align="center">
              <template slot-scope="scope">
                <div>{{ scope.row.chargeRequestFlag }}</div>
              </template>
            </el-table-column>
            <el-table-column prop="ch" label="收费人员" min-width="80" align="center" />
            <el-table-column prop="creationTime" label="申请时间" min-width="150" align="center" />
            <el-table-column label="操作" width="150" align="center">
              <template slot-scope="scope">
                <div style="display: flex;justify-content: space-between;">
                  <div>
                    <el-button class="commonbutton" @click="cancelRequest(scope.row)" style="width:80px;" :disabled="setBtnDisabled(scope.row,'cancel')">撤消申请</el-button>
                  </div>
                  <div>
                    <el-button class="commonbutton" @click="chargeBack(scope.row)" style="width:50px;" :disabled="setBtnDisabled(scope.row,'chargeBack')">退费申请</el-button>
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div style="padding: 10px 0 5px 0;">申请单包含项目</div>
          <el-table :data="hisRequestDataDetails" border style="width: 100%" row-key="id"
            height="256" highlight-current-row size="small" :row-style="{ height: '25px' }">
            <el-table-column type="index" label="序号" align="center" width="40" />
            <el-table-column label="组合项目" min-width="150" prop="asbitemName"></el-table-column>
            <el-table-column label="数量" prop="amount" min-width="50" align="center"></el-table-column>
            <el-table-column label="实收价格" prop="chargePrice" min-width="70" align="center"></el-table-column>
            <el-table-column prop="total" label="金额" min-width="70" align="center" />
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </div>
    <!-- 按钮区域 -->
    <div style="display: flex; margin-top: 10px; justify-content: space-between;">
      <div></div>
      <div style="display: flex;">
        <div style="margin-left: 10px" v-show="tabChoosed == '1'">
          <el-button class="commonbutton" @click="btnSubmit">收费申请</el-button>
        </div>
        <div style="margin-left: 10px">
          <el-button class="commonbutton" @click="dialogWin.AsbChargeRequest = false">关闭</el-button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { mapState } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";
import { dddw, arrayExistObj, deepCopy } from "../../utlis/proFunc";

// import
export default {
  props: ["patientRegister"],
  data() {
    return {
      tabChoosed: '1',
      tableData: [],        //组合项目数据 过滤后显示的数据  
      selectedData: [],    //选中的组合项目
      hisRequestData: [],   //收费申请单
      hisRequestDataDetails: [],   //收费申请单明细

    };
  },

  created() {

  },

  mounted() {
    this.initData(this.patientRegister.id);
  },
  computed: {
    ...mapState(["dict", "dataTransOpts", "dialogWin"]),
  },
  methods: {

    initData(patientRegisterId) {
      this.tableData = []
      this.hisRequestData = []
      if (!patientRegisterId) return

      //待收费项目
      postapi('/api/app/registerasbitem/GetCanChargeAsbitemsByPatientRegisterId', { patientRegisterId })
        .then(res => {
          if (res.code > -1) {
            res.data.forEach(e => {
              e.total = Number(e.chargePrice * e.amount)
              this.tableData.push(e)
            });
          }
        })

      // 收费申请单
      postapi('/api/app/ChargeRequest/GetChargeRequestsByPatientRegisterId', { patientRegisterId })
        .then(res => {
          if (res.code > -1) {
            this.hisRequestData = res.data
          }
        })
    },

    handleSelectionChange(v) {
      this.selectedData = v;
    },

    setBtnDisabled(row,oprType){
      let ret = true
      if(oprType == 'chargeBack'){

      }else{

      }

    },

    // 获取申请单明细
    rowClick(row){
      this.hisRequestDataDetails = []
      postapi('/api/app/ChargeRequest/GetChargeRequestAsbitemsByChargeQuestId', { chargeRequestId: row.id })
        .then(res => {
          if (res.code > -1) {
            res.data.forEach(e => {
              e.total = Number(e.chargePrice*e.amount)
              this.hisRequestDataDetails.push(e)
            });
          }
        })
    },

    // 撤消申请
    cancelRequest(row) {
      postapi('/api/app/ChargeRequest/CancelChargeRequest', { chargeRequestId: row.id })
        .then(res => {
          if (res.code > -1) {
            // 
          }
        })
    },

    // 退费
    chargeBack(row) {
      postapi('/api/app/ChargeRequest/RefundChargeRequest', { chargeRequestId: row.id })
        .then(res => {
          if (res.code > -1) {
            // 
          }
        })
    },

    btnSubmit() {
      if (this.selectedData.length == 0) {
        this.$message.warning({ showClose: true, message: `请勾选要发送收费申请的检查项目！` });
        return;
      }
      let body = {
        patientRegisterId: this.patientRegister.id,
        registerCheckAsbitems: []
      }

      this.selectedData.forEach(e => {
        body.registerCheckAsbitems.push({ registerCheckAsbitemId: e.registerCheckAsbitemId })
      });

      postapi("/api/app/ChargeRequest/Create", body)
        .then(res => {
          if (res.code > -1) {
            this.initData(this.patientRegister.id)
          }
        });

    },

  },

  //监听事件
  watch: {
    // 
    "dataTransOpts.refresh.charge.S": {
      // immediate: true, // 立即执行
      // // deep: true, // 深度监听复杂类型内变化
      handler(newVal, oldVal) {
        console.log(`watch: 收费 newVal: ${newVal}, oldVal: ${oldVal}, 人员条码号: `, this.patientRegister.id)
        if (newVal != oldVal) this.initData(this.patientRegister.id)
      }
    },
  },
};
</script>
<style scoped>
@import "../../assets/css/global_input.css";
@import "../../assets/css/global_table.css";
@import "../../assets/css/global.css";
</style>