v6 医院后台

src/api/icss.js

@@ -214,5 +214,8 @@ export default {
   getPlanInfoIds(param) {
     return axios.post(urls.getPlanInfoIds, param);
   },
+  revStopPlans(param) {
+    return axios.post(urls.revStopPlans, param);
+  },
 
 };

src/components/icss/lis/AddLis.vue

@@ -9,7 +9,8 @@
       <div class="leftBox clearfix">
         <div class="itemLabel clearfix">
           <label class="itemLabelName">检验套餐：</label>
-          <input class="searchInput" type="text" v-model="hisName" />
+          <input class="searchInput" type="text" v-model="hisName" v-on:input="handleInput"/>
+          <span class="searchInputInfo" v-if="isVila">请输入检验套餐名称</span>
         </div>
         <div class="itemLabel clearfix">
           <label class="itemLabelName">检验套餐预览：</label>
@@ -43,7 +44,7 @@
               class="mealNameItem ellipsis"
               :title="hisName === '' ? item.name : item"
               @click="selectUniqueName(item)"
-              :key="hisName === '' ? item.name : item"
+              :key="hisName === '' ? item.uniqueName + item.name : item"
             >{{hisName === '' ? item.name : item}}</li>
           </ul>
         </div>
@@ -87,7 +88,8 @@ export default {
         uniqueName: '', //公表名称，必填
         uniqueId: '' //公表项Id
       },
