修改

src/components/myPagination/index.vue

@@ -1,32 +1,78 @@
 <template>
   <div class="pagination">
     <button style="background-color: #ffff">共 {{ total }} 条</button>
-        <el-select v-model="currentpageSize" placeholder="请选择" style="width: 100px;margin-right:16px" size="mini"
+    <el-select
-            @change="changesize">
+      v-model="currentpageSize"
-            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
+      placeholder="请选择"
+      style="width: 100px; margin-right: 16px"
+      size="mini"
+      @change="changesize"
+    >
+      <el-option
+        v-for="item in options"
+        :key="item.value"
+        :label="item.label"
+        :value="item.value"
+      >
       </el-option>
     </el-select>
-        <button @click="updateCPage(currentPage - 1)" :disabled="currentPage <= 1">上一页</button>
+    <button @click="updateCPage(currentPage - 1)" :disabled="currentPage <= 1" >
+      上一页
+    </button>
     <button v-if="startEnd.start > 1" @click="updateCPage(1)">1</button>
-        <button v-if="startEnd.start > 2" icon="el-icon-more" @click="updateCPage(currentPage - 5)"
+    <button
-            :class="[quickprevIconClass, { buttonactive: quickprevIconClass == 'el-icon-d-arrow-left' }]"
+      v-if="startEnd.start > 2"
-            @mouseenter="onMouseenter('left')" @mouseleave="quickprevIconClass = 'el-icon-more'">
+      icon="el-icon-more"
-        </button>
+      @click="updateCPage(currentPage - 5)"
+      :class="[
+        quickprevIconClass,
+        { buttonactive: quickprevIconClass == 'el-icon-d-arrow-left' },
+      ]"
+      @mouseenter="onMouseenter('left')"
+      @mouseleave="quickprevIconClass = 'el-icon-more'"
+    ></button>
     <template v-for="(item, index) in totalPage">
-            <button :class="{ active: Number(currentPage) === item }" :key="index"
+      <button
-                v-if="item >= startEnd.start && item <= startEnd.end" @click="updateCPage(item)">{{ item }}</button>
+        :class="{ active: Number(currentPage) === item }"
-        </template>
+        :key="index"
-        <button v-if="startEnd.end < totalPage - 1" icon="el-icon-more"
+        v-if="item >= startEnd.start && item <= startEnd.end"
-            :class="[quicknextIconClass, { buttonactive: quicknextIconClass == 'el-icon-d-arrow-right' }]"
+        @click="updateCPage(item)"
-            @click="updateCPage(currentPage + 5)" @mouseenter="onMouseenter('right')"
+      >
-            @mouseleave="quicknextIconClass = 'el-icon-more'">
+        {{ item }}
       </button>
-        <button v-if="startEnd.end < totalPage" @click="updateCPage(totalPage)">{{ totalPage }}</button>
+    </template>
-        <button @click="updateCPage(currentPage + 1)" :disabled="currentPage >= totalPage">下一页</button>
+    <button
-        <span style="margin-left:16px">
+      v-if="startEnd.end < totalPage - 1"
+      icon="el-icon-more"
+      :class="[
+        quicknextIconClass,
+        { buttonactive: quicknextIconClass == 'el-icon-d-arrow-right' },
+      ]"
+      @click="updateCPage(currentPage + 5)"
+      @mouseenter="onMouseenter('right')"
+      @mouseleave="quicknextIconClass = 'el-icon-more'"
+    ></button>
+    <button v-if="startEnd.end < totalPage" @click="updateCPage(totalPage)">
+      {{ totalPage }}
+    </button>
+    <button
+      @click="updateCPage(currentPage + 1)"
+      :disabled="currentPage >= totalPage"
+    >
+      下一页
+    </button>
+    <span style="margin-left: 16px">
       前往
-            <el-input v-model="page" min="1" :max="totalPage" style="width: 50px;margin:0 6px;" size="mini"
+      <el-input
-                @focus="foucus" @keyup.enter.native="blur" @blur="blur"></el-input>
+        v-model="page"
+        min="1"
+        :max="totalPage"
+        style="width: 50px; margin: 0 6px"
+        size="mini"
+        @focus="foucus"
+        @keyup.enter.native="blur"
+        @blur="blur"
+      ></el-input>
       页
     </span>
   </div>
@@ -45,126 +91,145 @@ export default {
    */
   name: "Pagination",
   //由父组件传递总条数 每页显示数  连续页码数  当前页下标
-    props: ["total", "pageSize", "indexFromWrap"],
+  props: ["total", "pageSize", "indexFromWrap", "indexFrom"],
   data() {
     return {
       lxyms: 7,
       currentPage: this.indexFromWrap,
       page: this.indexFromWrap,
       quickprevIconClass: "el-icon-more",
-            quicknextIconClass: 'el-icon-more',
+      quicknextIconClass: "el-icon-more",
-            options: [{
+      options: [
+        {
           value: 10,
-                label: '10条/页'
+          label: "10条/页",
-            }, {
+        },
+        {
           value: 20,
-                label: '20条/页'
+          label: "20条/页",
-            }, {
+        },
+        {
           value: 30,
-                label: '30条/页'
+          label: "30条/页",
-            }, {
+        },
+        {
           value: 50,
-                label: '50条/页'
+          label: "50条/页",
-            }, {
+        },
+        {
           value: 100,
-                label: '100条/页'
+          label: "100条/页",
-            }],
-            currentpageSize: 10
-        }
         },
-    mounted() {
+      ],
+      currentpageSize: 10,
+    };
   },
+  mounted() {},
   computed: {
     //总页数
     totalPage() {
-            return Math.ceil(this.total / this.pageSize)
+      return Math.ceil(this.total / this.pageSize);
     },
     //最终页-起始页 = 连续页码数-1
     startEnd() {
-            let { currentPage, lxyms, totalPage } = this
+      let { currentPage, lxyms, totalPage } = this;
       // return console.log(this)
       let start;
       let end;
       //计算连续页码的起始页
-            start = currentPage - Math.floor(lxyms / 2)
+      start = currentPage - Math.floor(lxyms / 2);
       if (start < 1) {
-                start = 1
+        start = 1;
-                this.quickprevIconClass = 'el-icon-more'
+        this.quickprevIconClass = "el-icon-more";
       }
       //结束页
-            end = start + lxyms - 1  //此时当start<1时 在计算end时已经进行补位了
+      end = start + lxyms - 1; //此时当start<1时 在计算end时已经进行补位了
       // end>totalPage ?end=totalPage:""
       if (end > totalPage) {
         end = totalPage;
         start = end - lxyms + 1; //此处当结束位置超出时,用start进行补位
-                start < 1 ? start = 1 : ""  // 要满足start处于一个正常的范围
+        start < 1 ? (start = 1) : ""; // 要满足start处于一个正常的范围
       }
       if (start >= 2 && end < totalPage - 1) {
-                start += 2
+        start += 2;
       }
       if (end == totalPage - 1 && start > 1) {
-                start += 1
+        start += 1;
-                end -= 1
+        end -= 1;
-            }
-            return { start, end }
       }
+      return { start, end };
+    },
   },
   methods: {
-        foucus() { },
+    foucus() {},
     blur() {
       if (!this.page) {
-                this.page = 1
+        this.page = 1;
       }
       if (this.page > this.totalPage) {
-                this.page = this.totalPage
+        this.page = this.totalPage;
       }
-            this.updateCPage(Number(this.page))
+      this.updateCPage(Number(this.page));
     },
     changesize() {
-            this.currentPage = 1
+      this.currentPage = 1;
-            this.page = 1
+      this.page = 1;
-            this.$emit("updateCPage", this.currentPage, this.currentpageSize)
+      this.$emit("updateCPage", this.currentPage, this.currentpageSize);
     },
     onMouseenter(direction) {
-            if (direction === 'left') {
+      if (direction === "left") {
-                this.quickprevIconClass = 'el-icon-d-arrow-left';
+        this.quickprevIconClass = "el-icon-d-arrow-left";
       } else {
-                this.quicknextIconClass = 'el-icon-d-arrow-right';
+        this.quicknextIconClass = "el-icon-d-arrow-right";
       }
     },
     updateCPage(currentPage) {
-            if (currentPage < 1) return
+      if (currentPage < 1) return;
       if (currentPage === this.currentPage) return;
       if (currentPage > this.totalPage - 3) {
-                this.quicknextIconClass = 'el-icon-more'
+        this.quicknextIconClass = "el-icon-more";
       }
       if (currentPage > this.totalPage) {
-                this.currentPage = this.totalPage
+        this.currentPage = this.totalPage;
       } else {
         this.currentPage = currentPage;
       }
       //将当前页的数据,与外部的父组件进行数据交互
-            this.$emit("updateCPage", this.currentPage, this.currentpageSize)
+      this.$emit("updateCPage", this.currentPage, this.currentpageSize);
-        }
+    },
   },
   watch: {
     currentPage: {
       handler(val) {
-                this.page = val
+        this.page = val;
       },
       deep: true,
-            immediate: true
+      immediate: true,
     },
     //监听当前页下标
     indexFromWrap: {
       handler(val) {
-                this.currentPage = val
+        console.log(val)
+        this.currentPage = val;
       },
       deep: true,
-            immediate: true
+      immediate: true,
+    },
+    indexFrom: {
+      handler(val) {
+        console.log(val, "100tiao");
+        if (val) {
+          this.currentpageSize = val;
+        } else {
+          this.currentpageSize = 10;
         }
-    }
+      },
-}
+      deep: true,
+      immediate: true,
+    },
+
+  },
+};
 </script>
 
 <style lang="less" scoped>

