MBS标准模板页面

<template>
  <ta-border-layout style="height: 100%;" :layout="{footer: '50px'}" :centerCfg="{showBorder:true}" :footerCfg="{showBorder:false,showPadding:false}" :showBorder=true>
    <ta-card title="查询条件" :bordered="false" :showExpand="false" class='no-bd-bottom'>
      <Form :formItem="formItems" :autoFormCreate="(form)=>{this.queryForm=form}" :form-layout="true">
        <template slot="operation">
          <div style="text-align:right;margin-bottom:20px">
            <ta-button @click="reset">重置</ta-button>
            <ta-button type="primary" @click="search">查询</ta-button>
          </div>
        </template>
      </Form>
    </ta-card>
    <ta-card title="补偿费用" :bordered="false" :showExpand="false" class='no-bd-bottom'>
      <Form :formItem="formItems1" :autoFormCreate="(form)=>{this.queryForm1=form}" :form-layout="true"></Form>
    </ta-card>
    <ta-card title="补偿列表" :bordered="false" :showExpand="false" class='no-bd-bottom'>
      <tables :haveSn="true" :rowSelection="rowSelection" :scroll="{ x: 1850,y:330}" :columns="columns" :dataSource.sync="tableData" :total="pageParams.total" v-model="pageParams.pageNum" :pageSize.sync="pageParams.pageSize" @change="onPagePage" @showSizeChange="onPageSizeChange" ref="gridPager" />
    </ta-card>
    <div slot="footer" style="text-align: right;margin-right: 100px">
      <ta-button @click="resetAll">重置</ta-button>
      <ta-button style="margin-left: 10px" type="primary" @click="submitClick" :disabled="saveDisabled">保存</ta-button>
    </div>
  </ta-border-layout>
</template>
<script>
import moment from 'moment'
import mixins from './columns'
export default {
  name: 'N141201',
  provide: {
    limitAdmdvs: 54
  },
  mixins: [mixins],
  data () {
    return {
      saveDisabled: false,
      personInfo: {}
    }
  },
  mounted () {
  },
  methods: {
    onSelectChange (selectedRowKeys, selectedRows) {
      // 设置选中项为点击选中的项
      this.rowSelection.selectedRowKeys = selectedRowKeys
      this.rowSelection.selectedRows = selectedRows
    },
    moment,
    onPagePage (cur) {
      this.pageParams.pageNum = cur
      this.search()
    },
    onPageSizeChange (cur, pageSize) {
      this.pageParams.pageNum = 1
      this.pageParams.pageSize = pageSize
      this.search()
    },
    search () {
      const formData = this.queryForm.getFieldsValue()
      if (formData.insuAdmdvs) {
        formData.insuAdmdvs =
          formData.insuAdmdvs[formData.insuAdmdvs.length - 1]
      }
      this.queryForm.validateFields((err, val) => {
        if (err) return
        this.Base.pageMask({ show: true, isTop: false, text: '加载中' })
        Base.submit(null, {
          url: '/centManlReimRegInfoTabD/queryTjbjRegForSettInfo',
          data: { ...formData, ...this.pageParams, psnNo: this.personInfo.psnNo }
        })
          .then((res) => {
            if (res.code === 0) {
              this.pageParams.total = res.data.pageBean.recordCounts
              this.tableData = res.data.pageBean.data
            }
          })
          .finally(() => {
            this.Base.pageMask({ show: false, isTop: false, text: '加载中' })
          })
      })
    },
    resetAll () {
      this.reset()
      this.queryForm1.resetFields()
      this.tableData = []
    },
    reset () {
      this.queryForm.resetFields()
    },
    submitClick () {
      if(this.rowSelection.selectedRows.length<0){
        this.$message.warning('请选择要结算的数据')
        return
      }
      const formData = this.queryForm.getFieldsValue()
      const costData = this.queryForm1.getFieldsValue()
      this.Base.pageMask({ show: true, isTop: false, text: '加载中' })
      Base.submit(null, {
        url: '/centManlReimRegInfoTabD/insertTjbjSettInfo',
        data: { ...formData,...costData, ...this.pageParams ,...this.rowSelection.selectedRows[0]},
        autoValid: true,
        autoQs: false
      })
        .then((res) => {
          if (res.code === 0) {
            this.pageParams.total = res.data.recordCounts
            this.tableData = res.data.data
            console.log(this.tableData)
          }
        })
        .finally(() => {
          this.Base.pageMask({ show: false, isTop: false, text: '加载中' })
        })
    }
  }
}
</script>
<style lang="scss" scoped>
</style>