-      saveDisable: false //保存按钮禁止点击
+      saveDisable: false, //保存按钮禁止点击
+      isVila: false
     };
   },
   created() {
@@ -134,7 +136,8 @@ export default {
       }
       api.retrievalSearch(params).then(res => {
         if (res.data.code === '0') {
-          this.uniqueNameList = type=== 1 ? res.data.data.lisNames : res.data.data.lisDetailNames;
+          this.uniqueNameList =
+            type === 1 ? res.data.data.lisNames : res.data.data.lisDetailNames;
           this.showSearchList('showUniqueNameList');
         }
       });
@@ -185,11 +188,19 @@ export default {
       this.hisDetailName = '';
     },
 
+    handleInput(){
+      // console.log(event.target.value,'=============');
+      if(event.target.value.length!== 0){
+        this.isVila = false
+      }
+    },
+
     // 建立关联-参数处理
     submitForm() {
       const { hisName, hisDetailName } = this;
       const { uniqueName } = this.form;
       if (!hisName || !uniqueName) {
+        this.isVila = true;
         this.warning('请填写相关数据');
         return;
       }
@@ -337,6 +348,14 @@ export default {
     float: left;
     color: #606266;
   }
+  .searchInputInfo {
+    // margin-left: 8px;
+    color: #ed808d;
+    position: absolute;
+    top: 26px;
+    left: 150px;
+    font-size: 14px;
+  }
   .itemLabelName {
     width: 150px;
   }

src/components/icss/plan/AddPlan.vue

@@ -13,6 +13,13 @@
           <ul>
             <li>
               <div class="title">
+                <div class="handleIcon" @click="openPlanItems">
+                  <img
+                    src="../../../images/multi.png"
+                    alt="辅助信息"
+                    :class="{'open' : isOpenCloseItems}"
+                  />
+                </div>
                 <h4>辅助信息</h4>
                 <div class="titlwSwitch">
                   <el-switch
@@ -25,45 +32,66 @@
                   <span class="titlwSwitchStatus">{{switchSubStatus === 1 ? '启用中' : '未启用'}}</span>
                 </div>
               </div>
-              <ul class="sub" v-for="(item,index) in  planDefaultList" :key="item.id">
-                <li class="planItem">
-                  <div class="sort">
-                    <div
-                      class="down"
-                      @click="sortPlan('down')"
-                      v-if="index !== planDefaultList.length - 1"
-                    >下</div>
-                    <div class="top" @click="sortPlan('top')" v-if="index !== 0">上</div>
-                  </div>
-                  <div class="openOrClose">
-                    <span class="planInfo">{{item.name}}</span>
-                    <div class="switch">
-                      <el-switch
-                        v-model="item.status"
-                        :active-value="1"
-                        :inactive-value="0"
-                        active-color="#4BC4D7"
-                        inactive-color="#BBBBBB"
-                      ></el-switch>
-                    </div>
-                    <span class="planStatus">{{item.status === 1 ? '启用中' : '未启用'}}</span>
-                  </div>
-                  <div class="showNum" v-if="item.number">
-                    <span style="marginRight:8px;">默认显示个数</span>
-                    <el-select v-model="item.number" placeholder="请选择" size="small">
-                      <el-option label="1" value="1"></el-option>
-                      <el-option label="2" value="2"></el-option>
-                      <el-option label="3" value="3"></el-option>
-                      <el-option label="4" value="4"></el-option>
-                      <el-option label="5" value="5"></el-option>
-                      <el-option label="6" value="6"></el-option>
-                    </el-select>
-                  </div>
-                </li>
-              </ul>
+              <transition name="plus-icon">
+                <div v-if="isOpenCloseItems">
+                  <ul class="sub" v-for="(item,index) in  planDefaultList" :key="item.id">
+                    <li class="planItem">
+                      <div class="sort">
+                        <div class="top">
+                          <img
+                            :src="isTopLight !== index ? require('../../../images/icon_default_top.png') : require('../../../images/icon_hover_top.png')"
+                            alt="上升"
+                            v-if="index !== 0"
+                            @click="sortPlan(item,index,'top')"
+                            @mouseover="handleMouseEnter1(index)"
+                            @mouseleave="handleMouseLeave1(index)"
+                          />
+                        </div>
+                        <div class="down">
+                          <img
+                            :src="isDownLight !== index ? require('../../../images/icon_default_down.png') : require('../../../images/icon_hover_down.png')"
+                            alt="下降"
+                            v-if="index !== planDefaultList.length - 1"
+                            @click="sortPlan(item,index,'down')"
+                            @mouseover="handleMouseEnter(index)"
+                            @mouseleave="handleMouseLeave(index)"
+                          />
+                        </div>
+                      </div>
+                      <div class="openOrClose">
+                        <span class="planInfo">{{item.name}}</span>
+                        <div class="switch">
+                          <el-switch
+                            v-model="item.status"
+                            :active-value="1"
+                            :inactive-value="0"
+                            active-color="#4BC4D7"
+                            inactive-color="#BBBBBB"
+                          ></el-switch>
+                        </div>
+                        <span class="planStatus">{{item.status === 1 ? '启用中' : '未启用'}}</span>
+                      </div>
+                      <div class="showNum" v-if="item.number">
+                        <span style="marginRight:8px;">默认显示个数</span>
+                        <el-select v-model="item.number" placeholder="请选择" size="small">
+                          <el-option label="1" value="1"></el-option>
+                          <el-option label="2" value="2"></el-option>
+                          <el-option label="3" value="3"></el-option>
+                          <el-option label="4" value="4"></el-option>
+                          <el-option label="5" value="5"></el-option>
+                          <el-option label="6" value="6"></el-option>
+                        </el-select>
+                      </div>
+                    </li>
+                  </ul>
+                </div>
+              </transition>
             </li>
             <li>
               <div class="title">
+                <div class="handleIcon">
+                  <img src="../../../images/multi.png" alt="医学知识" />
+                </div>
                 <h4>医学知识</h4>
                 <div class="titlwSwitch">
                   <el-switch
@@ -110,9 +138,21 @@ export default {
       hospitalId: '',
       isEdit: false, // 是否处于编辑页面 false--新增   true--编辑
       switchSubStatus: 0, // 辅助信息
-      switchMedStatus: 0 // 医学知识
+      switchMedStatus: 0, // 医学知识
+      isOpenCloseItems: true, // 是否展开方案配置项
+      isDownLight: -1,
+      isTopLight: -1,
+      flag: 1
     };
   },
+  watch: {
+    planDefaultList: {
+      handler(newName, oldName) {
+        // console.log('obj.a changed');
+      },
+      immediate: true
+    }
+  },
   async created() {
     const { isEdit, data } = this.$route.params;
     // console.log(data, '编辑页传递的data');
@@ -133,9 +173,85 @@ export default {
   },
   methods: {
     close() {},
+
     // 方案配置排序
-    sortPlan(type) {
-      console.log('排序', type);
+    sortPlan(item, index, type) {
+      // console.log('排序', item, index, type);
+      let tempList = [...this.planDefaultList];
+      if (type === 'down') {
+        // 降序
+        let plan = tempList.find(item => {
+          return item.orderNo === index + 1;
+        });
+        let tempPlan = { ...plan };
+        let planNext = tempList.find(item => {
+          return item.orderNo === index + 2;
+        });
+        let tempPlanNext = { ...planNext };
+        plan = tempPlanNext;
+        plan.orderNo -= 1;
+        planNext = tempPlan;
+        planNext.orderNo += 1;
+        let arr = tempList.map((i, idx) => {
+          if (idx === index) {
+            return { ...plan };
+          } else if (idx === index + 1) {
+            return { ...planNext };
+          } else {
+            return i;
+          }
+        });
+        this.planDefaultList = [...arr];
+      } else {
+        // 升序
+        let plan = tempList.find(item => {
+          return item.orderNo === index + 1;
+        });
+        let tempPlan = { ...plan };
+        let planPre = tempList.find(item => {
+          return item.orderNo === index;
+        });
+        let tempPlanPre = { ...planPre };
+        plan = tempPlanPre;
+        plan.orderNo += 1;
+        planPre = tempPlan;
+        planPre.orderNo -= 1;
+        let arr = tempList.map((i, idx) => {
+          if (idx === index) {
+            return { ...plan };
+          } else if (idx === index - 1) {
+            return { ...planPre };
+          } else {
+            return i;
+          }
+        });
+        this.planDefaultList = [...arr];
+      }
+    },
+
+    // 展开列表项
+    openPlanItems() {
+      this.isOpenCloseItems = !this.isOpenCloseItems;
+    },
+
+    // 鼠标移入
+    handleMouseEnter(index) {
+      this.isDownLight = index;
+    },
+
+    // 鼠标移除
+    handleMouseLeave(index) {
+      this.isDownLight = -1;
+    },
+
+    // 鼠标移入
+    handleMouseEnter1(index) {
+      this.isTopLight = index;
+    },
+
+    // 鼠标移除
+    handleMouseLeave1(index) {
+      this.isTopLight = -1;
     },
 
     // 获取默认方案配置
@@ -145,15 +261,15 @@ export default {
         if (res.data.code === '0') {
           this.planDefaultList =
             res.data.data &&
-            res.data.data.planDetailDefault &&
+            res.data.data.planDetailDefault.length !== 0 &&
             res.data.data.planDetailDefault[0].planDetails;
           this.switchSubStatus =
             res.data.data &&
-            res.data.data.planDetailDefault &&
+            res.data.data.planDetailDefault.length !== 0 &&
             res.data.data.planDetailDefault[0].status;
           this.switchMedStatus =
             res.data.data &&
-            res.data.data.planDetailDefault &&
+            res.data.data.planDetailDefault.length !== 0 &&
             res.data.data.planDetailDefault[1].status;
         }
       });
@@ -205,7 +321,7 @@ export default {
             number: 0,
             orderNo: 1,
             planDetailSub: this.handleSendData(),
-            status: this.switchSubStatus,
+            status: this.switchSubStatus
           },
           {
             code: 'medical',
@@ -213,16 +329,16 @@ export default {
             name: '医学知识',
             orderNo: 3,
             planDetailSub: [{}],
-            status: this.switchMedStatus,
+            status: this.switchMedStatus
           }
         ], // 方案配置信息
         planName: this.form.planName,
-        planStatus: 1,
+        planStatus: 0
       };
-      if (this.isEdit){
-        // 编辑状态,需要额外添加ID 
-        const {  data } = this.$route.params;
-        params = {...params,id: data.id}
+      if (this.isEdit) {
+        // 编辑状态,需要额外添加ID
+        const { data } = this.$route.params;
+        params = { ...params, id: data.id };
       }
       return params;
     },
@@ -230,29 +346,30 @@ export default {
     onSubmit() {
       this.$refs.form.validate(valid => {
         if (valid) {
-          this.saveDisable = true
+          this.saveDisable = true;
           let params = this._getParams();
           api.savePlanInfoDatas(params).then(res => {
             if (res.data.code === '0') {
               this.$message({
                 showClose: true,
                 message: '操作成功',
-                type: 'success'
+                type: 'success',
+                duration: 1000
               });
             } else if (res.data.code === '00020007') {
               // 方案名/方案编码已存在
               this.$message({
                 showClose: true,
                 message: res.data.msg,
-                type: 'error'
+                type: 'error',
+                duration: 1000
               });
             }
-            this.saveDisable = false
+            this.saveDisable = false;
           });
         } else {
-          this.saveDisable = false
+          this.saveDisable = false;
           return false;
-
         }
       });
     }
@@ -274,13 +391,31 @@ export default {
   .title {
     background-color: #f2f2f2;
     display: flex;
+    .handleIcon {
+      width: 30px;
+      cursor: pointer;
+      height: 40px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      img {
+        width: 20px;
+        height: 20px;
+      }
+      .open {
+        transform: rotate(180deg);
+      }
+      .close {
+        transform: rotate(0deg);
+      }
+    }
     .titlwSwitch {
       width: 120px;
     }
     h4 {
       flex: 1;
     }
-    .titlwSwitchStatus{
+    .titlwSwitchStatus {
       margin-left: 16px;
     }
   }
@@ -291,12 +426,26 @@ export default {
         width: 60px;
         display: flex;
         .top {
+          display: flex;
+          justify-content: center;
+          align-items: center;
           width: 30px;
           cursor: pointer;
+          img {
+            width: 16px;
+            height: 20px;
+          }
         }
         .down {
           width: 30px;
           cursor: pointer;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          img {
+            width: 16px;
+            height: 20px;
+          }
         }
       }
       .openOrClose {
@@ -323,5 +472,19 @@ export default {
   .el-button {
     float: right;
   }
+  .plus-icon-enter-active {
+    transition: all 0.8s;
+  }
+  .plus-icon-enter {
+    opacity: 0;
+    margin-top: 12px;
+  }
+  .plus-icon-leave-active {
+    transition: all 0.8s;
+  }
+  .plus-icon-leave-active {
+    opacity: 0;
+    margin-top: 12px;
+  }
 }
 </style>

src/components/icss/plan/Plan.vue

@@ -28,11 +28,17 @@
             >修改</el-button>
             <el-button plain type="text" size="small" v-else disabled>修改</el-button>
             <span style="margin:0 3px;">|</span>
-            <el-button type="text" size="small" class="delete" v-if="scope.row.planStatus === 1">禁用</el-button>
-            <el-button type="text" size="small" @click="enableOrAble" v-else>启用</el-button>
+            <el-button
+              type="text"
+              size="small"
+              class="delete"
+              @click="enableOrAble(scope.row,0)"
+              v-if="scope.row.planStatus === 1"
+            >禁用</el-button>
+            <el-button type="text" size="small" @click="enableOrAble(scope.row,1)" v-else>启用</el-button>
             <span style="margin:0 3px;">|</span>
             <el-button
-              @click="showDelDialog(scope.row.id)"
+              @click="showDelDialog(scope.row.id,scope.row.planStatus,scope.row.planName)"
               class="delete"
               type="text"
               size="small"
@@ -228,7 +234,19 @@ export default {
       });
     },
     // 删除关联
-    showDelDialog(id) {
+    showDelDialog(id, status, info) {
+      if (status === 1) {
+        this.$confirm(`${info}正在启用中，无法删除。`, '', {
+          confirmButtonText: '确定',
+          // cancelButtonText: '取消',
+          cancelButtonClass: 'makeSure',
+          customClass: 'exportBox'
+        })
+          .then(() => {})
+          .catch(() => {});
+        return false;
+      }
+
       this.showConfirmDialog('是否删除该方案配置？', () => {
         let params = {
           planId: id,
@@ -259,9 +277,44 @@ export default {
       });
     },
 
+    // 启用/禁用 数据请求
+    sendAbleOrEn(row, type) {
+      api
+        .revStopPlans({
+          id: row.id,
+          status: type
+        })
+        .then(res => {
+          if (res.data.code === '0') {
+            this.$message({
+              showClose: true,
+              message: '操作成功',
+              type: 'success',
+              duration: 1000
+            });
+            this.getDataList();
+          }
+        })
+        .catch(err => {});
+    },
+
     // 启用/禁用
-    enableOrAble(){
-      console.log('启用');
+    enableOrAble(row, type) {
+      // console.log('启用planName', row, type);
+      if (type === 1) {
+        // 启用
+        this.showConfirmDialog(`确定要启用${row.planName}吗？`, () => {
+          this.sendAbleOrEn(row, type);
+        });
+      } else {
+        // 禁用
+        this.showConfirmDialog(
+          `方案禁用后前端页面将无法正常显示内容，确定要禁用${row.planName}吗？`,
+          () => {
+            this.sendAbleOrEn(row, type);
+          }
+        );
+      }
     }
   }
 };
@@ -295,6 +348,10 @@ export default {
     background-color: #d7d7d7;
     border-color: transparent;
   }
+  /deep/ .makeSure {
+    // text-align: center;
+    display: none;
+  }
 }
 .contents {
   .is-plain {