src/views/manage/components/cardlist.vue

@@ -1,56 +1,71 @@
 <template>
   <div :style="{ height: maxTableHeight + 'px' }" class="cardlist">
-        <div v-for="item in patientInfoList" :key="item.id">
+    <div v-for="(item, index) in patientInfoList" :key="item.id">
+      <div
+        @click="handleAuthRole(item, index)"
+        :class="listindex == index ? 'cards' : ''"
+      >
         <div class="carditem">
           <div class="top">
-                    <img v-if="item.sex == 'FEMALE'" src="../../../assets/manage/nvtouxiang.png" alt="" class="img" />
+            <img
-                    <img v-if="item.sex == 'MALE'" src="../../../assets/manage/touxiang.png" alt="" class="img" />
+              v-if="item.sex == 'FEMALE'"
+              src="../../../assets/manage/nvtouxiang.png"
+              alt=""
+              class="img"
+            />
+            <img
+              v-if="item.sex == 'MALE'"
+              src="../../../assets/manage/touxiang.png"
+              alt=""
+              class="img"
+            />
             <div class="name">
               {{ item.patientName }}
             </div>
             <div class="agesex">
-                        {{ item.sex == 'MALE' ? '男' : "" }}
+              {{ item.sex == "MALE" ? "男" : "" }}
-                        {{ item.sex == 'FEMALE' ? '女' : "" }}
+              {{ item.sex == "FEMALE" ? "女" : "" }}
-                        <span style="padding: 0 1px;">|</span>
+              <span style="padding: 0 1px">|</span>
-                        <span v-if="item.age">
+              <span v-if="item.age"> {{ item.age }}岁 </span>
-                            {{ item.age }}岁
+              <span class="zy" v-if="item.patientType == 'IN_HOSPITAL_PATIENT'"
-                        </span>
+                >在院</span
-                        <span class="zy" v-if="item.patientType == 'IN_HOSPITAL_PATIENT'">在院</span>
+              >
-                        <span class="cy" v-if="item.patientType == 'DISCHARGED_PATIENT'">出院</span>
+              <span class="cy" v-if="item.patientType == 'DISCHARGED_PATIENT'"
-                        <span class="yzy" v-if="item.patientType == 'PRE_HOSPITALIZED_PATIENT'">预住院</span>
+                >出院</span
-                        <span class="mz" v-if="item.patientType == 'OUTPATIENT'">门诊</span>
+              >
+              <span
+                class="yzy"
+                v-if="item.patientType == 'PRE_HOSPITALIZED_PATIENT'"
+                >预住院</span
+              >
+              <span class="mz" v-if="item.patientType == 'OUTPATIENT'"
+                >门诊</span
+              >
               <!-- <span class="mz" v-if="item.patientType == 'CONTRACTED_PATIENT'">签约</span> -->
             </div>
-                    <div class="diagnosis">
+            <div class="diagnosis">诊断名称：{{ item.mainDiagnosis }}</div>
-                        诊断名称：{{ item.mainDiagnosis }}
+            <div class="diagnosi">诊断状态：111</div>
-                    </div>
           </div>
           <div class="bottom">
-                    <div class="formitem">
+            <div class="formitembutton" @click.stop="handleedit(item)">画像编辑</div>
-                        医生：{{ item.attendingPhysicianName }}
+            <div class="formitem">医生：{{ item.attendingPhysician }}</div>
-                    </div>
+            <div class="formitem">科室：{{ item.departmentName }}</div>
-                    <div class="formitem">
+            <div class="formitem">就诊时间：{{ item.visitDate }}</div>
-                        科室：{{ item.departmentName }}
-                    </div>
-                    <div class="formitem">
-                        就诊时间：{{ item.visitDate }}
-                    </div>
             <div class="formitem flex">
-                        <span>
+              <span> 康复计划执行率： </span>
-                            康复计划执行率：
-                        </span>
               <el-progress :percentage="item.taskExecuteRate"></el-progress>
-                        <span style="flex:0.1">({{ item.taskExecuteNum }}/{{ item.taskNum }})</span>
+              <span style="flex: 0.1"
+                >({{ item.taskExecuteNum }}/{{ item.taskNum }})</span
+              >
             </div>
             <div class="formitem flex">
-                        <span>
+              <span> 康复计划完成率： </span>
-                            康复计划完成率：
-                        </span>
               <el-progress :percentage="item.taskFinishRate"></el-progress>
-                        <span style="flex:0.1">({{ item.taskFinishNum }}/{{ item.taskNum }})</span>
+              <span style="flex: 0.1"
+                >({{ item.taskFinishNum }}/{{ item.taskNum }})</span
+              >
             </div>
-                    <div class="formitem">
+            <div class="formitem">下次任务：</div>
-                        下次任务：{{ item.nextTaskName }} - {{ item.nextTaskTime }}
           </div>
         </div>
       </div>
@@ -58,8 +73,10 @@
   </div>
 </template>
 <script>
+import { getAge } from "@/utils/age";
+
 export default {
-    name: 'cardlist',
+  name: "cardlist",
   props: {
     maxTableHeight: {
       type: Number,
@@ -67,20 +84,73 @@ export default {
     },
     patientInfoList: {
       type: Array,
-            default: []
+      default: [],
-        }
+    },
   },
   data() {
     return {
-        }
+      listindex: 0,
-    },
+    };
-    mounted() {
   },
+  mounted() {},
   methods: {
-    }
+    handleAuthRole(item, index) {
-}
+      this.listindex = index;
+      this.$router.push({
+        path: "/patient/patientdetails",
+        query: {
+          path: "/patient/patientInfo",
+          patientId: item.id,
+          cardNo: item.cardNo,
+          patientName: item.patientName,
+          patientPhone: item.patientPhone,
+          sex: item.sex,
+          birthDate: item.birthDate,
+          familyMemberPhone: item.familyMemberPhone,
+          address: item.address,
+          patientSource: item.patientSource,
+          createTime: item.createTime,
+          age: item.birthDate ? getAge(item.birthDate) : "",
+        },
+      });
+    },
+    // 画像编辑
+    handleedit(item) {
+      this.$router.push({
+        path: "/patient/Portraitedit",
+        query: {
+          path: "/patient/patientInfo",
+          patientId: item.id,
+          cardNo: item.cardNo,
+          patientName: item.patientName,
+          patientPhone: item.patientPhone,
+          sex: item.sex,
+          birthDate: item.birthDate,
+          familyMemberPhone: item.familyMemberPhone,
+          address: item.address,
+          patientSource: item.patientSource,
+          createTime: item.createTime,
+          hospitalAgencyName: item.hospitalAgencyName,
+          mainDiagnosis: item.mainDiagnosis,
+          age: item.birthDate ? getAge(item.birthDate) : "",
+        },
+      });
+    },
+  },
+};
 </script>
 <style lang="scss" scoped>
