peisweb/src/views/checkStatus/Query.vue

<template>
  <div style="display: flex">
    <div style="display: flex; flex-wrap: wrap; height:80px;">
      <div class="query">
        <span>体检单位/次数：</span>
        <el-cascader v-model="patientRegister.query.customerOrgId" :options="patientRegister.customerOrgTreeAll"
          :props="{ checkStrictly: true, expandTrigger: 'hover', ...customerOrg.treeprops, }" placeholder="请选择单位"
          :show-all-levels="false" clearable size="small" @change="changeCustomerOrgId" style="width:180px;">
        </el-cascader>
        <el-select v-model="patientRegister.query.customerOrgRegister" placeholder="次数" style="width: 60px" size="small"
          :disabled="patientRegister.query.customerOrgId == dict.personOrgId" @change="changeMedicalTimes" value-key="id">
          <el-option v-for="item in customerOrg.customerOrgRegisterList" :key="item.id" :label="item.medicalTimes"
            :value="item" />
        </el-select>
      </div>
      <div class="query">
        <el-select v-model="patientRegister.query.dateType" placeholder="请选择" filterable clearable size="small"
          style="width: 100px">
          <el-option label="登记日期" value="creationTime" />
          <el-option label="体检日期" value="medicalStartDate" />
          <el-option label="总检日期" value="summaryDate" />
        </el-select>
        <el-date-picker v-model="patientRegister.query.dateRange" type="daterange" align="right" unlink-panels
          range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" size="small"
          style="width: 215px">
        </el-date-picker>
      </div> 
      <div class="query">
        <span>组合项目：</span>
        <el-select v-model="patientRegister.query.checkAsbs" multiple collapse-tags filterable clearable placeholder="请选择"
          size="small" >
          <el-option v-for="item in dict.asbItemAll" :key="item.value" :label="item.displayName" :value="item.id"/>
        </el-select>
      </div>     
      <div class="query">
        <span>状态：</span>
        <el-select v-model="patientRegister.query.checkCompleteFlag" placeholder="请选择" clearable style="width: 80px"
          size="small">
          <el-option v-for="item in dict.checkCompleteFlag" :key="item.id" :label="item.displayName" :value="item.id">
          </el-option>
        </el-select>
      </div>
      <div class="query">
        <el-button type="primary" class="btnClass" @click="btnQuery" size="small">查询</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import { mapState } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";

export default {
  components: {},
  props: ["orgEnable"],
  data() {
    return {
      dialogVisible: false,

      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
    };
  },

  created() { },

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

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

    //选择单位
    changeCustomerOrgId(v) {
      console.log(v)
      if (!v) {
        this.patientRegister.query.customerOrgRegister = null;
        return;
      }

      let customerOrgId = v[0];
      if (customerOrgId == this.dict.personOrgId) {
        this.patientRegister.query.customerOrgRegister = null;
        return;
      }
      getapi(
        `/api/app/customer-org-register/in-customer-org-id/${customerOrgId}`
      ).then((res) => {
        //console.log('res.data',res.data)
        if (res.code != -1) {
          this.customerOrg.customerOrgRegisterList = res.data;
          if (res.data.length > 0) {
            this.patientRegister.query.customerOrgRegister = res.data[res.data.length - 1];
            this.patientRegister.query.dateRange = [
              res.data[res.data.length - 1].beginTime,
              res.data[res.data.length - 1].isComplete == 'N' ? new Date() : res.data[res.data.length - 1].endTime
            ]
          }
        }
      });
    },

    //选择单位体检次数是，更新起止日期
    changeMedicalTimes(v){
      this.patientRegister.query.customerOrgRegister = v;
      this.patientRegister.query.dateRange = [
        v.beginTime,
        v.isComplete == 'N' ? new Date() : v.endTime
      ];
    },

    btnQuery(){
      console.log('query',this.patientRegister.query);
      this.patientRegister.query.times++;
    }
  },
};
</script>
<style scoped>
.query {
  margin-left: 10px;
}
</style>