Merge branch 'feature/story-223' into Update/2.0

src/api/knowledge.js

@@ -229,6 +229,25 @@ export function getPreDetal(data) {
     })
 };
 
+// 获取中成药列表
+export function getChinesePatentMedicineList(data, signal) {
+    data.categoryId = data.effected;
+    return request({
+        url: '/basis/knowlib/patentDrugList?effected=' + data.effected,
+        method: 'post',
+        data, signal,
+    })
+}
+
+// 获取中成药详情接口
+export function getChinesePatentMedicineDetail(data) {
+    return request({
+        url: '/basis/knowlib/patentDrugDetail?id=' + data.id,
+        method: 'post',
+        data
+    });
+}
+
 // 获取中药详情
 export function getMedDetail(data) {
     return request({

src/router/knowledge.js

@@ -15,6 +15,23 @@ export default [{
             title: '方剂详情',
             pftitle: '名医名方'
         }
+    }, {
+        path: 'cpm',
+        name: 'ChinesePatentMedicine',
+        component: () => import('@/views/knowledge/PrescriptionPatent.vue'),
+        meta: {
+            keeplive: true,
+            title: '中成药查询',
+            pftitle: '名医名方'
+        }
+    }, {
+        path: 'cmpD',
+        name: 'ChinesePatentMedicineDetail',
+        component: () => import('@/views/knowledge/PrescriptionPatentD.vue'),
+        meta: {
+            title: '中成药详情',
+            pftitle: '名医名方'
+        }
     }, {
         path: 'xuewei',
         name: 'xuewei',

src/views/knowledge/PrescriptionPatent.vue

@@ -0,0 +1,230 @@
+<template>
+  <div class="prescription">
+    <!-- 顶部筛选 -->
+    <div class="screening flex-plane-start-b">
+      <div class="screening-form flex-vertical-center-l flex-wrap">
+        <div class="screening-item flex-vertical-center-l">
+          <span>中成药名称：</span>
+          <div class="input">
+            <el-input size="mini" v-model="form.name" placeholder="请输入" @keydown.enter.native="search()"></el-input>
+          </div>
+        </div>
+
+        <div class="screening-item flex-vertical-center-l">
+          <span>功能主治：</span>
+          <div class="input">
+            <el-input size="mini" v-model="form.gongxiao" placeholder="请输入" @keydown.enter.native="search()"></el-input>
+          </div>
+        </div>
+        <el-button size="mini" type="primary" @click="search">搜索</el-button>
+        <el-button size="mini" type="warning" @click="clearFilter">清空</el-button>
+      </div>
+      <div class="total">
+        共
+        <span>{{totalNum}}</span>个中成药
+      </div>
+    </div>
+
+    <!-- 主体部分 -->
+    <div class="prescr-body">
+      <!-- 顶部tab -->
+      <div class="p-tab flex-vertical-center-l flex-wrap">
+        <div
+          :class="tab_current==index?'flex-center p-active':'flex-center'"
+          v-for="(item,index) in tabs"
+          :key="index"
+          @click="tabCahnge(index)"
+        >{{item.name}}</div>
+      </div>
+      <!-- 底部数据表格 -->
+      <div ref="scrollableElement" class="table-data" :date-loading="loading" v-loading="loading">
+        <div
+          class="flex-center ellipsis-line1"
+          v-for="(item,index) in list"
+          :key="item.id"
+          @click="$router.push({path:'/index/cmpD?id='+item.id})"
+        >{{item.name}}</div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import useScroll from '@/mixins/useScroll';
+import {getChinesePatentMedicineList, getEffectQuery, getPrescriptionsList} from '@/api/knowledge.js';
+import {addRecipeFrom} from '@/api/dataAnalysis';
+
+let controller;
+
+export default {
+  mixins: [useScroll],
+  data() {
+    return {
+      loading: false,
+      form: {
+        name: "",
+
+        gongxiao: ""
+      },
+      tabs: [],
+      tab_current: 0,
+      list: [],
+      totalNum: 0
+    };
+  },
+  created() {
+    addRecipeFrom({ type: 7 }).catch();
+    this.getEffectQuery().then(() => this.getChinesePatentMedicineList());
+    // setTimeout(() => {
+    //   this.getPrescriptionsList();
+    // }, 500);
+  },
+  methods: {
+    clearFilter() {
+      this.form = {
+        name: "",
+
+        gongxiao: ""
+      };
+      this.search();
+    },
+    search() {
+      this.tab_current = this.tabs.length - 1;
+      this.getChinesePatentMedicineList();
+    },
+    tabCahnge(index) {
+      if (this.tab_current === index) this.scroll(0);
+      else {
+        this.tab_current = index;
+        this.getChinesePatentMedicineList();
+      }
+    },
+    // 获取列表
+    async getChinesePatentMedicineList() {
+      if (controller) controller.abort();
+      controller = new AbortController();
+      this.scroll(0, 'instant');
+      this.loading = true;
+      let params = {
+        pageid: 1,
+        pagesize: 9999,
+        searchtype: "",
+        keyWord: this.form.name,
+        indication: this.form.gongxiao,
+        effected: this.tabs[this.tab_current] ? this.tabs[this.tab_current].effectid : null,
+      };
+      let res = await getChinesePatentMedicineList(params, controller.signal);
+      if (res.code == 0) {
+        this.list = res.data.drugs;
+        this.totalNum = res.data.drugnum;
+      }
+      this.loading = false;
+    },
+    // 获取分类
+    async getEffectQuery() {
+      let res = await getEffectQuery({
+        effecttype: "1",
+        effictId: ""
+      });
+
+      if (res.code == 0) {
+        this.tabs = res.data.effects;
+        this.tabs.push({
+          name: "检索结果",
+          effectid: ""
+        });
+      }
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+@import "../../style/common.scss";
+@import "../../style/base.scss";
+
+.prescription {
+  .p-tab {
+    div {
+      margin-top: 2px;
+    }
+  }
+
+  .total {
+    font-size: 14px;
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #333333;
+    margin-bottom: 20px;
+
+    margin-left: 20px;
+
+    span {
+      color: #ff3a3a;
+    }
+  }
+
+  .prescr-body {
+    margin-top: 10px;
+  }
+
+  .table-data {
+    padding: 10px 10px;
+    background: #ffffff;
+    border-radius: 0px 5px 5px 5px;
+    height: 57vh;
+    overflow: auto;
+
+    &[date-loading="true"] {
+      overflow: hidden;
+    }
+
+    div {
+      display: inline-block;
+      line-height: 44px;
+      text-align: center;
+      width: 100px;
+      height: 44px;
+      background: #f5f5f5;
+      border-radius: 4px;
+      font-size: 14px;
+      font-family: PingFang SC;
+      font-weight: 400;
+      color: #000000;
+      margin: 0 10px 10px 0;
+      cursor: pointer;
+    }
+  }
+}
+</style>
+<style lang="scss" scoped>
+@media screen and (min-width: 1681px) and (max-width: 1920px) {
+  .prescription {
+    .table-data {
+      height: 77vh;
+    }
+  }
+}
+
+@media screen and (min-width: 1601px) and (max-width: 1680px) {
+  .prescription {
+    .table-data {
+      height: 76vh;
+    }
+  }
+}
+
+@media screen and (min-width: 1361px) and (max-width: 1600px) {
+  .prescription {
+    .table-data {
+      height: 61vh;
+    }
+  }
+}
+
+@media screen and(min-width:1281px) and (max-width: 1360px) {
+  .prescription {
+    .table-data {
+      height: 61vh;
+    }
+  }
+}
+</style>

src/views/knowledge/PrescriptionPatentD.vue

@@ -0,0 +1,205 @@
+<template>
+  <div class="PrescriptionD">
+    <div style="margin-bottom:10px;">
+      <el-button size="small" type="primary" @click="$router.back()">返回</el-button>
+      <el-button size="small" v-if="showPrintHTML" type="primary" icon="el-icon-download" :disabled="loading" @click="print()">下载打印</el-button>
+    </div>
+    <div class="detail print-containers" ref="print">
+      <div class="detail-item flex-plane-center-l">
+        <div class="title">药物名称：</div>
+        <div class="right">{{info.name}}</div>
+      </div>
+      <div class="detail-item flex-plane-center-l" v-for="item in info.attributes" :key="item.field">
+        <div class="title">{{item.title}}：</div>
+        <div class="right">{{item.content}}</div>
+      </div>
+      <!-- 笔记输入框 -->
+      <div class="detail-item flex-plane-center-l no-print" v-if="isCollect">
+        <div class="title">个人笔记：</div>
+        <div class="right flex note">
+          <el-input type="textarea" :rows="6" placeholder="请输入" v-model="text" :disabled="!isEdit" />
+          <el-button type="primary" @click="isEdit=!isEdit">{{ isEdit?'保存':'修改' }}</el-button>
+        </div>
+      </div>
+    </div>
+
+    <!-- 收藏图标 -->
+    <div class="collect" v-if="false">
+      <img
+        src="../../assets/new-icon/collectpng.png"
+        alt
+        v-if="!isCollect"
+        @click="isCollect=!isCollect"
+      />
+      <img src="../../assets/new-icon/collectpng-fill.png" alt v-else @click="isCollect=!isCollect" />
+    </div>
+  </div>
+</template>
+<script>
+import { mapGetters } from 'vuex';
+import { getDataByKey } from '@/api/system';
+import { getChinesePatentMedicineDetail } from '@/api/knowledge.js';
+import printJS from 'print-js';
+export default {
+  data() {
+    return {
+      loading: false,
+      showPrintHTML: false,
+      showTransitionPr: false,
+      info: {
+        itemList: [],
+        attributes: [],
+      },
+      isCollect: false,
+      isEdit: true,
+      text: ""
+    };
+  },
+  created() {
+    getDataByKey({
+      key: "transitionPr",
+      organizationid: this.getuserinfo.organizationid,
+    }).then(data => { this.showTransitionPr = data.enabled; });
+    getDataByKey({
+      key: "showPrintHTML",
+      organizationid: this.getuserinfo.organizationid,
+    }).then(data => { this.showPrintHTML = data.enabled; });
+    this.getChinesePatentMedicineDetail();
+  },
+  computed: {
+    ...mapGetters(["getuserinfo"])
+  },
+  methods: {
+    // 获取详细信息
+    async getChinesePatentMedicineDetail() {
+      this.loading = true;
+      let res = await getChinesePatentMedicineDetail(this.$route.query);
+      if (res.code == 0) {
+        if (!Array.isArray(res.data.attributes)) res.data.attributes = [];
+        if (Array.isArray(res.data.itemList)) {
+          const index = res.data.attributes.findIndex(item => item.field === 'constituent');
+          if (index !== -1) res.data.attributes.splice(index, 1);
+        }
+        this.info = res.data;
+        this.loading = false;
+      }
+    },
+    async print() {
+      printJS({
+        printable: this.$refs.print,
+        type: 'html',
+        documentTitle: `名医名方 - 中成药`,
+        scanStyles: false,
+        css: ['print/containers.css', 'print/PrescriptionD.css'],
+      })
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+@import "../../style/common.scss";
+
+.PrescriptionD {
+  background: #ffffff;
+  border-radius: 5px;
+  padding: 10px 10px;
+
+  height: 78vh;
+  position: relative;
+
+  .collect {
+    position: absolute;
+    top: 10px;
+    right: 20px;
+
+    img {
+      width: 50px;
+    }
+  }
+
+  .back {
+    width: 74px;
+    height: 36px;
+    background: #5386f6;
+    border-radius: 4px;
+    font-size: 14px;
+    font-family: PingFang SC;
+    font-weight: 400;
+    color: #ffffff;
+    cursor: pointer;
+    margin-bottom: 45px;
+  }
+
+  .detail {
+    .detail-item {
+      font-size: 16px;
+      font-family: PingFang SC;
+      font-weight: 400;
+      color: #333333;
+      margin-bottom: 10px;
+
+      .title {
+        width: 90px;
+        text-align-last: justify;
+      }
+
+      .right {
+        flex: 1;
+        white-space: pre-wrap;
+        white-space: break-spaces;
+      }
+
+      .zhuanfag {
+        width: 60px;
+        height: 26px;
+        background: #ffae45;
+        border-radius: 2px 2px 2px 2px;
+        font-size: 14px;
+        font-family: PingFang SC;
+        font-weight: 400;
+        color: #ffffff;
+        margin-bottom: 10px;
+      }
+
+      span {
+        display: inline-block;
+        margin-right: 30px;
+      }
+    }
+  }
+}
+
+.note {
+  align-items: flex-end;
+}
+
+.note ::v-deep .el-button {
+  height: 36px;
+  margin-left: 10px;
+}
+</style>
+<style lang="scss" scoped>
+@media screen and (min-width: 1681px) and (max-width: 1920px) {
+  .PrescriptionD {
+    height: 86vh;
+  }
+}
+
+@media screen and (min-width: 1601px) and (max-width: 1680px) {
+  .PrescriptionD {
+    height: 86vh;
+  }
+}
+
+@media screen and (min-width: 1361px) and (max-width: 1600px) {
+  .PrescriptionD {
+    height: 80vh;
+  }
+}
+
+@media screen and(min-width:1281px) and (max-width: 1360px) {
+  .PrescriptionD {
+    height: 80vh;
+  }
+}
+</style>