修改签约专病路径详情

src/api/manage/Auditing.js

@@ -33,7 +33,22 @@ export function getRouteAuditinfo(signRecordId) {
         method: 'get',
     })
 }
+//路径信息2
+export function getRouteInfo(id) {
+    return request({
+        url: `/system/specialDiseaseRoute/getRouteInfo/${id}`,
+        method: 'get',
+    })
+}
 
+//路径任务2
+
+export function getRouteNodeInfos(id) {
+    return request({
+        url: `/system/specialDiseaseRoute/getRouteNodeInfo/${id}`,
+        method: 'get',
+    })
+}
 //路径任务
 export function getRouteNodeInfo(signRecordId) {
     return request({

src/views/manage/components/specialDiseaseRoute.vue

@@ -1,60 +1,366 @@
 <template>
   <div>
-    <el-button size="small" @click="classificationOpen = true" style="width: 200px;font-size:14px;text-align:left"
+    <el-button
-      :style="handleselectName ? 'color:black' : 'color:#C0C4CC'">{{ handleselectName ? handleselectName :
+      size="small"
-        '请选择专病管理路径' }}</el-button>
+      @click="classificationOpen = true"
-    <el-dialog title="专病管理路径选择" :visible.sync="classificationOpen" width="70%" :before-close="classificationOpenfalse">
+      style="width: 200px; font-size: 14px; text-align: left"
+      :style="handleselectName ? 'color:black' : 'color:#C0C4CC'"
+      >{{
+        handleselectName ? handleselectName : "请选择专病管理路径"
+      }}</el-button
+    >
+    <el-dialog
+      title="专病管理路径选择"
+      :visible.sync="classificationOpen"
+      width="70%"
+      :before-close="classificationOpenfalse"
+    >
       <el-row :gutter="20">
         <el-col :span="6" :xs="24">
-          <DepartmentList ref="DepartmentList" :modal="false" @clickdepartment="clickdepartment"
+          <DepartmentList
-            :servicePackageId="servicePackageId" :methods="'selectDiseaseCounttwo'">
+            ref="DepartmentList"
+            :modal="false"
+            @clickdepartment="clickdepartment"
+            :servicePackageId="servicePackageId"
+            :methods="'selectDiseaseCounttwo'"
+          >
           </DepartmentList>
         </el-col>
         <el-col :span="18">
-          <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
+          <el-form
-            label-width="68px">
+            :model="queryParams"
+            ref="queryForm"
+            size="small"
+            :inline="true"
+            v-show="showSearch"
+            label-width="68px"
+          >
             <el-form-item label="路径名称" prop="routeName">
-              <el-input v-model="queryParams.routeName" placeholder="请输入路径名称" clearable
+              <el-input
-                @keyup.enter.native="handleQuery" />
+                v-model="queryParams.routeName"
+                placeholder="请输入路径名称"
+                clearable
+                @keyup.enter.native="handleQuery"
+              />
             </el-form-item>
             <el-form-item label="路径分类" prop="routeClassify">
-              <el-select v-model="queryParams.routeClassify" placeholder="请选择">
+              <el-select
+                v-model="queryParams.routeClassify"
+                placeholder="请选择"
+              >
                 <el-option label="全部" value="ALL" />
-                <el-option label="科室管理路径" value="DEPARTMENT_MANAGE_PATH" />
+                <el-option
-                <el-option label="专病管理路径" value="SPECIAL_DIEASE_MANAGE_PATH" />
+                  label="科室管理路径"
+                  value="DEPARTMENT_MANAGE_PATH"
+                />
+                <el-option
+                  label="专病管理路径"
+                  value="SPECIAL_DIEASE_MANAGE_PATH"
+                />
               </el-select>
             </el-form-item>
             <el-form-item>
-              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+              <el-button
-              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+                type="primary"
+                icon="el-icon-search"
+                size="mini"
+                @click="handleQuery"
+                >搜索</el-button
+              >
+              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+                >重置</el-button
+              >
             </el-form-item>
           </el-form>
-          <el-table v-loading="loading" :data="specialDiseaseRouteList" @selection-change="handleSelectionChange"
+          <el-table
-            @row-dblclick="handleselect">
+            v-loading="loading"
-            <el-table-column label="序号" type="index" width="55" align="center" />
+            :data="specialDiseaseRouteList"
+            @selection-change="handleSelectionChange"
+            @row-dblclick="handleselect"
+          >
+            <el-table-column
+              label="序号"
+              type="index"
+              width="55"
+              align="center"
+            />
             <el-table-column label="路径名称" align="center" prop="routeName" />
             <el-table-column label="版本号" align="center" prop="version" />
-            <el-table-column label="路径分类" align="center" prop="routeClassify">
+            <el-table-column
+              label="路径分类"
+              align="center"
+              prop="routeClassify"
+            >
               <template slot-scope="scope">
-                {{ scope.row.routeClassify == 'DEPARTMENT_MANAGE_PATH' ? '科室管理路径' : '' }}
+                {{
-                {{ scope.row.routeClassify == 'SPECIAL_DIEASE_MANAGE_PATH' ? '专病管理路径' : '' }}
+                  scope.row.routeClassify == "DEPARTMENT_MANAGE_PATH"
+                    ? "科室管理路径"
+                    : ""
+                }}
+                {{
+                  scope.row.routeClassify == "SPECIAL_DIEASE_MANAGE_PATH"
+                    ? "专病管理路径"
+                    : ""
+                }}
               </template>
             </el-table-column>
-            <el-table-column label="病种名称" align="center" prop="diseaseTypeName" />
+            <el-table-column
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+              label="病种名称"
+              align="center"
+              prop="diseaseTypeName"
+            />
+            <el-table-column
+              label="操作"
+              align="center"
+              class-name="small-padding fixed-width"
+            >
               <template slot-scope="scope">
-                <el-button size="mini" type="text" @click="handleselect(scope.row)"
+                <el-button
-                  v-if="handleselectId != scope.row.id">选择</el-button>
+                  size="mini"
-                <el-button size="mini" type="text" @click="nohandleselect(scope.row)"
+                  type="text"
-                  v-if="handleselectId == scope.row.id">取消选择</el-button>
+                  @click="handleselectdetal(scope.row)"
+                  >详情</el-button
+                >
+                <el-button
+                  size="mini"
+                  type="text"
+                  @click="handleselect(scope.row)"
+                  v-if="handleselectId != scope.row.id"
+                  >选择</el-button
+                >
+
+                <el-button
+                  size="mini"
+                  type="text"
+                  @click="nohandleselect(scope.row)"
+                  v-if="handleselectId == scope.row.id"
+                  >取消选择</el-button
+                >
               </template>
             </el-table-column>
           </el-table>
-          <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
+          <pagination
-            :limit.sync="queryParams.pageSize" @pagination="getList" />
+            v-show="total > 0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+          />
         </el-col>
       </el-row>
     </el-dialog>
+    <!-- 画像编辑右侧 -->
+    <el-dialog
+      title="详情"
+      :visible.sync="routeOpen"
+      width="70%"
+      :before-close="routeOpenfalse"
+    >
+      <div class="cardright">
+        <div class="topbtns">
+          <div
+            class="topbutton"
+            :class="tab == 1 ? 'blue' : ''"
+            @click="tab = 1"
+          >
+            <img
+              src="../../../assets/pathReview/blackxinxi.png"
+              alt=""
+              v-if="tab != 1"
+            />
+            <img src="../../../assets/pathReview/bluexinxi.png" alt="" v-else />
+            <span>路径信息</span>
+          </div>
+          <div
+            class="topbutton"
+            :class="tab == 2 ? 'blue' : ''"
+            @click="getlists"
+            :style="tab == 2 ? 'min-width:150px' : ''"
+          >
+            <img
+              src="../../../assets/pathReview/blackrenwu.png"
+              alt=""
+              v-if="tab != 2"
+            />
+            <img src="../../../assets/pathReview/bluerenwu.png" alt="" v-else />
+            <span>路径任务</span>
+            <!-- <el-switch v-if="tab == 2" v-model="switchvalue" active-color="#1890ff" inactive-color="#DDE0E9"
+                            @change="changeswitch">
+                        </el-switch> -->
+          </div>
+        </div>
+        <div v-if="tab == 1">
+          <div class="nodetitle">
+            <div>主路径:{{ informationlist.routeName }}</div>
+            <div>病种:{{ informationlist.diseaseTypeName }}</div>
+          </div>
+          <el-collapse v-model="activeNames">
+            <el-collapse-item title="主路径" name="1">
+              <el-table :data="informationlist.nodeList" style="width: 100%">
+                <el-table-column prop="" label="" width="160">
+                  <template slot-scope="scope">
+                    <div class="zlj" style="font-weight: bold">
+                      {{ scope.row.routeNodeNameCN
+                      }}{{ scope.row.routeNodeDay }}天
+                    </div>
+                    <div class="zlj">
+                      {{ scope.row.executeTime }} {{ scope.row.executionTime }}
+                    </div>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="" label="">
+                  <template slot-scope="scope">
+                    <div
+                      class="zljcard"
+                      v-for="(item, index) in scope.row.taskPartitionDictNames"
+                      :key="index"
+                    >
+                      {{ item }}
+                    </div>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-collapse-item>
+          </el-collapse>
+          <el-collapse v-model="activeNames">
+            <el-collapse-item title="子路径" name="2">
+              <div
+                v-for="item in informationlist.childRouteList"
+                :key="item.id"
+              >
+                <div class="zljtitle">
+                  {{ item.routeName }}
+                  <span v-if="!item.conditionSatisfyStatus" style="color: red"
+                    >(不符合条件)</span
+                  >
+                </div>
+                <el-table :data="item.nodeList" style="width: 100%">
+                  <el-table-column prop="" label="" width="160">
+                    <template slot-scope="scope">
+                      <div class="zlj" style="font-weight: bold">
+                        {{ scope.row.routeNodeNameCN
+                        }}{{ scope.row.routeNodeDay }}天
+                      </div>
+                      <!-- <div class="zlj">
+                                                {{ scope.row.executeTime }} {{ scope.row.executionTime }}
+                                            </div> -->
+                    </template>
+                  </el-table-column>
+                  <el-table-column prop="" label="">
+                    <template slot-scope="scope">
+                      <div
+                        class="zljcard"
+                        style="border-left: 9px solid #8f68fe"
+                        v-for="(item, index) in scope.row
+                          .taskPartitionDictNames"
+                        :key="index"
+                      >
+                        {{ item }}
+                      </div>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
+        </div>
+        <div v-if="tab == 2" class="tabtwo">
+          <div
+            v-for="item in routelist"
+            :key="item.id"
+            style="margin: 0 auto 30px"
+          >
+            <div class="tabtexts">
+              <div class="tabtitle">
+                {{ item.taskTypeName }}-{{ item.taskPartitionDictName }}
+              </div>
+              <div class="tabtext" style="height: 50px; line-height: 30px">
+                <div class="lefttext">开始节点:</div>
+                <div class="lefttext" style="width: 22%">
+                  {{ item.routeNodeNameCN }}
+                  {{ item.routeNodeDay }}
+                  天
+                </div>
+                <div class="lefttext">执行时间:</div>
+                <div class="lefttext" style="width: 17%">
+                  {{ item.executeTime }}
+                </div>
+                <div class="lefttext">推送方式:</div>
+                <div class="lefttext" style="width: 25%">
+                  <span v-if="item.messagePushSign == 1"> 短信 </span>
+                  <span v-if="item.officialPushSign == 1"> 公众号 </span>
+                  <span v-if="item.appletPushSign == 1"> 小程序 </span>
+                </div>
+              </div>
+            </div>
+            <div class="tabtexts">
+              <div class="tabtext" v-if="item.messagePushSign == 1">
+                <div class="lefttext">短信模板</div>
+                <div class="righttextarea">
+                  {{ item.messageNodeContent }}
+                </div>
+              </div>
+              <div class="tabtext" v-if="item.officialPushSign == 1">
+                <div class="lefttext">公众号模板</div>
+                <div class="righttextarea">
+                  {{ item.officialNodeContent }}
+                </div>
+              </div>
+              <div class="tabtext" v-if="item.appletPushSign == 1">
+                <div class="lefttext">小程序模板</div>
+                <div class="righttextarea">
+                  {{ item.appletNodeContent }}
+                </div>
+              </div>
+              <div class="tabtext" v-if="item.taskNodeType == 'PHONE_OUTBOUND'">
+                <div class="lefttext">话术</div>
+                <div class="righttext">
+                  <!-- <Scriptpreview></Scriptpreview> -->
+                  <el-button
+                    type="primary"
+                    size="small"
+                    @click="scriptlook(item)"
+                    >预览</el-button
+                  >
+                </div>
+              </div>
+              <div
+                class="tabtext"
+                v-else-if="item.taskNodeType == 'PROPAGANDA_ARTICLE'"
+              >
+                <div class="lefttext">宣教</div>
+                <div class="righttextarea">
+                  <span
+                    v-if="item.templateDetail"
+                    v-html="item.templateDetail.propagandaContent"
+                  >
+                  </span>
+                  <!-- <editor v-model="item.templateDetail" :min-height="192" style="width: 100%" /> -->
+                </div>
+              </div>
+              <div
+                class="tabtext"
+                v-else-if="item.taskNodeType == 'QUESTIONNAIRE_SCALE'"
+              >
+                <div class="lefttext">问卷</div>
+                <div class="righttextarea">
+                  <questionopennew
+                    :lookitemnew="item.templateDetail"
+                  ></questionopennew>
+                </div>
+              </div>
+              <div
+                class="tabtext"
+                v-else-if="item.taskNodeType == 'TEXT_REMIND'"
+              >
+                <div class="lefttext">文字提醒</div>
+                <div class="righttextarea" v-html="item.nodeContent"></div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -63,17 +369,33 @@ import {
   listSpecialDiseaseRoute,
   selectDiseaseCount,
 } from "@/api/system/specialDiseaseRoute";
-import DepartmentList from '../../components/DepartmentList.vue'
+import DepartmentList from "../../components/DepartmentList.vue";
+import questionopennew from "./questionopennew.vue";
+import Scriptpreview from "./Scriptpreviewopen.vue";
+import { getRouteNodeInfos, getRouteInfo } from "@/api/manage/Auditing.js";
 export default {
   components: {
-    DepartmentList
+    DepartmentList,
+    questionopennew,
+    Scriptpreview,
   },
-  props: ['routeId', 'routeName', 'servicePackageId'],
+  props: ["routeId", "routeName", "servicePackageId"],
   name: "SpecialDiseaseRoute",
   data() {
     return {
       // 遮罩层
+      // informationlist:[],
+      baseUrl: process.env.VUE_APP_BASE_API,
+      tab: 1,
+      activeNames: ["1", "2"],
+      informationlist: {
+        routeName: "",
+        diseaseTypeName: "",
+        nodeList: [],
+        childRouteList: [],
+      },
       loading: true,
+      routeOpen: false,
       // 选中数组
       ids: [],
       // 非单个禁用
@@ -102,7 +424,7 @@ export default {
         routeCode: null,
         version: null,
         routeClassify: null,
-        releaseStatus: 'PUBLISHED',
+        releaseStatus: "PUBLISHED",
         suitRange: null,
         routeSort: null,
         routeRemark: null,
@@ -110,17 +432,26 @@ export default {
       },
       // 表单校验
       rules: {},
-      handleselectName: '',
+      handleselectName: "",
-      handleselectId: '',
+      handleselectId: "",
+      routelist: [],
+      allroutelist: [],
+      id:'',
+      phoneNodeContent: {
+        scriptInfoId: null,
+        flowScheme: null,
+        nodes: [],
+        edges: [],
+      },
     };
   },
   created() {
-    this.queryParams.servicePackageId = this.servicePackageId
+    this.queryParams.servicePackageId = this.servicePackageId;
-    // this.getList();
+    // this.info();
   },
   mounted() {
-    this.handleselectId = this.routeId
+    this.handleselectId = this.routeId;
-    this.handleselectName = this.routeName
+    this.handleselectName = this.routeName;
   },
   watch: {
     routeId(newValue, oldValue) {
@@ -134,36 +465,114 @@ export default {
     },
     routeName(newValue, oldValue) {
       this.handleselectName = newValue;
-    }
+    },
   },
   methods: {
+    // changeswitch(e) {
+    //   if (e) {
+    //     this.routelist = this.allroutelist.filter(
+    //       (item) => item.conditionSatisfyStatus
+    //     );
+    //   } else {
+    //     this.routelist = this.allroutelist;
+    //   }
+    // },
+    // 专病路径详情
+    handleselectdetal(row) {},
+    getlists() {
+      console.log(this.id,'idddddd')
+      if (this.routelist.length == 0) {
+        // const loading = this.$loading({
+        //   lock: true,
+        //   text: "加载中",
+        //   spinner: "el-icon-loading",
+        //   background: "rgba(255, 255, 255, 0.7)",
+        // });
+        getRouteNodeInfos(this.id)
+          .then((res) => {
+            this.allroutelist = res.data;
+            this.routelist = res.data;
+            this.tab = 2;
+            loading.close();
+          })
+          .catch((err) => {
+            // loading.close();
+          });
+      } else {
+        this.tab = 2;
+      }
+    },
+    handleselectdetal(row) {
+      this.routeOpen = true;
+
+      this.tab = 1;
+      // const loading = this.$loading({
+      //     lock: true,
+      //     text: '加载中',
+      //     spinner: 'el-icon-loading',
+      //     background: 'rgba(255, 255, 255, 0.7)'
+      // });
+      // getPortaitInfo(this.$route.query.patientId).then(res => {
+      //     res.data.birthDate ? res.data.age = getAge(res.data.birthDate) : ''
+      //     this.list = res.data
+      // })
+      console.log(row, "row");
+      this.id=row.id
+      getRouteInfo(this.id)
+        .then((res) => {
+          this.$emit("on-routeCheckStatus", {
+            routeCheckStatus: res.data.routeCheckStatus,
+          });
+          res.data.nodeList?.forEach((e) => {
+            e.taskPartitionDictNames = e.taskPartitionDictNames.split(",");
+          });
+          res.data.childRouteList?.forEach((e) => {
+            e.nodeList.forEach((el) => {
+              el.taskPartitionDictNames = el.taskPartitionDictNames.split(",");
+            });
+          });
+          this.informationlist = res.data;
+          loading.close();
+        })
+        .catch(() => {
+          // loading.close();
+        });
+    },
+    // 关闭详情
+    routeOpenfalse() {
+      this.routeOpen = false;
+    },
     //接收科室列表传值
     clickdepartment(item) {
-      this.queryParams.hospitalAgencyId = item.hospitalAgencyId
+      this.queryParams.hospitalAgencyId = item.hospitalAgencyId;
-      this.queryParams.hospitalAgencyName = item.hospitalAgencyName
+      this.queryParams.hospitalAgencyName = item.hospitalAgencyName;
-      this.queryParams.departmentId = item.itemid
+      this.queryParams.departmentId = item.itemid;
-      this.queryParams.departmentName = item.itemName
+      this.queryParams.departmentName = item.itemName;
       if (item.hospitalAgencyId) {
         this.handleQuery();
       }
-      this.$forceUpdate()
+      this.$forceUpdate();
     },
     nohandleselect() {
-      this.handleselectId = ''
+      this.handleselectId = "";
-      this.handleselectName = ''
+      this.handleselectName = "";
-      this.$emit("on-template", { routeId: '', routeName: '' });
+      this.$emit("on-template", { routeId: "", routeName: "" });
     },
+
     handleselect(item) {
-      this.handleselectId = item.id
+      this.handleselectId = item.id;
-      this.handleselectName = item.routeName
+      this.handleselectName = item.routeName;
-      this.$emit("on-template", { routeId: item.id, routeName: item.routeName });
+      this.$emit("on-template", {
-      this.classificationOpen = false
+        routeId: item.id,
+        routeName: item.routeName,
+      });
+      this.classificationOpen = false;
     },
     /** 查询专病路径信息列表 */
     getList() {
       this.loading = true;
-      this.queryParams.releaseStatus = 'PUBLISHED'
+      this.queryParams.releaseStatus = "PUBLISHED";
-      listSpecialDiseaseRoute(this.queryParams).then(response => {
+      listSpecialDiseaseRoute(this.queryParams).then((response) => {
         this.specialDiseaseRouteList = response.rows;
         this.total = response.total;
         this.loading = false;
@@ -180,23 +589,310 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs.DepartmentList.resetQuery()
+      this.$refs.DepartmentList.resetQuery();
       this.resetForm("queryForm");
       // this.handleQuery();
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.id)
+      this.ids = selection.map((item) => item.id);
-      this.single = selection.length !== 1
+      this.single = selection.length !== 1;
-      this.multiple = !selection.length
+      this.multiple = !selection.length;
     },
     classificationOpenfalse() {
-      this.classificationOpen = false
+      this.classificationOpen = false;
     },
-  }
+  },
 };
 </script>
 <style scoped lang="scss">
+.tabtwo {
+    background-color: #fff;
+    margin-top: 20px;
+    padding: 15px;
+}
+
+.zljtitle {
+    font-size: 14px;
+    height: 50px;
+    padding-left: 2px;
+    line-height: 50px;
+    border-bottom: 1px solid #e6ebf5;
+}
+
+.zljcard {
+    display: inline-block;
+    height: 38px;
+    min-width: 100px;
+    line-height: 38px;
+    border-radius: 6px;
+    border: 1px solid #D3D3D3;
+    text-align: center;
+    box-shadow: 0 2px 4px 0 #D3D3D3;
+    margin-right: 10px;
+    padding: 0 15px;
+    border-left: 9px solid #1890ff;
+}
+.zlj {
+    text-align: center;
+}
+
+::v-deep .has-gutter {
+    display: none !important;
+}
+
+::v-deep .el-collapse {
+    width: 100%;
+    background-color: #fff;
+    padding: 0 10px;
+    margin-top: 12px;
+    border-radius: 6px;
+}
+
+.reference {
+    display: flex !important;
+    align-items: center !important;
+    padding: 0 20px !important;
+
+    img {
+        width: 24px;
+        height: 24px;
+    }
+
+    span {
+        height: 20px;
+        line-height: 20px;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        -o-text-overflow: ellipsis;
+        padding-left: 10px;
+    }
+}
+
+.texts {
+    margin: 0 0 20px;
+    flex-wrap: wrap;
+    width: 100%;
+    display: flex;
+    font-size: 14px;
+    justify-content: space-between;
+
+    .text {
+        padding: 5px 0;
+        box-shadow: 0 2px 4px 0 #D3D3D3;
+        margin-bottom: 15px;
+        width: 46%;
+        overflow: hidden;
+        white-space: nowrap;
+        border-radius: 5px;
+        text-overflow: ellipsis;
+        -o-text-overflow: ellipsis;
+    }
+}
+
+.card {
+    width: 100%;
+    display: flex;
+    justify-content: space-evenly;
+    // padding: 20px 0;
+    height: calc(100vh - 159px);
+
+    .cardleft {
+        width: 35%;
+        background-color: #fff;
+        overflow: auto;
+        padding: 20px;
+
+        .title {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+
+            .source {
+                display: flex;
+
+                .situation {
+                    background-color: #f1faf7;
+                    padding: 3px 6px;
+                    color: #83cac0 !important;
+                    border: 1px solid #83cac0 !important;
+                }
+
+                .item {
+                    font-size: 14px;
+                    margin-left: 5px;
+                    border: 1px solid #fff;
+                    padding: 3px 6px;
+                    border-radius: 5px;
+                    justify-content: center;
+                    display: flex;
+                    align-items: center;
+
+                    img {
+                        margin-right: 2px;
+                        width: 16px;
+                        height: 16px;
+                    }
+                }
+            }
+
+            .name {
+                padding: 0 6px;
+            }
+
+            .genderandage {
+                padding: 0 6px;
+            }
+
+            .headsculpture {
+                width: 35px;
+                height: 35px;
+            }
+        }
+    }
+
+    .cardright {
+        overflow: auto;
+        background-color: rgb(241, 243, 245);
+        width: 62%;
+        // height: 700px;
+        padding: 10px 0;
+        font-size: 14px;
+
+        .nodetitle {
+            border-radius: 6px;
+            padding: 0 10px;
+            height: 50px;
+            font-size: 16px;
+            font-weight: bold;
+            width: 100%;
+            background-color: #fff;
+            margin: 12px 0;
+            display: flex;
+
+            div {
+                height: 100%;
+                line-height: 50px;
+                width: 50%;
+            }
+        }
+
+        .topbtns {
+            width: 100%;
+            display: flex;
+
+            .topbutton {
+                background-color: #DDE0E9;
+                min-width: 100px;
+                height: 34px;
+                display: flex;
+                align-items: center;
+                justify-content: space-evenly;
+                border-radius: 6px;
+                margin-right: 20px;
+
+                img {
+                    width: 18px;
+                    height: 18px;
+                }
+            }
+
+            .blue {
+                color: #1890ff;
+                box-shadow: 0 2px 4px 0 #D3D3D3;
+                background-color: #fff;
+            }
+        }
+    }
+}
+.tabtexts {
+    .tabtitle {
+        font-size: 16px;
+        font-weight: bold;
+        padding-bottom: 10px;
+    }
+
+    .tabtext {
+        font-size: 14px;
+        font-weight: 400;
+        padding-bottom: 20px;
+        width: 100%;
+        display: flex;
+
+        .lefttext {
+            width: 12%;
+        }
+
+        .righttext {
+            width: 88%;
+            height: 100%;
+        }
+
+        .righttextarea {
+            word-break: break-all;
+            word-wrap: break-word;
+            min-height: 80px;
+            padding: 10px;
+            width: 90%;
+            height: 100%;
+            border: 1.5px solid #C7C7C7;
+            border-radius: 5px;
+        }
+    }
+}
+.cardright {
+  overflow: auto;
+  background-color: rgb(241, 243, 245);
+  width: 100%;
+  padding: 10px 0;
+  font-size: 14px;
+
+  .nodetitle {
+    border-radius: 6px;
+    padding: 0 10px;
+    height: 50px;
+    font-size: 16px;
+    font-weight: bold;
+    width: 100%;
+    background-color: #fff;
+    margin: 12px 0;
+    display: flex;
+
+    div {
+      height: 100%;
+      line-height: 50px;
+      width: 50%;
+    }
+  }
+
+  .topbtns {
+    width: 100%;
+    display: flex;
+
+    .topbutton {
+      background-color: #dde0e9;
+      min-width: 100px;
+      height: 34px;
+      display: flex;
+      align-items: center;
+      justify-content: space-evenly;
+      border-radius: 6px;
+      margin-right: 20px;
+
+      img {
+        width: 18px;
+        height: 18px;
+      }
+    }
+
+    .blue {
+      color: #1890ff;
+      box-shadow: 0 2px 4px 0 #d3d3d3;
+      background-color: #fff;
+    }
+  }
+}
 .left {
   height: 500px;
   overflow: auto;

src/views/manage/newSigning/index.vue

@@ -100,9 +100,9 @@
               overflow: hidden;
             "
             :style="
-              form.servicePackageName == '请选择服务包' ? 'color: #c0c4cc;' : ''
+              signPackage.servicePackageName == '请选择服务包' ? 'color: #c0c4cc;' : ''
             "
-            >{{ form.servicePackageName }}</el-button
+            >{{ signPackage.servicePackageName }}</el-button
           >
         </el-form-item>
 
@@ -204,7 +204,7 @@
         <el-form-item label="专病管理路径" prop="routeId">
           <specialDiseaseRoute
             @on-template="ontemplate"
-            v-if="form.servicePackageId"
+            v-if="signPackage.servicePackageId"
             :servicePackageId="signPackage.servicePackageId"
             :routeName="route.routeName"
             :routeId="route.routeId"
@@ -430,6 +430,12 @@
                   @click="detail(scope.row)"
                   >详情</el-button
                 >
+                <el-button size="mini" type="text" @click="handleselect(scope.row)"
+                  v-if="signPackage.servicePackageId != scope.row.id">选择</el-button>
+                  <!-- {{ signPackage.servicePackageId }}
+                  {{ scope.row.id }} -->
+                <el-button size="mini" type="text" @click="nohandleselect(scope.row)"
+                  v-if="signPackage.servicePackageId == scope.row.id">取消选择</el-button>
                 <!-- <el-button
                   size="mini"
                   type="text"
@@ -535,6 +541,8 @@ export default {
   data() {
     return {
       formdetail: {},
+      handleselectId:'',
+      handleselectName:'',
       detailshow:false,
       queryParams: {
         pageNum: 1,
@@ -629,7 +637,64 @@ export default {
     this.getList();
     this.usergetListinfo();
   },
+//   mounted() {
+//     this.handleselectId = this.routeId
+//     this.handleselectName = this.routeName
+//   },
+//   watch: {
+//     routeId(newValue, oldValue) {
+//       this.handleselectId = newValue;
+//     },
+//     // servicePackageId(newValue, oldValue) {
+//     //   if (newValue) {
+//     //     this.queryParams.servicePackageId = newValue;
+//     //     this.getList();
+//     //   }
+//     // },
+//     routeName(newValue, oldValue) {
+//       this.handleselectName = newValue;
+//     }
+//   },
   methods: {
+    handleselect(row) {
+        console.log(row,'item11')
+        this.signPackage.servicePackageId = row.id;
+      this.signPackage.servicePackageName = row.packageName;
+      let item = this.servicepackageList.find((e) => e.id == row.id);
+      console.log(item,'item')
+      this.signPackage = { ...this.signPackage, ...item };
+      let datetime = new Date();
+      let year = datetime.getFullYear();
+      let month = datetime.getMonth() + 1;
+      let day = datetime.getDate();
+      month >= 1 && month <= 9 ? (month = "0" + month) : "";
+      day >= 0 && day <= 9 ? (day = "0" + day) : "";
+      this.signPackage.serviceStartTime = `${year}-${month}-${day}`;
+      this.signPackage.serviceEndTime = obtainendtime(
+        this.signPackage.serviceStartTime,
+        item
+      );
+      console.log(this.signPackage.servicePackageName,'this.signPackage.servicePackageName')
+
+    //   this.handleselectId = row.id
+    //   this.handleselectName = row.packageName
+    //   this.$emit("on-template", { routeId: item.id, routeName: item.routeName });
+      this.innerVisibleshow = false
+    },
+    nohandleselect() {
+        this.signPackage.servicePackageId = ''
+        this.signPackage.servicePackageName = ''
+        // this.$set(  this.form,'servicePackageName','')
+        // this.$set(  this.form,'servicePackageId','')
+
+        console.log(this.signPackage.servicePackageName,'this.signPackage.servicePackageName')
+        this.innerVisibleshow = false
+
+        this.signPackage.packageTerm=''
+        this.signPackage.serviceStartTime=''
+        this.signPackage.serviceEndTime=''
+    //   this.$emit("on-template", { routeId: '', routeName: '' });
+    },
      // 详情关闭
      handleClose() {
       this.detailshow = false
@@ -662,6 +727,9 @@ export default {
     },
        // 科室名称圆点按钮
        nurseclick(row) {
+        this.signPackage.servicePackageId = row.id;
+      this.signPackage.servicePackageName = row.packageName;
+      this.servicePackageName = row.packageName;
            this.route.routeId = "";
       this.route.routeName = "";
       let item = this.servicepackageList.find((e) => e.id == row.id);
@@ -678,9 +746,7 @@ export default {
         this.signPackage.serviceStartTime,
         item
       );
-      this.form.servicePackageId = row.id;
+      
-      this.form.servicePackageName = row.packageName;
-      this.servicePackageName = row.packageName;
      
       this.innerVisibleshow = false;
     },
@@ -774,6 +840,8 @@ this.getList()
         }
         this.form.signPackage = this.signPackage;
         this.form.route = this.route;
+        console.log( this.form,' this.form')
+        return
         addsign(this.form).then((res) => {
           this.$confirm("签约成功, 是否返回上一页?", "提示", {
             confirmButtonText: "确定",