From bec28aa44c74cbb2e6303cb79201f983e92d7b69 Mon Sep 17 00:00:00 2001
From: lucky <srf428110@163.com>
Date: Fri, 19 Feb 2021 10:36:46 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=94=9F=E7=89=A9=E6=A0=B7?=
 =?UTF-8?q?=E6=9C=AC=E5=92=8C=E7=94=9F=E7=89=A9=E6=A0=B7=E6=9C=AC=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../BiologicalSampleSearch/SampleTable.vue    |  98 ++++++++++++
 .../BiologicalSampleSearch/Search.vue         | 116 ++++++++++++++
 src/components/BtnCom/BtnCon.vue              |   2 +
 src/router/index.js                           |  12 ++
 .../BiologicalSampleSearch.vue                |  68 ++++++++
 .../BiologicalSamples/BiologicalSamples.vue   | 146 ++++++++++++++++++
 6 files changed, 442 insertions(+)
 create mode 100644 src/components/BiologicalSampleSearch/SampleTable.vue
 create mode 100644 src/components/BiologicalSampleSearch/Search.vue
 create mode 100644 src/views/BiologicalSampleSearch/BiologicalSampleSearch.vue
 create mode 100644 src/views/BiologicalSamples/BiologicalSamples.vue

diff --git a/src/components/BiologicalSampleSearch/SampleTable.vue b/src/components/BiologicalSampleSearch/SampleTable.vue
new file mode 100644
index 0000000..689a2e9
--- /dev/null
+++ b/src/components/BiologicalSampleSearch/SampleTable.vue
@@ -0,0 +1,98 @@
+<template>
+  <div>
+    <!-- search -->
+    <div style="width:100%" v-if="lists && lists.list && lists.list.length > 0">
+      <a-table
+        :columns="columns"
+        :data-source="lists.list"
+        :loading="loading"
+        :pagination="pagination"
+        :row-key="record => record.id"
+        @change="handleTableChange"
+        bordered
+        class="white pa-3"
+      >
+        <template slot="id" slot-scope="text, record, index">
+          <span>{{ index + 1 }}</span>
+        </template>
+      </a-table>
+    </div>
+    <a-empty v-else />
+  </div>
+</template>
+
+<script>
+import { mapMutations, mapState } from 'vuex';
+
+const columns = [
+  {
+    title: '序号',
+    align: 'center',
+    dataIndex: 'id',
+    key: 'id',
+    scopedSlots: { customRender: 'id' },
+  },
+  {
+    title: '医院',
+    align: 'center',
+    dataIndex: 'hospital',
+    key: 'hospital',
+  },
+  {
+    title: '住院号',
+    align: 'center',
+    dataIndex: 'hospitalization',
+    key: 'hospitalization',
+  },
+  {
+    title: '类型',
+    align: 'center',
+    dataIndex: 'type',
+    key: 'type',
+  },
+  {
+    title: '采集时间',
+    align: 'center',
+    dataIndex: 'acquisitionTime',
+    key: 'acquisitionTime',
+  },
+];
+
+export default {
+  name: 'PatientTable',
+
+  props: { lists: { type: Object, default: null } },
+
+  data() {
+    return {
+      columns,
+      loading: false,
+    };
+  },
+
+  computed: {
+    pagination() {
+      const { pageNum, pageSize, total } = this.lists;
+      return {
+        current: pageNum,
+        pageSize,
+        total: +total,
+      };
+    },
+  },
+
+  methods: {
+    ...mapMutations('home', ['setPatientId']),
+
+    // 选择病患
+    chooseItem(id) {
+      this.setPatientId(id);
+    },
+
+    handleTableChange(pagination) {
+      const { current } = pagination;
+      this.$emit('handleSelPatientMes', current);
+    },
+  },
+};
+</script>
diff --git a/src/components/BiologicalSampleSearch/Search.vue b/src/components/BiologicalSampleSearch/Search.vue
new file mode 100644
index 0000000..02371f3
--- /dev/null
+++ b/src/components/BiologicalSampleSearch/Search.vue
@@ -0,0 +1,116 @@
+<template>
+  <!-- search -->
+  <div>
+    <div class="d-flex flex-row flex-nowrap">
+      <a-form
+        :form="form"
+        @submit="handleSubmit"
+        class="d-flex flex-nowrap align-center"
+        layout="inline"
+      >
+        <a-form-item>
+          <a-select placeholder="请选择医院" style="min-width: 150px" v-decorator="['hospital']">
+            <a-select-option
+              :key="item.id"
+              :value="item.id"
+              v-for="item in hospitals"
+            >{{ item.title }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item>
+          <a-select placeholder="请选择样本类型" style="min-width: 150px" v-decorator="['sampleType']">
+            <a-select-option :key="item.id" :value="item.id" v-for="item in types">{{ item.title }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item>
+          <a-input placeholder="患者住院号" style="width: 14em" v-decorator="['inpatientNumber']" />
+        </a-form-item>
+        <a-form-item>
+          <a-select
+            placeholder="请选择采集时间"
+            style="min-width: 150px"
+            v-decorator="['acquisitionTime']"
+          >
+            <a-select-option :key="t.id" :value="t.id" v-for="t in acquisitionTime">{{ t.title }}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-button class="mr-4" html-type="submit" icon="search" type="primary">搜索</a-button>
+      </a-form>
+      <div class="flex-1"></div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Search',
+  data() {
+    return {
+      form: this.$form.createForm(this, { name: 'search' }),
+      hospitals: [
+        {
+          id: 1,
+          title: '山西中医大学附属医院',
+        },
+        {
+          id: 2,
+          title: '山西人民医院',
+        },
+        {
+          id: 3,
+          title: '大同第五人民医院',
+        },
+        {
+          id: 4,
+          title: '大同国药同煤总医院',
+        },
+      ],
+      types: [
+        {
+          id: 1,
+          title: '抗血凝10ml',
+        },
+        {
+          id: 2,
+          title: '促凝血5ml',
+        },
+        {
+          id: 3,
+          title: '晨尿10ml',
+        },
+        {
+          id: 4,
+          title: '24小时尿10ml',
+        },
+      ],
+      acquisitionTime: [
+        {
+          id: 1,
+          title: '0天',
+        },
+        {
+          id: 2,
+          title: '14天',
+        },
+        {
+          id: 3,
+          title: '90天',
+        },
+      ],
+    };
+  },
+
+  methods: {
+    // 提交
+    handleSubmit(e) {
+      e.preventDefault();
+      this.form.validateFields(async (err, values) => {
+        if (!err) {
+          console.log('values: ', values);
+          this.$emit('searchPatientMes', values);
+        }
+      });
+    },
+  },
+};
+</script>
diff --git a/src/components/BtnCom/BtnCon.vue b/src/components/BtnCom/BtnCon.vue
index e7a4ed6..87a56e3 100644
--- a/src/components/BtnCom/BtnCon.vue
+++ b/src/components/BtnCom/BtnCon.vue
@@ -6,6 +6,8 @@
     <div @click="jump('/patientInfo')" class="btn">患者信息录入</div>
     <div @click="jump('/caseSearch')" class="btn">病例搜索</div>
     <div @click="jump('/caseAnalysis')" class="btn">病例分析</div>
+    <div @click="jump('/biologicalSamples')" class="btn">生物样本</div>
+    <div @click="jump('/biologicalSampleSearch')" class="btn">生物样本搜索</div>
   </div>
 </template>
 
diff --git a/src/router/index.js b/src/router/index.js
index d809621..9940de4 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -54,6 +54,18 @@ const routes = [
     name: 'CaseAnalysis',
     component: () => import('@/views/CaseAnalysis/CaseAnalysis.vue'),
   },
+  // 生物样本
+  {
+    path: '/biologicalSamples',
+    name: 'biologicalSamples',
+    component: () => import('@/views/BiologicalSamples/BiologicalSamples.vue'),
+  },
+  // 生物样本搜索
+  {
+    path: '/biologicalSampleSearch',
+    name: 'biologicalSampleSearch',
+    component: () => import('@/views/BiologicalSampleSearch/BiologicalSampleSearch.vue'),
+  },
 ];
 
 const router = new VueRouter({
diff --git a/src/views/BiologicalSampleSearch/BiologicalSampleSearch.vue b/src/views/BiologicalSampleSearch/BiologicalSampleSearch.vue
new file mode 100644
index 0000000..037f96c
--- /dev/null
+++ b/src/views/BiologicalSampleSearch/BiologicalSampleSearch.vue
@@ -0,0 +1,68 @@
+<template>
+  <div class="d-flex flex-column">
+    <search @searchPatientMes="searchPatientMes" />
+    <sample-table :lists="lists" @handleSelPatientMes="handleSelPatientMes" class="mt-3" />
+  </div>
+</template>
+
+<script>
+import Search from 'components/BiologicalSampleSearch/Search.vue';
+import SampleTable from 'components/BiologicalSampleSearch/SampleTable.vue';
+import { selPatientMes } from 'config/api';
+import { mapState, mapActions } from 'vuex';
+
+export default {
+  name: 'BiologicalSampleSearch',
+  components: { Search, SampleTable },
+  data() {
+    return {
+      lists: { pageNum: 1, pageSize: 10, total: 1, list: [] },
+      hospitalization: '',
+      inpatientId: '',
+    };
+  },
+
+  created() {
+    this.handleSelPatientMes();
+    this.getControlGroups();
+  },
+
+  methods: {
+    ...mapActions('home', ['getControlGroups']),
+
+    searchPatientMes(value) {
+      if (value) {
+        this.hospitalization = value.inpatientNumber;
+        this.inpatientId = value.groupValue;
+      }
+      this.handleSelPatientMes();
+    },
+
+    async handleSelPatientMes(pageNum = 1) {
+      try {
+        const { hospitalization, inpatientId } = this;
+        const params = {
+          param: {
+            hospitalization,
+            inpatientId,
+            pageNum,
+            pageSize: 10,
+          },
+        };
+        const res = await selPatientMes(params);
+        const { code, msg, data } = res.data;
+        if (code === 200) {
+          this.lists = data;
+        } else {
+          this.$message.error(msg || '查询失败');
+          throw msg;
+        }
+      } catch (error) {
+        throw new Error(`CaseSearch.vue method selSearchCriteriaList: ${error}`);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="stylus" scoped></style>
diff --git a/src/views/BiologicalSamples/BiologicalSamples.vue b/src/views/BiologicalSamples/BiologicalSamples.vue
new file mode 100644
index 0000000..58f2838
--- /dev/null
+++ b/src/views/BiologicalSamples/BiologicalSamples.vue
@@ -0,0 +1,146 @@
+<template>
+  <div>
+    <div class="metting">
+      <a-card :bordered="false" title="生物样本">
+        <a-form :form="form" @submit="handleSubmit">
+          <!-- 住院号 -->
+          <a-form-item
+            :label-col="formItemLayout.labelCol"
+            :wrapper-col="formItemLayout.wrapperCol"
+            label="住院号"
+          >
+            <a-input
+              placeholder="住院号"
+              v-decorator="[
+                      'inpatientNumber',
+                      {
+                        rules: [
+                          { required: true, message: '住院号不能为空' },
+                          { whitespace: true, message: '住院号不能为空' },
+                          { max: 140, massage: '住院号最多140个字符' },
+                        ],
+                      },
+                    ]"
+            />
+          </a-form-item>
+          <!-- 样本类型 -->
+          <a-form-item
+            :label-col="formItemLayout.labelCol"
+            :wrapper-col="formItemLayout.wrapperCol"
+            label="样本类型"
+          >
+            <a-select placeholder="请选择样本类型" style="min-width: 150px" v-decorator="['sampleType']">
+              <a-select-option
+                :key="item.id"
+                :value="item.id"
+                v-for="item in types"
+              >{{ item.title }}</a-select-option>
+            </a-select>
+          </a-form-item>
+          <!-- 样本类型 -->
+          <a-form-item
+            :label-col="formItemLayout.labelCol"
+            :wrapper-col="formItemLayout.wrapperCol"
+            label="样本类型"
+          >
+            <a-select
+              placeholder="请选择采集时间"
+              style="min-width: 150px"
+              v-decorator="['acquisitionTime']"
+            >
+              <a-select-option :key="t.id" :value="t.id" v-for="t in acquisitionTime">{{ t.title }}</a-select-option>
+            </a-select>
+          </a-form-item>
+
+          <a-form-item class="d-flex flex-row-reverse">
+            <a-button class="white--text px-10" html-type="submit" type="primary">提交</a-button>
+          </a-form-item>
+        </a-form>
+      </a-card>
+    </div>
+  </div>
+</template>
+
+<script>
+const formItemLayout = {
+  labelCol: { span: 4 },
+  wrapperCol: { span: 18 },
+};
+const tailItemLayout = { wrapperCol: { span: 18, offset: 4 } };
+export default {
+  name: 'Meeting',
+  data() {
+    return {
+      formItemLayout,
+      tailItemLayout,
+      form: this.$form.createForm(this, { name: 'page-add' }),
+      inpatientNumber: '', // 主持人
+      types: [
+        {
+          id: 1,
+          title: '抗血凝10ml',
+        },
+        {
+          id: 2,
+          title: '促凝血5ml',
+        },
+        {
+          id: 3,
+          title: '晨尿10ml',
+        },
+        {
+          id: 4,
+          title: '24小时尿10ml',
+        },
+      ],
+      acquisitionTime: [
+        {
+          id: 1,
+          title: '0天',
+        },
+        {
+          id: 2,
+          title: '14天',
+        },
+        {
+          id: 3,
+          title: '90天',
+        },
+      ],
+    };
+  },
+
+  methods: {
+    // 提交表单
+    handleSubmit(e) {
+      e.preventDefault();
+      this.form.validateFieldsAndScroll(async (err, values) => {
+        if (!err) {
+          try {
+            // const param = values;
+            // const params = { param };
+            // console.log('params: ', params);
+            // const res = await addPage(params);
+            // const { data, msg, code } = res.data;
+            // this.$emit('closeModal');
+            // if (code === 200) {
+            //   this.$message.success('添加成功');
+            // } else {
+            //   throw msg;
+            // }
+          } catch (error) {
+            // this.$message.error(error || '添加失败');
+          }
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="stylus" scoped>
+.metting {
+  width: 100%;
+  // margin: 30px 10%;
+}
+</style>