import dicMixin from '@common/js/mixins/dicMixin'
import tables from '@project/component/tables'
import moment from 'moment'
export default {
  components: { tables },
  mixins: [dicMixin],
  data() {
    return {
      tableData: [],
      pageParams: {
        pageNum: 1,
        pageSize: 10,
        total: 0
      },
      columns: [
        { dataIndex: 'bedFee', title: '病房床位费', align: 'center' },
        { dataIndex: ' provCsltFee', title: '省内会诊费', align: 'center' },
        { dataIndex: ' provUrgtCsltFee', title: '省内紧急会诊费', align: 'center' },
        { dataIndex: ' outprovCsltFee', title: '省外会诊费', align: 'center' },
        { dataIndex: ' outprovUrgtCsltFee', title: '省外紧急会诊费', align: 'center' },
        { dataIndex: ' outprovOprnCsltFee', title: '省外手术会诊费', align: 'center' },
        { dataIndex: ' outprovMdtCsltFee', title: '省外多学科会诊费', align: 'center' },
        { dataIndex: ' outListDrugFee', title: '目录外药品费', align: 'center' },
        { dataIndex: ' outListTrtitemFee', title: '目录外诊疗项目费', align: 'center' },
        { dataIndex: ' ownpay', title: '不予报销项目费', align: 'center' }
      ],
      formItems: [
        {
          label: '人员编号',
          fieldDecoratorId: 'psnNo',
          type: 'component',
          currentView: 'personnel',
          required: true,
          params: { showPsnCertType: false },
          span: 6,
          func: (val) => {
            console.log(val)
            this.personInfo = val
            this.queryForm.setFieldsValue({
              psnNo: val.psnNo,
              ptcpNo: val.psnNo,
              psnName: val.psnName,
              brdy: moment(val.brdy),
              gend: val.gend
            })
          },
          placeholder: '请选择'
        },
        {
          label: '姓名',
          type: 'input',
          span: 6,
          fieldDecoratorId: 'psnName',
          disabled: true,
          placeholder: '请输入'
        },
        {
          label: '性别',
          type: 'select',
          fieldDecoratorId: 'gend',
          span: 6,
          disabled: true,
          collectionType: 'gend',
          placeholder: '请选择'
        },
        {
          label: '出生日期',
          type: 'date',
          fieldDecoratorId: 'brdy',
          span: 6,
          disabled: true,
          placeholder: '请输入'
        },
        {
          label: '单位编号',
          type: 'component',
          fieldDecoratorId: 'empNo',
          currentView: 'company',
          span: 6,
          func: (v) => {
            if (v) {
            }
          }
        },
        {
          label: '行政职务',
          type: 'select',
          fieldDecoratorId: 'admdut',
          span: 6,
          collectionType: 'ADMDUT',
          placeholder: '请选择'
        },
        {
          label: '医疗人员类别',
          type: 'select',
          fieldDecoratorId: 'medPsnType',
          span: 6,
          collectionType: 'MEDI_PSN_TYPE',
          placeholder: '请选择'
        },
        {
          label: '结算开始日期',
          type: 'date',
          fieldDecoratorId: 'begndate',
          params: {
            disabledDate: v => this.disabledStartDate(v)
          },
          span: 6,
          placeholder: '请选择'
        },
        {
          label: '结算结束日期',
          type: 'date',
          fieldDecoratorId: 'enddate',
          params: {
            disabledDate: v => this.disabledEndDate(v)
          },
          span: 6,
          placeholder: '请选择'
        },
        {
          label: '二次补偿标志',
          fieldDecoratorId: 'type',
          type: 'select',
          align: 'center',
          span: 6,
          options: [
            { label: '个人返还', value: '1' },
            { label: '个人清退', value: '2' }
          ],
          placeholder: '请选择'
        },
        { label: '统筹区编码', type: 'cascader', fieldDecoratorId: 'insuAdmdvs', initValue: [], options: [], placeholder: '请选择', span: 6 }
      ],
      formItems1: [
        { label: '病房床位费（限价）', type: 'number', fieldDecoratorId: 'bedFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省内会诊费', type: 'number', fieldDecoratorId: 'provCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省内紧急会诊费', type: 'number', fieldDecoratorId: 'provUrgtCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省外会诊费', type: 'number', fieldDecoratorId: 'outprovCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省外紧急会诊费', type: 'number', fieldDecoratorId: 'outprovUrgtCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省外手术会诊费', type: 'number', fieldDecoratorId: 'outprovOprnCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '省外多学科会诊费', type: 'number', fieldDecoratorId: 'outprovMdtCsltFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '目录外诊疗项目费', type: 'number', fieldDecoratorId: 'outListTrtitemFee', placeholder: '请输入', min: 0, max: 99999 },
        { label: '不予报销项目费', type: 'number', fieldDecoratorId: 'ownpay', placeholder: '请输入', min: 0, max: 99999 }
      ],
      rowSelection: {
        type: 'radio',
        selectedRowKeys: [],
        selectedRows: [],
        selections: false,
        // 行选择改变事件
        onChange: this.onSelectChange
      }
    }
  },
  async mounted() {
    const res = await this.$store.dispatch('getCanOptAdmdvs', this)
    this.$set(this.formItem.find(v => v.fieldDecoratorId === 'insuAdmdvs'), 'options', res.data.data)
  },
  methods: {
    //  开始时间校验
    disabledStartDate(startValue) {
      const endValue = this.queryForm.getFieldValue('crteTimeEndStr')
      return moment(startValue).isAfter(new Date()) || moment(startValue).isAfter(endValue)
    },
    //  结束时间校验
    disabledEndDate(endValue) {
      const startValue = this.queryForm.getFieldValue('crteTimeBeginStr')
      return moment(endValue).isAfter(new Date()) || moment(endValue).isBefore(startValue)
    }
  }
}