+.cards {
+  margin-right: 10px;
+  margin-bottom: 10px;
+  width: 262px;
+  height: 262px;
+  border: 2px solid #1890ff;
+  border-radius: 10px;
+  font-size: 14px;
+  font-weight: 600;
+  z-index: 9999;
+}
 .cardlist {
   display: flex;
   flex-wrap: wrap;
@@ -92,7 +162,7 @@ export default {
     margin-bottom: 10px;
     width: 260px;
     min-height: 200px;
-        border: 1px solid #DCDFE6;
+    border: 1px solid #dcdfe6;
     border-radius: 10px;
     font-size: 14px;
     font-weight: 600;
@@ -105,13 +175,28 @@ export default {
         height: 26px;
         line-height: 26px;
         font-size: 12px;
-                color: #756A5E;
+        color: #756a5e;
         font-weight: 550;
         white-space: nowrap;
         text-overflow: ellipsis;
         overflow: hidden;
         overflow: hidden;
       }
+      .formitembutton {
+        height: 26px;
+        line-height: 26px;
+        font-size: 12px;
+        color: #756a5e;
+        font-weight: 550;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        float: right;
+        overflow: hidden;
+      }
+      .formitembutton:hover {
+        color: #2d56fb;
+      }
 
       .flex {
         display: flex;
@@ -142,7 +227,7 @@ export default {
 
     .top {
       height: 85px;
-            background-color: #F7F8FA;
+      background-color: #f7f8fa;
       position: relative;
       border-radius: 10px 10px 0 0;
       margin-bottom: 10px;
@@ -160,9 +245,9 @@ export default {
 
         //预住院
         .yzy {
-                    background-color: #E8F4EC;
+          background-color: #e8f4ec;
-                    color: #2FB844;
+          color: #2fb844;
-                    border: 1.5px solid #2FB844;
+          border: 1.5px solid #2fb844;
           border-radius: 2px;
           padding: 3px 5px;
           margin-left: 4px;
@@ -170,9 +255,9 @@ export default {
 
         //门诊
         .mz {
-                    background-color: #DFE4F6;
+          background-color: #dfe4f6;
-                    color: #2D56FB;
+          color: #2d56fb;
-                    border: 1.5px solid #2D56FB;
+          border: 1.5px solid #2d56fb;
           border-radius: 2px;
           padding: 3px 5px;
           margin-left: 4px;
@@ -180,9 +265,9 @@ export default {
 
         // 在院
         .zy {
-                    background-color: #DEEDF4;
+          background-color: #deedf4;
-                    color: #1D98C6;
+          color: #1d98c6;
-                    border: 1.5px solid #1D98C6;
+          border: 1.5px solid #1d98c6;
           border-radius: 2px;
           padding: 3px 5px;
           margin-left: 4px;
@@ -190,9 +275,9 @@ export default {
 
         // 出院
         .cy {
-                    background-color: #DEEFEE;
+          background-color: #deefee;
-                    color: #2A9A82;
+          color: #2a9a82;
-                    border: 1.5px solid #2A9A82;
+          border: 1.5px solid #2a9a82;
           border-radius: 2px;
           padding: 3px 5px;
           margin-left: 4px;
@@ -201,7 +286,7 @@ export default {
 
       .diagnosis {
         position: absolute;
-                color: #756A5E;
+        color: #756a5e;
         font-weight: 550;
         left: 70px;
         top: 42px;
@@ -213,11 +298,37 @@ export default {
         overflow: hidden;
         padding-right: 4px;
       }
+      .diagnosi {
+        position: absolute;
+        color: #756a5e;
+        font-weight: 550;
+        left: 70px;
+        top: 60px;
+        font-size: 12px;
+        height: 32px;
+        display: -webkit-box;
+        -webkit-line-clamp: 2;
+        -webkit-box-orient: vertical;
+        overflow: hidden;
+        padding-right: 4px;
+      }
 
       .name {
         position: absolute;
         left: 70px;
         top: 16px;
+        width: 76px;
+        white-space: nowrap; /* 确保文本在一行内显示 */
+        overflow: hidden; /* 超出容器部分隐藏 */
+        text-overflow: ellipsis; /* 超出部分显示省略号 */
+      }
+
+      /* 鼠标悬停时通过title属性显示完整文本 */
+      .name:hover {
+        // cursor: default; /* 更改鼠标形状为默认指针 */
+        // text-overflow: inherit; /* 取消省略号显示全文 */
+        white-space: normal;
+        overflow: visible; /* 显示全部文本 */
       }
     }
   }

src/views/manage/patientInfo/index.vue

@@ -2,78 +2,198 @@
   <div class="app-container" ref="layout">
     <div ref="topform" class="form">
       <div class="card-table">
-        <div :class="type == 'card' ? 'bluediv' : ''" @click="type = 'card'">
+        <div :class="type == 'card' ? 'bluediv' : ''" @click="typeitem">
           <img src="../../../assets/manage/kapian.png" alt="" />
-          <img src="../../../assets/manage/bluekapian.png" alt="" v-if="type == 'card'" />
+          <img
+            src="../../../assets/manage/bluekapian.png"
+            alt=""
+            v-if="type == 'card'"
+          />
         </div>
-        <div :class="type == 'table' ? 'bluediv' : ''" @click="type = 'table'">
+        <div :class="type == 'table' ? 'bluediv' : ''" @click="typeitemtable">
           <img src="../../../assets/manage/liebiao.png" alt="" />
-          <img src="../../../assets/manage/blueliebiao.png" alt="" v-if="type == 'table'" />
+          <img
+            src="../../../assets/manage/blueliebiao.png"
+            alt=""
+            v-if="type == 'table'"
+          />
         </div>
       </div>
-      <SearchFilter :labelWidths="280" style="width: calc(100% - 80px);" :widths="80" size="small" @search="handleQuery"
+      <SearchFilter
-        @reset="resetQuery" @minShowCtrol="getMaxTableHeight">
+        :labelWidths="280"
+        style="width: calc(100% - 80px)"
+        :widths="80"
+        size="small"
+        @search="handleQuery"
+        @reset="resetQuery"
+        @minShowCtrol="getMaxTableHeight"
+      >
         <el-form-item label="患者姓名" prop="patientName">
-          <el-input v-model="queryParams.patientName" placeholder="请输入患者姓名" clearable @keyup.enter.native="handleQuery"
+          <el-input
-            style="width:200px" />
+            v-model="queryParams.patientName"
+            placeholder="请输入患者姓名"
+            clearable
+            @keyup.enter.native="handleQuery"
+            style="width: 200px"
+          />
         </el-form-item>
         <el-form-item label="患者电话" prop="patientPhone">
-          <el-input v-model="queryParams.patientPhone" placeholder="请输入患者电话" clearable @keyup.enter.native="handleQuery"
+          <el-input
-            style="width:200px" />
+            v-model="queryParams.patientPhone"
+            placeholder="请输入患者电话"
+            clearable
+            @keyup.enter.native="handleQuery"
+            style="width: 200px"
+          />
+        </el-form-item>
+        <el-form-item label="身份证号" prop="cardNo">
+          <el-input
+            v-model="queryParams.cardNo"
+            placeholder="请输入患者身份证号"
+            clearable
+            @keyup.enter.native="handleQuery"
+            style="width: 200px"
+          />
         </el-form-item>
         <el-form-item label="诊断" prop="mainDiagnosis">
-          <el-input v-model="queryParams.mainDiagnosis" placeholder="请选择诊断" clearable style="width:200px"
+          <el-input
-            @keyup.enter.native="handleQuery" />
+            v-model="queryParams.mainDiagnosis"
+            placeholder="请选择诊断"
+            clearable
+            style="width: 200px"
+            @keyup.enter.native="handleQuery"
+          />
         </el-form-item>
         <el-form-item label="患者来源" prop="patientSource">
-          <el-select v-model="queryParams.patientSource" placeholder="请选择患者来源" clearable style="width:200px">
+          <el-select
-            <el-option v-for="dict in dict.type.patient_source" :key="dict.value" :label="dict.label"
+            v-model="queryParams.patientSource"
-              :value="dict.value" />
+            placeholder="请选择患者来源"
+            clearable
+            style="width: 200px"
+          >
+            <el-option
+              v-for="dict in dict.type.patient_source"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="就诊方式" prop="visitMethod">
-          <el-select v-model="queryParams.visitMethod" placeholder="请选择就诊方式" clearable style="width:200px">
+          <el-select
-            <el-option v-for="dict in dict.type.visit_method" :key="dict.value" :label="dict.label"
+            v-model="queryParams.visitMethod"
-              :value="dict.value" />
+            placeholder="请选择就诊方式"
+            clearable
+            style="width: 200px"
+          >
+            <el-option
+              v-for="dict in dict.type.visit_method"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
           </el-select>
         </el-form-item>
         <el-form-item label="就诊时间" prop="visitDateStart">
-          <el-date-picker v-model="visitDate" type="daterange" range-separator="至" start-placeholder="开始日期"
+          <el-date-picker
-            style="width:200px" value-format="yyyy-MM-dd" end-placeholder="结束日期">
+            v-model="visitDate"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            style="width: 200px"
+            value-format="yyyy-MM-dd"
+            end-placeholder="结束日期"
+          >
           </el-date-picker>
         </el-form-item>
         <el-form-item label="医院" prop="hospitalAgencyId">
-          <el-select v-model="queryParams.hospitalAgencyId" filterable placeholder="请选择医院" style="width:200px" clearable
+          <el-select
-            @clear="clearhospitalAgency" @change="changehospitalAgency">
+            v-model="queryParams.hospitalAgencyId"
-            <el-option v-for="item in hospitalAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
+            filterable
+            placeholder="请选择医院"
+            style="width: 200px"
+            clearable
+            @clear="clearhospitalAgency"
+            @change="changehospitalAgency"
+          >
+            <el-option
+              v-for="item in hospitalAgencylist"
+              :key="item.id"
+              :label="item.agencyName"
+              :value="item.id"
+            >
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="院区" prop="campusAgencyId">
-          <el-select v-model="queryParams.campusAgencyId" filterable placeholder="请选择院区" style="width:200px" clearable
+          <el-select
-            @clear="clearcampusAgency" @change="changecampusAgency">
+            v-model="queryParams.campusAgencyId"
-            <el-option v-for="item in campusAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
+            filterable
+            placeholder="请选择院区"
+            style="width: 200px"
+            clearable
+            @clear="clearcampusAgency"
+            @change="changecampusAgency"
+          >
+            <el-option
+              v-for="item in campusAgencylist"
+              :key="item.id"
+              :label="item.agencyName"
+              :value="item.id"
+            >
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="科室" prop="departmentId">
-          <el-select v-model="queryParams.departmentId" filterable placeholder="请选择科室" style="width:200px" clearable
+          <el-select
-            @clear="cleardepartment" @change="changedepartment">
+            v-model="queryParams.departmentId"
-            <el-option v-for="item in departmentlist" :key="item.id" :label="item.departmentName" :value="item.id">
+            filterable
+            placeholder="请选择科室"
+            style="width: 200px"
+            clearable
+            @clear="cleardepartment"
+            @change="changedepartment"
+          >
+            <el-option
+              v-for="item in departmentlist"
+              :key="item.id"
+              :label="item.departmentName"
+              :value="item.id"
+            >
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="病区" prop="wardId">
-          <el-select v-model="queryParams.wardId" filterable placeholder="请选择病区" style="width:200px" clearable>
+          <el-select
-            <el-option v-for="item in wardlist" :key="item.id" :label="item.departmentName" :value="item.id">
+            v-model="queryParams.wardId"
+            filterable
+            placeholder="请选择病区"
+            style="width: 200px"
+            clearable
+          >
+            <el-option
+              v-for="item in wardlist"
+              :key="item.id"
+              :label="item.departmentName"
+              :value="item.id"
+            >
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="主治医生" prop="attendingPhysicianId">
-          <el-select v-model="queryParams.attendingPhysicianId" style="width:200px" filterable placeholder="请选择主治医生"
+          <el-select
-            clearable>
+            v-model="queryParams.attendingPhysicianId"
-            <el-option v-for="item in attendingPhysicianlist" :key="item.userId" :label="item.nickName"
+            style="width: 200px"
-              :value="item.userId">
+            filterable
+            placeholder="请选择主治医生"
+            clearable
+          >
+            <el-option
+              v-for="item in attendingPhysicianlist"
+              :key="item.userId"
+              :label="item.nickName"
+              :value="item.userId"
+            >
             </el-option>
           </el-select>
         </el-form-item>
@@ -84,18 +204,32 @@
       </SearchFilter>
     </div>
     <div ref="table" v-if="type == 'table'">
-      <el-table :max-height="maxTableHeight" v-loading="loading" :data="patientInfoList">
+      <el-table
+        :max-height="maxTableHeight"
+        v-loading="loading"
+        :data="patientInfoList"
+      >
         <el-table-column label="序号" type="index" width="55" align="center" />
         <el-table-column label="患者姓名" align="center" prop="patientName" />
-        <el-table-column label="患者电话" align="center" prop="patientPhone" width='120' />
+        <el-table-column
+          label="患者电话"
+          align="center"
+          prop="patientPhone"
+          width="120"
+        />
         <el-table-column label="性别" align="center" prop="sex">
           <template slot-scope="scope">
-            {{ scope.row.sex == 'MALE' ? '男' : '' }}
+            {{ scope.row.sex == "MALE" ? "男" : "" }}
-            {{ scope.row.sex == 'FEMALE' ? '女' : '' }}
+            {{ scope.row.sex == "FEMALE" ? "女" : "" }}
           </template>
         </el-table-column>
         <el-table-column label="年龄" align="center" prop="age" />
-        <el-table-column label="出生日期" align="center" prop="birthDate" width='130' />
+        <el-table-column
+          label="出生日期"
+          align="center"
+          prop="birthDate"
+          width="130"
+        />
         <!-- <el-table-column label="签约状态" align="center" prop="signStatus">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.sign_status" :value="scope.row.signStatus" />
@@ -107,28 +241,68 @@
         </template>
       </el-table-column> -->
         <!-- <el-table-column label="开证医生" align="center" prop="certificateIssuingDoctor" /> -->
-        <el-table-column label="就诊时间" align="center" prop="visitDate" width='130'>
+        <el-table-column
+          label="就诊时间"
+          align="center"
+          prop="visitDate"
+          width="130"
+        >
           <template slot-scope="scope">
-            <span>{{ parseTime(scope.row.visitDate, '{y}-{m}-{d}') }}</span>
+            <span>{{ parseTime(scope.row.visitDate, "{y}-{m}-{d}") }}</span>
           </template>
         </el-table-column>
         <el-table-column label="诊断" align="center" prop="mainDiagnosis" />
         <!-- <el-table-column label="入院时间" align="center" prop="admissionTime" width='130' /> -->
-        <el-table-column label="医院" align="center" prop="hospitalAgencyName" width='130' />
+        <el-table-column
-        <el-table-column label="院区" align="center" prop="campusAgencyName" width='130' />
+          label="医院"
-        <el-table-column label="科室名称" align="center" prop="departmentName" width='130' />
+          align="center"
-        <el-table-column label="病区名称" align="center" prop="wardName" width='130' />
+          prop="hospitalAgencyName"
-        <el-table-column label="住院/门诊号" align="center" prop="inHospitalNumber" width='130' />
+          width="130"
-        <el-table-column label="主治医生" align="center" prop="attendingPhysicianName" />
+        />
+        <el-table-column
+          label="院区"
+          align="center"
+          prop="campusAgencyName"
+          width="130"
+        />
+        <el-table-column
+          label="科室名称"
+          align="center"
+          prop="departmentName"
+          width="130"
+        />
+        <el-table-column
+          label="病区名称"
+          align="center"
+          prop="wardName"
+          width="130"
+        />
+        <el-table-column
+          label="住院/门诊号"
+          align="center"
+          prop="inHospitalNumber"
+          width="130"
+        />
+        <el-table-column
+          label="主治医生"
+          align="center"
+          prop="attendingPhysicianName"
+        />
         <el-table-column label="就诊方式" align="center" prop="visitMethod">
           <template slot-scope="scope">
-            <dict-tag :options="dict.type.visit_method" :value="scope.row.visitMethod" />
+            <dict-tag
+              :options="dict.type.visit_method"
+              :value="scope.row.visitMethod"
+            />
           </template>
         </el-table-column>
         <!-- <el-table-column label="出院方式" align="center" prop="dischargeMethod" /> -->
         <el-table-column label="患者来源" align="center" prop="patientSource">
           <template slot-scope="scope">
-            <dict-tag :options="dict.type.patient_source" :value="scope.row.patientSource" />
+            <dict-tag
+              :options="dict.type.patient_source"
+              :value="scope.row.patientSource"
+            />
           </template>
         </el-table-column>
         <el-table-column label="住址" align="center" prop="address" />
@@ -139,34 +313,55 @@
             v-hasPermi="['manage:patientInfo:edit']">修改</el-button>
           <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
             v-hasPermi="['manage:patientInfo:remove']">删除</el-button> -->
-            <el-button size="mini" type="text" @click="handleAuthRole(scope.row)">详情</el-button>
+            <el-button
-            <el-button size="mini" type="text" @click="handleedit(scope.row)">画像编辑</el-button>
+              size="mini"
+              type="text"
+              @click="handleAuthRole(scope.row)"
+              >详情</el-button
+            >
+            <el-button  size="mini" type="text" @click="handleedit(scope.row)"
+              >画像编辑</el-button
+            >
           </template>
         </el-table-column>
       </el-table>
     </div>
     <div ref="table" v-else-if="type == 'card'">
-      <cardlist :maxTableHeight="maxTableHeight" :patientInfoList="patientInfoList"></cardlist>
+      <cardlist
+        :maxTableHeight="maxTableHeight"
+        :patientInfoList="patientInfoList"
+      ></cardlist>
     </div>
-    <myPagination v-show="total > 0" :total="total" :pageSize="queryParams.pageSize"
+    <myPagination
-      :indexFromWrap="queryParams.pageNum" @updateCPage="updateCPage"></myPagination>
+      v-show="total > 0"
+      :total="total"
+      :pageSize="queryParams.pageSize"
+      :indexFromWrap="queryParams.pageNum"
+      :indexFrom="indexFrom"
+      @updateCPage="updateCPage"
+    ></myPagination>
   </div>
 </template>
 
 <script>
 import { getPatientList } from "@/api/manage/patientInfo";
 import { getAge } from "@/utils/age";
-import { selectAgencyList, getDepartmentList, getAgencyList } from "@/api/manage/selectAgencyList";
+import {
+  selectAgencyList,
+  getDepartmentList,
+  getAgencyList,
+} from "@/api/manage/selectAgencyList";
 import { usergetList } from "@/api/unitconfig/patientConfiguration";
-import SearchFilter from '../../components/SearchForm.vue'
+import SearchFilter from "../../components/SearchForm.vue";
-import cardlist from '../components/cardlist.vue'
+import cardlist from "../components/cardlist.vue";
 export default {
   name: "PatientInfo",
-  dicts: ['patient_type', 'visit_method', 'sign_status', 'patient_source'],
+  dicts: ["patient_type", "visit_method", "sign_status", "patient_source"],
   components: { SearchFilter, cardlist },
   data() {
     return {
-      type: 'card',
+      type: "card",
+      indexFrom: "",
       searchData: {},
       maxTableHeight: undefined,
       attendingPhysicianlist: [],
@@ -179,7 +374,7 @@ export default {
       // 查询参数
       queryParams: {
         pageNum: 1,
-        pageSize: 10,
+        pageSize: 100,
         patientName: null,
         patientPhone: null,
         birthDate: null,
@@ -216,35 +411,49 @@ export default {
       wardlist: [],
     };
   },
+  watch: {
+    type: {
+      handler(val) {
+        if (val == "table") {
+          this.queryParams.pageSize = 10;
+          this.indexFrom = "";
+        } else if (val == "card") {
+          this.indexFrom = 100;
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
   created() {
     this.getList();
     this.selectAgencyinfo();
   },
   mounted() {
-    this.getMaxTableHeight()
+    this.getMaxTableHeight();
-    this.screenChange()
+    this.screenChange();
   },
   methods: {
     updateCPage(index, size) {
-      this.queryParams.pageNum = index
+      this.queryParams.pageNum = index;
-      this.queryParams.pageSize = size
+      this.queryParams.pageSize = size;
       this.getList();
     },
     //主治医生
     usergetListinfo() {
       usergetList({
         hospitalAgencyId: this.queryParams.hospitalAgencyId,
-        postName: 'DOCTOR'
+        postName: "DOCTOR",
-      }).then(res => {
+      }).then((res) => {
-        this.attendingPhysicianlist = res.data
+        this.attendingPhysicianlist = res.data;
-      })
+      });
     },
     /** 详情操作 */
     handleAuthRole(row) {
       this.$router.push({
         path: "/patient/patientdetails",
         query: {
-          path: '/patient/patientInfo',
+          path: "/patient/patientInfo",
           patientId: row.id,
           patientName: row.patientName,
           patientPhone: row.patientPhone,
@@ -267,7 +476,7 @@ export default {
           birthDate: row.birthDate,
           patientSource: row.patientSource,
           createTime: row.createTime,
-          age: row.birthDate ? getAge(row.birthDate) : ''
+          age: row.birthDate ? getAge(row.birthDate) : "",
         },
       });
     },
@@ -276,7 +485,7 @@ export default {
       this.$router.push({
         path: "/patient/Portraitedit",
         query: {
-          path: '/patient/patientInfo',
+          path: "/patient/patientInfo",
           patientId: row.id,
           cardNo: row.cardNo,
           patientName: row.patientName,
@@ -289,91 +498,118 @@ export default {
           createTime: row.createTime,
           hospitalAgencyName: row.hospitalAgencyName,
           mainDiagnosis: row.mainDiagnosis,
-          age: row.birthDate ? getAge(row.birthDate) : '',
+          age: row.birthDate ? getAge(row.birthDate) : "",
         },
       });
-
     },
     /** 查询患者信息列表 */
     getList() {
       this.loading = true;
       this.queryParams.params = {};
-      getPatientList(this.queryParams).then(response => {
+      const loading = this.$loading({
-        response.rows.forEach(e => {
+        lock: true,
-          e.birthDate ? e.age = getAge(e.birthDate) : ''
+        text: "数据加载中",
-        })
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)",
+      });
+      getPatientList(this.queryParams).then((response) => {
+        response.rows.forEach((e) => {
+          e.birthDate ? (e.age = getAge(e.birthDate)) : "";
+        });
+
         this.patientInfoList = response.rows;
         this.total = response.total;
+        loading.close();
         this.loading = false;
       });
     },
     /** 搜索按钮操作 */
     handleQuery() {
       if (this.visitDate?.length > 0) {
-        this.queryParams.visitDateStart = this.visitDate[0]
+        this.queryParams.visitDateStart = this.visitDate[0];
-        this.queryParams.visitDateEnd = this.visitDate[1]
+        this.queryParams.visitDateEnd = this.visitDate[1];
       } else {
-        this.queryParams.visitDateStart = null
+        this.queryParams.visitDateStart = null;
-        this.queryParams.visitDateEnd = null
+        this.queryParams.visitDateEnd = null;
       }
       if (this.admissionTime?.length > 0) {
-        this.queryParams.admissionTimeStart = this.admissionTime[0]
+        this.queryParams.admissionTimeStart = this.admissionTime[0];
-        this.queryParams.admissionTimeEnd = this.admissionTime[1]
+        this.queryParams.admissionTimeEnd = this.admissionTime[1];
       } else {
-        this.queryParams.admissionTimeStart = null
+        this.queryParams.admissionTimeStart = null;
-        this.queryParams.admissionTimeEnd = null
+        this.queryParams.admissionTimeEnd = null;
       }
       this.queryParams.pageNum = 1;
       this.getList();
     },
+    typeitem() {
+      this.type = "card";
+      this.queryParams.pageSize = 100;
+      // console.log( this.queryParams.pageSize)
+      this.getList();
+    },
+    typeitemtable() {
+      this.type = "table";
+      this.queryParams.pageSize = 10;
+      // console.log( this.queryParams.pageSize)
+      this.getList();
+    },
     /** 重置按钮操作 */
     resetQuery() {
+      if (this.type == "card") {
         this.queryParams = {
           pageNum: 1,
-        pageSize: 10
+          pageSize: 100,
+        };
+      } else {
+        this.queryParams = {
+          pageNum: 1,
+          pageSize: 10,
+        };
       }
+
       this.admissionTime = [];
-      this.queryParams.admissionTimeStart = null
+      this.queryParams.admissionTimeStart = null;
-      this.queryParams.admissionTimeEnd = null
+      this.queryParams.admissionTimeEnd = null;
-      this.visitDate = []
+      this.visitDate = [];
-      this.queryParams.visitDateStart = null
+      this.queryParams.visitDateStart = null;
-      this.queryParams.visitDateEnd = null
+      this.queryParams.visitDateEnd = null;
       this.handleQuery();
     },
     selectAgencyinfo() {
       let query = {
-        agencyStatus: 'ON',
+        agencyStatus: "ON",
-        nodeType: 'HOSPITAL',
+        nodeType: "HOSPITAL",
-      }
+      };
-      selectAgencyList(query).then(res => {
+      selectAgencyList(query).then((res) => {
-        this.hospitalAgencylist = res.data
+        this.hospitalAgencylist = res.data;
-      })
+      });
     },
     //获取下级单位
     getAgencyListinfo(nodeType, id) {
       let query = {
         nodeType: nodeType,
+      };
+      if (nodeType == "HOSPITAL") {
+        query.hospitalId = id;
+      } else if (nodeType == "CAMPUS") {
+        query.campusId = id;
+      } else if (nodeType == "DEPARTMENT") {
+        query.departmentId = id;
       }
-      if (nodeType == 'HOSPITAL') {
+      getAgencyList(query).then((res) => {
-        query.hospitalId = id
+        if (nodeType == "HOSPITAL") {
-      } else if (nodeType == 'CAMPUS') {
+          this.campusAgencylist = res.data.campusList;
-        query.campusId = id
+          this.departmentlist = res.data.departmentList;
-      } else if (nodeType == 'DEPARTMENT') {
+        } else if (nodeType == "CAMPUS") {
-        query.departmentId = id
+          this.departmentlist = res.data.departmentList;
         }
-      getAgencyList(query).then(res => {
+        this.wardlist = res.data.wardList;
-        if (nodeType == 'HOSPITAL') {
+      });
-          this.campusAgencylist = res.data.campusList
-          this.departmentlist = res.data.departmentList
-        } else if (nodeType == 'CAMPUS') {
-          this.departmentlist = res.data.departmentList
-        }
-        this.wardlist = res.data.wardList
-      })
     },
     //选中医院获取院区
     changehospitalAgency(id) {
-      this.getAgencyListinfo('HOSPITAL', id)
+      this.getAgencyListinfo("HOSPITAL", id);
       // let query = {
       //   agencyStatus: 'ON',
       //   nodeType: 'CAMPUS',
@@ -381,90 +617,91 @@ export default {
       // }
       // selectAgencyList(query).then(res => {
       //   this.campusAgencylist = res.data
-      this.queryParams.campusAgencyId = null
+      this.queryParams.campusAgencyId = null;
-      this.queryParams.departmentId = null
+      this.queryParams.departmentId = null;
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
-      this.queryParams.attendingPhysicianId = null
+      this.queryParams.attendingPhysicianId = null;
       // })
       //医生
       this.usergetListinfo();
     },
     //选中院区获取科室
     changecampusAgency(id) {
-      this.getAgencyListinfo('CAMPUS', id)
+      this.getAgencyListinfo("CAMPUS", id);
       // let query = {
       //   nodeType: 'DEPARTMENT',
       //   hospitalAgencyId: id,
       // }
       // getDepartmentList(query).then(res => {
       //   this.departmentlist = res.data
-      this.queryParams.departmentId = null
+      this.queryParams.departmentId = null;
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
       // })
     },
     //选中科室获取病区
     changedepartment(id) {
-      this.getAgencyListinfo('DEPARTMENT', id)
+      this.getAgencyListinfo("DEPARTMENT", id);
       // let query = {
       //   nodeType: 'WARD',
       //   parentDepartmentId: id,
       // }
       // getDepartmentList(query).then(res => {
       //   this.wardlist = res.data
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
       // })
     },
     //清空医院
     clearhospitalAgency() {
-      this.queryParams.campusAgencyId = null
+      this.queryParams.campusAgencyId = null;
-      this.queryParams.departmentId = null
+      this.queryParams.departmentId = null;
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
-      this.queryParams.attendingPhysicianId = null
+      this.queryParams.attendingPhysicianId = null;
       setTimeout(() => {
-        this.attendingPhysicianlist = []
+        this.attendingPhysicianlist = [];
       }, 1000);
     },
     //清空院区
     clearcampusAgency() {
-      this.queryParams.departmentId = null
+      this.queryParams.departmentId = null;
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
-      this.getAgencyListinfo('HOSPITAL', this.queryParams.hospitalAgencyId)
+      this.getAgencyListinfo("HOSPITAL", this.queryParams.hospitalAgencyId);
     },
     //清空科室
     cleardepartment() {
-      this.queryParams.wardId = null
+      this.queryParams.wardId = null;
       if (this.queryParams.departmentId) {
-        this.getAgencyListinfo('DEPARTMENT', this.queryParams.departmentId)
+        this.getAgencyListinfo("DEPARTMENT", this.queryParams.departmentId);
       } else if (this.queryParams.campusAgencyId) {
-        this.getAgencyListinfo('CAMPUS', this.queryParams.campusAgencyId)
+        this.getAgencyListinfo("CAMPUS", this.queryParams.campusAgencyId);
       } else if (this.queryParams.hospitalAgencyId) {
-        this.getAgencyListinfo('HOSPITAL', this.queryParams.hospitalAgencyId)
+        this.getAgencyListinfo("HOSPITAL", this.queryParams.hospitalAgencyId);
       }
     },
     // 获取表格最高高度
     getMaxTableHeight() {
-      const windowInnerHeight = window.innerHeight // 屏幕可视高度
+      const windowInnerHeight = window.innerHeight; // 屏幕可视高度
-      const layoutDiv = this.$refs.layout
+      const layoutDiv = this.$refs.layout;
-      const formDiv = this.$refs.topform
+      const formDiv = this.$refs.topform;
-      const mb8Div = this.$refs.mb8
+      const mb8Div = this.$refs.mb8;
       this.maxTableHeight =
-        windowInnerHeight - 134 -
+        windowInnerHeight -
+        134 -
         this.getBoxPadding(layoutDiv) -
         this.getBoxHeight(mb8Div) -
-        this.getBoxHeight(formDiv)
+        this.getBoxHeight(formDiv);
     },
     // 屏幕resize监听
     screenChange() {
       // 屏幕resize监听事件：一旦屏幕宽高发生变化，就会执行resize
-      window.addEventListener('resize', this.getMaxTableHeight, true)
+      window.addEventListener("resize", this.getMaxTableHeight, true);
       // 将屏幕监听事件移除
       // 这步是必须的。离开页面时不移除，再返回，或者进入到别的有相同元素的页面会报错
       // 或者将这里的方法直接写在beforeDestroy函数中也可以
-      this.$once('hook:beforeDestroy', () => {
+      this.$once("hook:beforeDestroy", () => {
-        window.removeEventListener('resize', this.getMaxTableHeight, true)
+        window.removeEventListener("resize", this.getMaxTableHeight, true);
-      })
+      });
+    },
   },
-  }
 };
 </script>
 <style lang="scss" scoped>
@@ -480,7 +717,7 @@ export default {
   margin-bottom: 10px;
   width: 260px;
   min-height: 200px;
-  border: 1px solid #DCDFE6;
+  border: 1px solid #dcdfe6;
   border-radius: 10px;
 }
 
@@ -514,7 +751,7 @@ export default {
     width: 30px;
     height: 30px;
     border-radius: 5px;
-    border: 1px solid #575B66;
+    border: 1px solid #575b66;
     position: relative;
   }
 
@@ -527,7 +764,7 @@ export default {
   }
 
   .bluediv {
-    border: 1px solid #409EFF !important;
+    border: 1px solid #409eff !important;
   }
 }
 </style>

src/views/manage/visitout/index.vue

@@ -19,7 +19,7 @@
       </el-form-item> -->
         <!-- ，门诊：OUTPATIENT_SERVICE，住院：BE_IN_HOSPITAL -->
         <!-- <el-form-item label="就诊方式" prop="visitMethod">
-        <el-select v-model="queryParams.visitMethod" placeholder="请选择就诊方式" clearable style="width:200px">
+        <el-select v-model="queryParams.visitMethod" placeholder="请选择就诊方式" clearable style="width:220px">
           <el-option v-for="dict in dict.type.visit_method" :key="dict.value" :label="dict.label" :value="dict.value" />
         </el-select>
       </el-form-item> -->
@@ -82,23 +82,23 @@
         </el-form-item>
         <!-- <el-form-item label="出生日期" prop="birthDate">
         <el-date-picker clearable v-model="queryParams.birthDate" type="date" value-format="yyyy-MM-dd"
-          style="width:200px" placeholder="请选择出生日期">
+          style="width:220px" placeholder="请选择出生日期">
         </el-date-picker>
       </el-form-item> -->
         <!-- 预住院患者：PRE_HOSPITALIZED_PATIENT，在院患者：IN_HOSPITAL_PATIENT，门诊患者：OUTPATIENT，出院患者：DISCHARGED_PATIENT，签约患者：CONTRACTED_PATIENT -->
         <!-- <el-form-item label="患者类型" prop="patientType">
-        <el-select v-model="queryParams.patientType" placeholder="请选择患者类型" clearable style="width:200px">
+        <el-select v-model="queryParams.patientType" placeholder="请选择患者类型" clearable style="width:220px">
           <el-option v-for="dict in dict.type.patient_type" :key="dict.value" :label="dict.label" :value="dict.value" />
         </el-select>
       </el-form-item> -->
         <!-- ，微信小程序：WE_CHAT_APPLET，微信公众号：WE_CHAT_OFFICIAL_ACCOUNT，管理端：MANAGE_END -->
         <!-- <el-form-item label="患者来源" prop="patientSource">
-        <el-select v-model="queryParams.patientSource" placeholder="请选择就诊方式" clearable style="width:200px">
+        <el-select v-model="queryParams.patientSource" placeholder="请选择就诊方式" clearable style="width:220px">
           <el-option v-for="dict in dict.type.patient_source" :key="dict.value" :label="dict.label" :value="dict.value" />
         </el-select>
       </el-form-item> -->
         <!-- <el-form-item label="出院方式" prop="dischargeMethod">
-        <el-input v-model="queryParams.dischargeMethod" placeholder="请输入出院方式" clearable style="width:200px"
+        <el-input v-model="queryParams.dischargeMethod" placeholder="请输入出院方式" clearable style="width:220px"
           @keyup.enter.native="handleQuery" />
       </el-form-item> -->
         <!-- <el-form-item>
@@ -192,7 +192,12 @@
         <el-table-column label="住址" align="center" prop="address" />
         <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="200">
           <template slot-scope="scope">
-            <el-button size="mini" type="text" @click="addsign(scope.row)">意向签约</el-button>
+            <el-button size="mini" type="text" @click="updatesign(scope.row)" v-if="scope.row.serviceStatus=='INTENTIONAL_SIGNING'" >修改意向</el-button>
+            <el-button size="mini" type="text" @click="addsign(scope.row)" v-if="scope.row.serviceStatus==''||scope.row.serviceStatus=='SERVICE_END'||scope.row.serviceStatus==null" >意向签约</el-button>
+
+            <el-button size="mini" type="text" @click="newsign(scope.row)" v-if="scope.row.serviceStatus=='SERVICE_CENTER'" >重新签约</el-button>
+            <!-- <el-button size="mini" type="text" @click="addsign(scope.row)" v-else >意向签约</el-button> -->
+
             <el-button size="mini" type="text" @click="handleAuthRole(scope.row)">详情</el-button>
             <el-button size="mini" type="text" @click="handleUpdate(scope.row)"
               v-hasPermi="['manage:preHospitalized:edit']">编辑</el-button>
@@ -211,21 +216,21 @@
       <el-form ref="openform" :model="form" :rules="rules" label-width="100px" :inline="true">
         <div class="titlenew">基本信息</div>
         <el-form-item label="患者姓名" prop="patientName">
-          <el-input v-model="form.patientName" placeholder="请输入患者姓名" style="width:200px" />
+          <el-input v-model="form.patientName" placeholder="请输入患者姓名" style="width:220px" />
         </el-form-item>
         <el-form-item label="患者电话" prop="patientPhone">
-          <el-input v-model="form.patientPhone" placeholder="请输入患者电话" style="width:200px" maxlength="11" />
+          <el-input v-model="form.patientPhone" placeholder="请输入患者电话" style="width:220px" maxlength="11" />
         </el-form-item>
         <el-form-item label="家属电话" prop="familyMemberPhone">
-          <el-input v-model="form.familyMemberPhone" placeholder="请输入家属电话" style="width:200px" maxlength="11" />
+          <el-input v-model="form.familyMemberPhone" placeholder="请输入家属电话" style="width:220px" maxlength="11" />
         </el-form-item>
         <!-- <el-form-item label="出生日期" prop="birthDate">
-          <el-date-picker clearable v-model="form.birthDate" style="width:200px" type="date" value-format="yyyy-MM-dd"
+          <el-date-picker clearable v-model="form.birthDate" style="width:220px" type="date" value-format="yyyy-MM-dd"
             placeholder="请选择出生日期">
           </el-date-picker>
         </el-form-item> -->
         <el-form-item label="身份证号" prop="cardNo">
-          <el-input v-model="form.cardNo" placeholder="请输入身份证号" style="width:200px" maxlength="18" />
+          <el-input v-model="form.cardNo" placeholder="请输入身份证号" style="width:220px" maxlength="18" />
         </el-form-item>
         <!-- <el-form-item label="性别" prop="sex">
           <el-radio-group v-model="form.sex" disabled>
@@ -234,86 +239,86 @@
           </el-radio-group>
         </el-form-item> -->
         <!-- <el-form-item label="年龄" prop="age">
-          <el-input v-model="form.age" placeholder="请输入年龄" style="width:200px" />
+          <el-input v-model="form.age" placeholder="请输入年龄" style="width:220px" />
         </el-form-item> -->
         <el-form-item label="住址" prop="address">
-          <el-input type="textarea" style="width:200px" :rows="2" placeholder="请输入住址" v-model="form.address" />
+          <el-input type="textarea" style="width:220px" :rows="2" placeholder="请输入住址" v-model="form.address" />
         </el-form-item>
         <div class="titlenew" style="margin-top:20px">就诊信息</div>
         <el-form-item label="就诊方式" prop="visitMethod">
-          <el-select v-model="form.visitMethod" placeholder="请选择就诊方式" style="width:200px">
+          <el-select v-model="form.visitMethod" placeholder="请选择就诊方式" style="width:220px">
             <el-option v-for="dict in dict.type.visit_method" :key="dict.value" :label="dict.label"
               :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="主要诊断" prop="mainDiagnosis">
-          <el-input v-model="form.mainDiagnosis" placeholder="请输入主要诊断" style="width:200px" />
+          <el-input v-model="form.mainDiagnosis" placeholder="请输入主要诊断" style="width:220px" />
         </el-form-item>
         <el-form-item label="医院" prop="hospitalAgencyId">
-          <el-select v-model="form.hospitalAgencyId" filterable placeholder="请选择医院" style="width:200px" clearable
+          <el-select v-model="form.hospitalAgencyId" filterable placeholder="请选择医院" style="width:220px" clearable
             @clear="clearhospitalAgency(1)" @change="changehospitalAgency($event, 1)">
             <el-option v-for="item in hospitalAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="院区" prop="campusAgencyId" v-show="form.hospitalAgencyId">
-          <el-select v-model="form.campusAgencyId" filterable placeholder="请选择院区" style="width:200px" clearable
+          <el-select v-model="form.campusAgencyId" filterable placeholder="请选择院区" style="width:220px" clearable
             @clear="clearcampusAgency(1)" @change="changecampusAgency($event, 1)">
             <el-option v-for="item in form_campusAgencylist" :key="item.id" :label="item.agencyName" :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="科室名称" prop="departmentId" v-show="form.hospitalAgencyId">
-          <el-select v-model="form.departmentId" filterable placeholder="请选择科室" style="width:200px" clearable
+          <el-select v-model="form.departmentId" filterable placeholder="请选择科室" style="width:220px" clearable
             @clear="cleardepartment(1)" @change="changedepartment($event, 1)">
             <el-option v-for="item in form_departmentlist" :key="item.id" :label="item.departmentName" :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="预约病区" prop="wardId" v-show="form.hospitalAgencyId">
-          <el-select v-model="form.wardId" filterable placeholder="请选择病区" style="width:200px" clearable>
+          <el-select v-model="form.wardId" filterable placeholder="请选择病区" style="width:220px" clearable>
             <el-option v-for="item in form_wardlist" :key="item.id" :label="item.departmentName" :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="主治医生" prop="attendingPhysician" v-show="form.hospitalAgencyId">
-          <el-select v-model="form.attendingPhysicianId" filterable placeholder="请选择主治医生" style="width:200px" clearable>
+          <el-select v-model="form.attendingPhysicianId" filterable placeholder="请选择主治医生" style="width:220px" clearable>
             <el-option v-for="item in form_attendingPhysicianlist" :key="item.userId" :label="item.nickName"
               :value="item.userId">
             </el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="门诊号" prop="inHospitalNumber" v-show="form.visitMethod == 'OUTPATIENT_SERVICE'">
-          <el-input v-model="form.inHospitalNumber" placeholder="请输入门诊号" style="width:200px"
+          <el-input v-model="form.inHospitalNumber" placeholder="请输入门诊号" style="width:220px"
             onKeyUp="value=value.replace(/[\W]/g,'')" />
         </el-form-item>
         <el-form-item label="住院号" prop="inHospitalNumber" v-show="form.visitMethod == 'BE_IN_HOSPITAL'">
-          <el-input v-model="form.inHospitalNumber" placeholder="请输入住院号" style="width:200px"
+          <el-input v-model="form.inHospitalNumber" placeholder="请输入住院号" style="width:220px"
             onKeyUp="value=value.replace(/[\W]/g,'')" />
         </el-form-item>
         <el-form-item label="责任护士" prop="responsibleNurse" v-show="form.visitMethod == 'BE_IN_HOSPITAL'">
-          <el-input v-model="form.responsibleNurse" placeholder="请输入责任护士" style="width:200px" />
+          <el-input v-model="form.responsibleNurse" placeholder="请输入责任护士" style="width:220px" />
         </el-form-item>
         <el-form-item label="就诊流水号" prop="visitSerialNumber">
-          <el-input v-model="form.visitSerialNumber" placeholder="请输入就诊流水号" style="width:200px" />
+          <el-input v-model="form.visitSerialNumber" placeholder="请输入就诊流水号" style="width:220px" />
         </el-form-item>
         <el-form-item label="门诊时间" prop="dischargeTime" v-show="form.visitMethod == 'OUTPATIENT_SERVICE'">
           <el-date-picker clearable v-model="form.dischargeTime" type="datetime" value-format="yyyy-MM-dd HH:mm"
-            format='yyyy-MM-dd HH:mm' placeholder="请选择门诊时间" style="width:200px">
+            format='yyyy-MM-dd HH:mm' placeholder="请选择门诊时间" style="width:220px">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="入院时间" prop="admissionTime" v-if="form.visitMethod == 'BE_IN_HOSPITAL'">
           <el-date-picker clearable v-model="form.admissionTime" type="datetime" value-format="yyyy-MM-dd HH:mm"
-            format='yyyy-MM-dd HH:mm' style="width:200px" placeholder="请选择入院时间">
+            format='yyyy-MM-dd HH:mm' style="width:220px" placeholder="请选择入院时间">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="出院时间" prop="dischargeTime" v-show="form.visitMethod == 'BE_IN_HOSPITAL'">
           <el-date-picker clearable v-model="form.dischargeTime" type="datetime" value-format="yyyy-MM-dd HH:mm"
-            format='yyyy-MM-dd HH:mm' :picker-options="pickerOptions" style="width:200px" placeholder="请选择出院时间">
+            format='yyyy-MM-dd HH:mm' :picker-options="pickerOptions" style="width:220px" placeholder="请选择出院时间">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="手术名称" prop="surgicalName">
-          <el-input v-model="form.surgicalName" placeholder="请输入手术名称" style="width:200px" />
+          <el-input v-model="form.surgicalName" placeholder="请输入手术名称" style="width:220px" />
         </el-form-item>
         <el-form-item label="手术记录" prop="surgicalRecord" v-show="form.visitMethod == 'BE_IN_HOSPITAL'">
           <editor v-model="form.surgicalRecord" :min-height="192" style="width:838px" />
@@ -325,60 +330,60 @@
           <editor v-model="form.outHospitalInfo" :min-height="192" style="width:838px" />
         </el-form-item>
         <!-- <el-form-item label="患者来源" prop="patientSource">
-          <el-select v-model="form.patientSource" placeholder="请选择患者来源" clearable style="width:200px">
+          <el-select v-model="form.patientSource" placeholder="请选择患者来源" clearable style="width:220px">
             <el-option v-for="dict in dict.type.patient_source" :key="dict.value" :label="dict.label"
               :value="dict.value" />
           </el-select>
         </el-form-item>
         <el-form-item label="开证医生" prop="certificateIssuingDoctor">
-          <el-input v-model="form.certificateIssuingDoctor" placeholder="请输入开证医生" style="width:200px" />
+          <el-input v-model="form.certificateIssuingDoctor" placeholder="请输入开证医生" style="width:220px" />
         </el-form-item>
         <el-form-item label="预约治疗组" prop="appointmentTreatmentGroup">
-          <el-input v-model="form.appointmentTreatmentGroup" placeholder="请输入预约治疗组" style="width:200px" />
+          <el-input v-model="form.appointmentTreatmentGroup" placeholder="请输入预约治疗组" style="width:220px" />
         </el-form-item>
         <el-form-item label="登记号" prop="registrationNo">
-          <el-input v-model="form.registrationNo" placeholder="请输入登记号" style="width:200px" />
+          <el-input v-model="form.registrationNo" placeholder="请输入登记号" style="width:220px" />
         </el-form-item>
         <el-form-item label="登记日期" prop="registrationDate">
           <el-date-picker clearable v-model="form.registrationDate" type="date" value-format="yyyy-MM-dd"
-            style="width:200px" placeholder="请选择登记日期">
+            style="width:220px" placeholder="请选择登记日期">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="预约时间" prop="appointmentDate">
           <el-date-picker clearable v-model="form.appointmentDate" type="date" value-format="yyyy-MM-dd"
-            style="width:200px" placeholder="请选择预约时间">
+            style="width:220px" placeholder="请选择预约时间">
           </el-date-picker>
         </el-form-item>
          <el-form-item label="患者类型" prop="patientType">
-          <el-select v-model="form.patientType" placeholder="请选择患者类型" style="width:200px">
+          <el-select v-model="form.patientType" placeholder="请选择患者类型" style="width:220px">
             <el-option v-for="dict in dict.type.patient_type" :key="dict.value" :label="dict.label"
               :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="签约状态" prop="signStatus">
-          <el-select v-model="form.signStatus" placeholder="请选择签约状态" style="width:200px">
+          <el-select v-model="form.signStatus" placeholder="请选择签约状态" style="width:220px">
             <el-option v-for="dict in dict.type.sign_status" :key="dict.value" :label="dict.label"
               :value="dict.value"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item label="签约时间" prop="signTime">
           <el-date-picker clearable v-model="form.signTime" type="date" value-format="yyyy-MM-dd" placeholder="请选择签约时间"
-            style="width:200px">
+            style="width:220px">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="出院时间" prop="dischargeTime">
-          <el-date-picker clearable v-model="form.dischargeTime" type="date" value-format="yyyy-MM-dd" style="width:200px"
+          <el-date-picker clearable v-model="form.dischargeTime" type="date" value-format="yyyy-MM-dd" style="width:220px"
             placeholder="请选择出院时间">
           </el-date-picker>
         </el-form-item>
         <el-form-item label="门诊号" prop="inHospitalNumber">
-          <el-input v-model="form.inHospitalNumber" placeholder="请输入门诊号" style="width:200px" />
+          <el-input v-model="form.inHospitalNumber" placeholder="请输入门诊号" style="width:220px" />
         </el-form-item>
         <el-form-item label="出院方式" prop="dischargeMethod">
-          <el-input v-model="form.dischargeMethod" placeholder="请输入出院方式" style="width:200px" />
+          <el-input v-model="form.dischargeMethod" placeholder="请输入出院方式" style="width:220px" />
         </el-form-item>
         <el-form-item label="微信openid" prop="openId">
-          <el-input v-model="form.openId" placeholder="请输入微信openid" style="width:200px" />
+          <el-input v-model="form.openId" placeholder="请输入微信openid" style="width:220px" />
         </el-form-item>
         -->
       </el-form>
@@ -388,10 +393,10 @@
       </div>
     </el-dialog>
     <!-- 意向签约 -->
-    <el-dialog title="意向签约" :visible.sync="addsignopen" width="500px" append-to-body>
+    <el-dialog :title="title" :visible.sync="addsignopen" width="500px" append-to-body>
       <el-form ref="addsignform" :model="addsignform" :rules="rules" label-width="100px">
         <el-form-item label="开单医生" prop="billingDoctorId">
-          <el-select v-model="addsignform.billingDoctorId" filterable placeholder="请选择开单医生" style="width:200px"
+          <el-select v-model="addsignform.billingDoctorId" filterable placeholder="请选择开单医生" style="width:220px"
             clearable>
             <el-option v-for="item in addsignattendingPhysicianlist" :key="item.userId" :label="item.nickName"
               :value="item.userId">
@@ -399,7 +404,7 @@
           </el-select>
         </el-form-item>
         <el-form-item label="意向来源" prop="intentionalSource">
-          <el-select v-model="addsignform.intentionalSource" filterable placeholder="请选择意向来源" style="width:200px"
+          <el-select v-model="addsignform.intentionalSource" filterable placeholder="请选择意向来源" style="width:220px"
             clearable>
             <el-option label="医生开单" value="DOCTOR_BILLING">
             </el-option>
@@ -407,6 +412,9 @@
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
+        <!-- <el-button type="danger" @click="cancelupload" v-if="title=='重新签约”'">撤销签约</el-button> -->
+        <el-button type="danger" @click="cancelupload" v-if="title=='修改意向'">撤销意向签约</el-button>
+
         <el-button type="primary" @click="addsignupload">确 定</el-button>
         <el-button @click="addsignopen = false">取 消</el-button>
       </div>
@@ -642,6 +650,7 @@ export default {
       this.queryParams.pageSize = size
       this.getList();
     },
+    cancelupload(){},
     addsignupload() {
       if (this.addsignform.billingDoctorId && this.addsignattendingPhysicianlist?.length > 0) {
         this.addsignform.billingDoctorName = this.addsignattendingPhysicianlist.find(e => e.userId == this.addsignform.billingDoctorId)?.nickName
@@ -651,6 +660,34 @@ export default {
         this.addsignopen = false
       })
     },
+    // 修改意向
+    updatesign(item){
+      console.log(item,'row')
+      this.addsignform = {
+        billingDoctorId: '',
+        billingDoctorName: '',
+        intentionalSource: '',
+        patientId: item.id,
+      }
+      this.usergetListinfotwo(item.hospitalAgencyId)
+      this.resetForm("addsignform");
+      this.title='修改意向'
+
+      this.addsignopen = true
+    },
+    // 重新签约
+    newsign(item){
+      this.addsignform = {
+        billingDoctorId: '',
+        billingDoctorName: '',
+        intentionalSource: '',
+        patientId: item.id,
+      }
+      this.title='重新签约'
+      this.usergetListinfotwo(item.hospitalAgencyId)
+      this.resetForm("addsignform");
+      this.addsignopen = true
+    },
     addsign(item) {
       this.addsignform = {
         billingDoctorId: '',
@@ -661,6 +698,8 @@ export default {
       this.usergetListinfotwo(item.hospitalAgencyId)
       this.resetForm("addsignform");
       this.addsignopen = true
+      this.title='意向签约'
+
     },
     //开单医生
     usergetListinfotwo(id) {