peisweb/src/components/patientRegister/patientRegisterAsbItem.vue

<template>
  <div>
    <div style="display: flex">
      <el-table :data="dataTransOpts.tableM.register_asbitem" border 
        :height="window.pageHeight < 600 ? 100 : Math.floor((window.pageHeight - 302) / 3)" size="small"
        highlight-current-row :summary-method="getSummaries" show-summary
        ref="patientRegister.patientRegisterAbs">
        <el-table-column label="序号" width="50" align="center">
          <template slot-scope="scope">
            <div><i v-if="scope.row.groupPackageId" class="el-icon-star-on" style="font-size: 16px;color: purple;"></i>{{ scope.$index + 1 }}</div>
          </template>
        </el-table-column>
        <el-table-column prop="asbitemName" label="已选组合项目" width="120" />
        <el-table-column prop="standardPrice" label="标准价" align="center" />
        <el-table-column prop="discount" label="折扣" align="center" />
        <el-table-column prop="amount" label="数量" width="50" align="center" />
        <el-table-column prop="chargePrice" label="价格" align="center" />
        <el-table-column prop="payTypeFlag" label="支付方式" align="center" >
          <template slot-scope="scope">
            <div>{{ dddw(dict.payType, "id", scope.row.payTypeFlag, "displayName") }}</div>
          </template>
        </el-table-column>
        <el-table-column prop="isCharge" label="收费" min-width="50" align="center">
          <template slot-scope="scope">
            <el-checkbox :value="scope.row.isCharge == 'Y'" align="center" />
          </template>
        </el-table-column>
        <el-table-column prop="checkCompleteFlag" label="状态" min-width="50" align="center" >
          <template slot-scope="scope">
            <div>
              {{
                dddw(
                  dict.checkCompleteFlag,
                  "id",
                  scope.row.checkCompleteFlag,
                  "displayName"
                )
              }}
            </div>
          </template>
        </el-table-column>
        <el-table-column prop="isLock" label="锁" min-width="50" align="center" >
          <template slot-scope="scope">
            <el-checkbox :value="scope.row.isLock == 'Y'" align="center" />
          </template>
        </el-table-column>
        <el-table-column prop="creatorName" label="登记人" min-width="70" align="center" />
        <el-table-column prop="creationTime" label="登记日期" min-width="90" align="center" >
          <template slot-scope="scope">
            <div>{{ moment(scope.row.creationTime).format("yyyy-MM-DD") }}</div>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
import moment from "moment";
import { mapState } from "vuex";
import { dddw } from "../../utlis/proFunc";
import { getapi, postapi, putapi, deletapi } from "../../api/api";

export default {
  components: {},
  data() {
    return {};
  },

  created() { 
    
  },

  updated(){
    this.$nextTick(() => {
      this.$refs['patientRegister.patientRegisterAbs'].doLayout()
    })
  },

  //挂载完成
  mounted() { },

  computed: {
    ...mapState(["window", "dataTransOpts", "dict", "patientRegister"]),
  },
  methods: {
    dddw,moment,    

    // 刷新登记的项目
    retrieveRegister_asbitem(id){
      if(!id){
        this.dataTransOpts.tableM.register_asbitem = []
        return
      }
      getapi(`/api/app/registerasbitem/getlistinpatientregisterid?PatientRegisterId=${id}`)
      .then(res => {
        console.log(`/api/app/registerasbitem/getlistinpatientregisterid?PatientRegisterId=${id}`, res)
        if (res.code != -1) {          
          res.data.forEach(e => {
            e.standTotal = e.amount * e.standardPrice
            e.total = e.amount * e.chargePrice
          });
          this.dataTransOpts.tableM.register_asbitem = res.data
        }
      })

    },

    // :row-class-name="tableRowClassName"
    // tableRowClassName({ row, rowIndex }) {
    //   //console.log(row)
    //   if (row.groupPackageId) {
    //     //console.log('row.groupPackageId',row.groupPackageId)
    //     return 'purple-row'; //分组或套餐
    //   } else {
    //     return '';
    //   }
    // },

    //自定义计算列
    getSummaries(param) {
      const { columns, data } = param;
      const sumCol = [2, 5]; //需合计的列
      const sums = [];
      columns.forEach((column, index) => {
        //显示合计列
        if (index === 1) {
          sums[index] = "合计";
          return;
        }

        //不合计的列
        if (sumCol.indexOf(index) == -1) {
          sums[index] = "";
          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] = Math.round(sums[index], 2);
          sums[index] += " 元";
        } else {
          sums[index] = "N/A";
        }
      });

      return sums;
    },
  },

  //监听事件
  watch: {    
    //人员ID未切换换时 也可以强制刷新数据
    "dataTransOpts.refresh.register_asbitem.M":{
      immediate:true,
      handler(newVal, oldVal) {
        console.log(`watch 人员登记 newVal:${newVal} oldVal:${oldVal} registerCheckId: ${this.dataTransOpts.tableS.patient_register.id}`);        
        this.retrieveRegister_asbitem(this.dataTransOpts.tableS.patient_register.id)
      }
    },
  }
};
</script>
<style scoped>
@import "../../assets/css/global.css";

.box {
  display: flex;
}
</style>