微网站

package-lock.json

       "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA==",
       "dev": true
     },
+    "v-viewer": {
+      "version": "1.4.2",
+      "resolved": "https://registry.npmjs.org/v-viewer/-/v-viewer-1.4.2.tgz",
+      "integrity": "sha512-WEslW+dKPHg10f9jl1v0ilH0uk4ZFOz4vUp4wJjomwl+VQEnsWLjSzHCeFoayxjE9KyZspVu9lYLNxk+o3xzkw==",
+      "requires": {
+        "throttle-debounce": "^2.0.1",
+        "viewerjs": "^1.3.2"
+      },
+      "dependencies": {
+        "throttle-debounce": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-2.1.0.tgz",
+          "integrity": "sha512-AOvyNahXQuU7NN+VVvOOX+uW6FPaWdAOdRP5HfwYxAfCzXTFKRMoIMk+n+po318+ktcChx+F1Dd91G3YHeMKyg=="
+        }
+      }
+    },
     "validate-npm-package-license": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",
         "extsprintf": "^1.2.0"
       }
     },
+    "viewerjs": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/viewerjs/-/viewerjs-1.3.7.tgz",
+      "integrity": "sha512-I7iD166zrqxocoNn1c23nwERzMXXxnlJw8eWLsK28DSAhGWSue1ZPaxV2qr7LC4lbhom1OUa7Z/glWsnGaa3bw=="
+    },
     "vm-browserify": {
       "version": "0.0.4",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-0.0.4.tgz",

package.json

     "sortablejs": "1.7.0",
     "spark-md5": "^3.0.0",
     "swiper": "^4.5.1",
+    "v-viewer": "^1.4.2",
     "vue": "2.5.16",
     "vue-baidu-map": "^0.21.22",
     "vue-count-to": "1.0.13",

src/api/micro/micro.js

 import request from '@/utils/request'
 import org from '../../router/modules/org';
+import { link } from 'fs';
 
 export function getHospitaldata(orgid,params){
     return request({
        Get:"Get",
        params:params,
    })
+}
+
+export function GetRotationLinkAddress(linkid,orgid){
+    const params = {
+        linkid:linkid,
+        orgid:orgid,
+    }
+     return request({
+         url:'/api/site/getrotationlinkaddress',
+         Get:"Get",
+         params:params,
+     })
 }

src/main.js

 
 import { read } from 'fs';
 import BaiduMap from 'vue-baidu-map'
+
+import Viewer from 'v-viewer'
+import 'viewerjs/dist/viewer.css'
+ 
+//Vue.use(Viewer) 默认配置写法
+Vue.use(Viewer, {
+    defaultOptions: {
+        zIndex: 9999
+    }
+})
 Vue.use(Element, {
   size: 'medium', // set element-ui default size
   i18n: (key, value) => i18n.t(key, value)

src/router/index.js

 import system from './modules/system'
 import site from './modules/site'
 import kefu from './modules/kefu'
-
+ 
 /** note: submenu only apppear when children.length>=1
  *   detail see  https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html
  **/
   component: () => import('@/views/errorPage/401'),
   hidden: true
 },
-// {
-//   path: '',
-//   component: ()=>import('@/scrm_pages/qrcode/qrcode'),
-//   redirect: '/qrcode',
-//   children: [{
-//     path: '/qrcode',
-//     component: () => import('@/scrm_pages/qrcode/qrcode'),
-//     name: 'qrcode',
-//     meta: {
-//       title: 'qrcode',
-//       icon: 'dashboard',
-//       noCache: true
-//     }
-//   }]
-// },
 {
   path: '/qrcode',
   component: ()=>import('@/scrm_pages/micro/micro'),
-  // children: [{
-
-  //   path: '/qrcode',
-  //   component: () => import('@/scrm_pages/micro/micro'),
-  //   name: 'qrcode',
-  //   meta: {
-  //     title: 'qrcode',
-  //     icon: 'dashboard',
-  //     noCache: true
-  //   }
-  // },]
 },
 
 {
-  path: '/rotation',
-  component: () => import('@/scrm_pages/rotation/rotation'),
-  name: 'rotation',
+  path: '/hospital',
+  component: () => import('@/scrm_pages/hospital/hospital'),
+  name: 'hospital',
 
 },
-// {
-//    path:'qrcode/rotation',
-//    component:()=>import('@/scrm_pages/rotation/rotation'),
-//    redirct: '/rotation',
-//    children: [{
-//      path: '/rotation',
-//      component: () => import('@/scrm_pages/rotation/rotation'),
-//      name: 'rotation',
-//      meta: {
-//        title:'rotation',
-//        icon: 'dashboard',
-//        noCache: true
-//      }
-//    }]
-
-// },
 {
   path: '/activity/preview',
   component: () => import('@/scrm_pages/marketing_tool/activity_preview'),
   hidden: true
 }
-  // service
+
 ]
 
 var _asy_router_map = [

src/router/modules/hosiptal.js

+import Layout from '@/views/layout/Layout'
+
+export default{
+    
+}

src/scrm_pages/hospital/hospital.vue

+<template>
+  <div>
+    <el-input v-model='msg' placeholder='输入'></el-input>
+    <p>{{ msg }}</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'hospital',
+  data: function() {
+    return {
+      msg: ''
+    }
+  }
+}
+</script>

src/scrm_pages/micro/micro.vue

                  <div class="swiper-slide">      
                    <div v-for="item in this.patientModels" :key="item.id" v-show="modelshow">                    
                       <!-- 轮播图 -->
-                       <div class="modeone" v-if="item.mode_type == 1" @click="rotationlink()">
+                       <div class="modeone" v-if="item.mode_type == 1">
                           <mt-swipe :auto="2000" class="swipertwo">
                           <mt-swipe-item v-for="it in item.PatientEditpiclink" :key="it.id">
+                            <a :href="it.linkaddress.length > 0 ? it.linkaddress: 'javascript:;' " style="width:100%;height:230px">
                              <img :src="it.images" style="width:100%;height:230px">
+                             </a>
                            </mt-swipe-item>
                          </mt-swipe>  
                          <div class="box"></div>                                                           
                            <!-- <div class="more" @click="docmore(item.id,item.user_org_id)">查看更多</div> -->
                               <!-- <div class="logo"><img src="static\images\u216.png"></div> -->
                                 <div class="docborde">
-                                 <div class="docheart" v-for="doc in item.Editdoctor" :key="doc.id">
+                                 <div class="docheart" v-for="doc in item.Editdoctor" :key="doc.id"  @click="docClick(doc.id,doc.user_org_id)">
                                    <div class="docimage">
                                     <img :src="doc.dochead" style="height:80px;width:80px">
                                    </div>
                                  <div class="doctitle"><span class="docnamefont">{{doc.doc_name}}</span></div>
                                  <div class="doccontent"><span class="xxcontent" v-html="doc.docintroduction"></span></div>
                                 </div>
-                           </div>
+                            </div>
                            <div class="box"></div>
                         </div>
 
                                <div class="swiper-container swiperthree" >
                                  <div class="swiper-wrapper" id="wrappert">
                                     <div class="swiper-slide"  v-for="itms in item.Enviroimages" :key="itms.id">
+                                      <viewer>
                                       <img :src="itms.enviroimages" style="width:150px;height:140px;border-radius:5px"/>
+                                      </viewer>
                                      </div>
                                 </div>
                               </div>
                                <div class="acthead">
                                    <img :src="it.imgs" style="width:80px;height:80px">
                                </div>
-                               <div class="actcontent">
+                               <div class="actcontent"  @click="clickTitle(it.id,it.user_org_id)">
                                   <div class="actname"><span>{{it.title}}</span></div>  
                                   <!-- <div class="actcomments">阅读:{{it.real_read_num}}|评论:{{it.comment_num}}|点赞:{{it.star_num}}</div> -->
                                </div> 
                                <div class="acthead">
                                    <img :src="it.poster_photo" style="width:80px;height:80px">
                                </div>
-                               <div class="actcontent">
+                               <div class="actcontent"  @click="clickActiles(it.id,it.user_org_id)">
                                   <div class="actname"><span>{{it.title}}</span></div>  
                                   <!-- <div class="actcomments">阅读:{{it.read_num}}|评论:{{it.comment_num}}|点赞:{{it.star_num}}</div>
                                   <div class="progress">
              </div>
          </div>
      </div>
-       <div class="scroll" v-show="defalutshow">暂无数据</div>q 
+       <div class="scroll" v-show="defalutshow">暂无数据</div>
        <!-- 医院介绍详情 -->
-       <div class="scroll" v-show="hosshow" style="padding:15px 4%;" v-html="hospitalform.introduction" id="target"></div>
+       <div class="scroll" v-show="hosshow" style="padding:15px 4%;" v-html="hospitalform.introduction"></div>
        <!-- 科室介绍详情 -->
       <div class="scroll" v-show="keshow" style="padding:15px 4%;"  v-html="officeform.introduction"></div>
       <!-- 名医介绍详情 -->
-       <div class="scroll" v-show="docshow" id="targetthree">
+       <div class="scroll" v-show="docshow" id="targetthree" style="padding:15px 4%">
            <div class="docone" v-for="item in this.editdocfrom" :key="item.id" @click="singleDoctorInfo(item.id,item.user_org_id)">
              <div class="doctwo">
               <img :src="item.dochead" style="width:80px;height:80px">
               <div class="swiper-container swiperfour" >
                  <div class="swiper-wrapper" id="wrappertwo" >
                      <div class="swiper-slide "  v-for="it in keEnvironmentImages" :key="it.id">
+                        <viewer>
                         <img :src="it.enviroimages" style="width:150px;height:140px;border-radius:5px;"/>
+                        </viewer>
                      </div>
                  </div>
              </div>                          
           </div>
 
              <!-- 文章列表详情 -->
-             <div class="scroll" v-show="ArticlelistShow" id="targetfive">
+             <div class="scroll" v-show="ArticlelistShow" id="targetfive"  style="padding:15px 4%;">
                 <div class="actilist" v-for="it in Articlelist" :key="it.id" @click="singleArticleInfo(it.id,it.user_org_id)">
                     <div class="acthead">
                        <img :src="it.imgs" style="width:80px;height:80px">
               </div>
 
               <!-- 活动列表详情 -->
-                 <div class="scroll" v-show="ActivitieslistShow" id="targetsix">
+                 <div class="scroll" v-show="ActivitieslistShow" id="targetsix" style="padding:15px 4%;">
                      <div class="actilist" v-for="it in Activitieslist" :key="it.id" @click="singleActivitInfo(it.id,it.user_org_id)">
                         <div class="acthead">
                             <img :src="it.poster_photo" style="width:80px;height:80px">
                     </div>
 
                     <!-- 联系我们页面 -->
-                    <div class="scroll" v-show="contactShow">
+                    <div class="scroll" v-show="contactShow" style="padding:15px 4%;">
                           <div v-for="item in this.ordmodel" :key="item.id">
                               <div v-if="item.mode_type == 1" class="contractmodeone">
                                   <mt-swipe :auto="4000" class="swipertwo">
                                   </div>
                                   <div  v-if="item.mode_type == 3">
                                     <div class="oldmodeone" v-for="it in Connectways" :key="it.id">
-                                       <span>{{it.title}}:&nbsp;&nbsp;{{it.content}}</span><br>
-                                      </div>
+                                       <div class="oldmodefive">
+                                          <span>{{it.title}}:&nbsp;&nbsp;{{it.content}}</span>
+                                       </div>
+                                       <div class="oldmodesix" @click="tallPhone(it.content)">
+                                           <img src="static/images/u318.png" style="width 100%;height:100%">
+                                       </div>
+                                     </div>
                                    </div>
                                    <div class="oldmodefour" v-if="item.mode_type == 4">
                                      <div><span>{{item.title}}:&nbsp;&nbsp;{{item.Worktime.worktime}}</span></div>
                     </div>
 
                     <!-- 单个名医介绍 -->
-                    <div class="scroll" v-show="singleDoctorshow">
+                    <div class="scroll" v-show="singleDoctorshow" style="padding:15px 4%;">
+                       
                         <div class="doctorInfo">
-                            <div class="doctorhead">
-                               <img :src="doctors.dochead" style="width:100%;height:100%">
-                            </div>
-                            <div class="doctorname">
-                               姓名:{{doctors.doc_name}}
-                            </div>
-                            <div class="doctorposition">
-                              职位:{{doctors.doc_postion}}
-                            </div>
-                        </div>
-                        <div class="doctorintroduction">医生简介:</div>
-                        <div class="doctorintro" v-html="doctors.docintroduction">
-                          
+                              <div class="doctorhead">
+                                  <img :src="doctors.dochead" style="width:100%;height:100%">
+                              </div>
+                              <div class="doctorname">
+                                  姓名:{{doctors.doc_name}}
+                              </div>
+                              <div class="doctorposition">
+                                职位:{{doctors.doc_postion}}
+                              </div>
                         </div>
+                         <div class="doctorintroduction">医生简介:</div>
+                         <div class="doctorintro" v-html="doctors.docintroduction"></div> 
                     </div>
 
                     <!-- 单个文章列表详情 -->
-                    <div class="scroll" v-show="singleArticleshow">
-                        <div class="artictitle">
-                            {{articles.title}}
-                       </div>
-                        <div class="articcontent" v-html="articles.content">
+                    <div class="scroll" v-show="singleArticleshow" style="padding:15px 4%;">                   
+                             <div class="artictitle">
+                               {{articles.title}}
+                             </div>
+                            <div class="articcontent" v-html="articles.content">
 
-                       </div>
+                            </div>                    
                     </div>
 
                     <!-- 单个活动列表详情 -->
-                    <div class="scroll" v-show="singleActiveshow">
+                    <div class="scroll" v-show="singleActiveshow" style="padding:15px 4%;">
                          <div class="activityImages">
                             <img :src="activitys.poster_photo" style="width:100%;height:100%">
                          </div>
              <img :src="item.navimages" style="width:30px; height:30px" @click="callPhone(item.navtitle,item.navaddress)">
              <span>{{item.navtitle}}</span>
           </div>
-           <!-- <div class="buttonone">
-             <img src="static/images/u309.png" style="width:30px; height:30px">
-          </div> -->
-          <!-- <div class="buttontwo">
-            <img src="static/images/u309.png" style="width:30px; height:30px">
-          </div>
-          <div class="buttonthree">
-           <img src="static/images/phone.png" style="width:30px;height:30px">
-          </div>
-          <div class="buttonfour">
-             <img src="static/images/u311.png" style="width:30px; height:30px">
-          </div> -->
       </div>
     </div> 
 </template>
      Vue.component(Swipe.name, Swipe);
      Vue.component(SwipeItem.name, SwipeItem);
      import { getHospitaldata,getArticlelist,getActivities,hispitalmore,officemore,docmore,kemore,articlemore,Activitiesmore,getDefalutNavigationData,getOrderModel,getAllConnecWay,
-     singleActivitInfo,singleArticleInfo,singleDoctorInfo} from '@/api/micro/micro'
+     singleActivitInfo,singleArticleInfo,singleDoctorInfo,GetRotationLinkAddress} from '@/api/micro/micro'
+import { link } from 'fs';
     export default {
         name: "micro",
         data(){
         }
        })
       },
-
-      hispitalmore(id,orgid){
-        hispitalmore(id,orgid).then(response=>{
-           if(response.data.state ==1){
-              var hospital =  response.data.data.hospital;
-              console.log("hospital",hospital)
-              this.hospitalform =  response.data.data.hospital;
-              this.modelshow = false;
-              this.hosshow = true;
-              this.showindex = true;
-              this.showtop = true;     
-           }
-        })
-      }, 
+       
+       hispitalmore(){
+          alert("aaa")
+          this.$router.push({path:'/hospital'});
+       },
+      // hispitalmore(id,orgid){
+      //   hispitalmore(id,orgid).then(response=>{
+      //      if(response.data.state ==1){
+      //         var hospital =  response.data.data.hospital;
+      //         console.log("hospital",hospital)
+      //         this.hospitalform =  response.data.data.hospital;
+      //         this.modelshow = false;
+      //         this.hosshow = true;
+      //         this.showindex = true;
+      //         this.showtop = true;     
+      //      }
+      //   })
+      // }, 
     //查看科室详情
     officemore(id,orgid){
       officemore(id,orgid).then(response=>{
           this.contactShow = false;
           this.keshow = false;
           this.hosshow = false;
-          this.getHospitaldata(this.$route.query.orgid);
+          this.docshow = false;
+          this.ActivitieslistShow = false;
+          this.ArticlelistShow = false;
+          this.OfficeEnviromentShow = false;
+          this.singleDoctorshow = false;
+          this.singleArticleshow = false;
+          this.singleActiveshow = false;
+          this.showindex = false;    
+          this.showtop = false;  
         }
 
         if(title == "联系我们"){  
+            this.singleDoctorshow = false;
+            this.singleArticleshow = false;
+            this.singleActiveshow = false;
+            this.ActivitieslistShow = false;
+            this.ArticlelistShow = false;
+            this.keshow = false;
+            this.hosshow = false;
+            this.docshow = false;
             this.modelshow = false;
            this.contactShow = true;
            this.getOrderModel(orgid);
+         
         }
         if(title == "在线客服"){
            window.location.href = 'tel://'+address+'';
         
       },
 
+      clickTitle(id,orgid){
+          this.modelshow = false;
+          this.singleArticleshow = true;
+          this.showindex = true;    
+          this.showtop = true;  
+         singleArticleInfo(id,orgid).then(response=>{
+             if(response.data.state == 1){
+                   var articles =  response.data.data.articles;
+                   this.articles = articles;
+               }
+         })
+         
+      },
+
+      clickActiles(id,orgid){
+         this.modelshow = false;
+         this.singleActiveshow = true;
+         this.showindex = true;    
+         this.showtop = true;  
+        singleActivitInfo(id,orgid).then(response=>{
+           if(response.data.state ==1){
+                 var activitys = response.data.data.activity;
+                this.activitys = activitys;
+                console.log("activitys",activitys)
+            }
+        })
+      },
+
         returnIndex(){
              this.defalutshow = false;
              this.modelshow = true;
              this.singleActiveshow = false;
          },  
         returntop(){
-         this.scrollToTopTimer();    
-        },
-        scrollToTop() {
-           this.scrollTop = document.getElementById('target').scrollTop;
-           console.log("这个是什么",this.scrollToTop)
+          document.documentElement.scrollTop = 0
         },
-       backTop() {
-          this.timer = setInterval(()=>{
-          this.scrollToTopTimer()
-          },20)
-         },
-       scrollToTopTimer() {
-         let scrollTop = this.scrollTop;
-         console.log("scrollTop是什么",scrollTop)
-         if(scrollTop > 0) {
-           scrollTop -= 100
-           if(scrollTop <= 0) {
-             scrollTop = 0
-             clearInterval(this.timer)
-            }
-           }
-          document.getElementById('target').scrollTop = scrollTop;
-          console.log("娃哈哈",scrollTop)
-         },
-
+  
          getDefalutNavigationData(orgid){
            getDefalutNavigationData(orgid).then(response=>{
              if(response.data.state == 1){
             }
            },
 
+           docClick(id,orgid){
+              this.modelshow = false;
+              this.singleDoctorshow = true;
+              this.showtop = true;
+              this.showindex = true;   
+              singleDoctorInfo(id,orgid).then(response=>{
+                 if(response.data.state ==1){
+                 var editdoctor = response.data.data.editdoctor;
+                 console.log("editdoctor",editdoctor)
+                 this.doctors = editdoctor;
+                }
+              })
+           },
+
            singleDoctorInfo(id,orgid){
-             this.docshow = false;
-             this.singleDoctorshow = true;
+              this.docshow = false;
+              this.singleDoctorshow = true;
              singleDoctorInfo(id,orgid).then(response=>{
                if(response.data.state ==1){
-                 var editdoctor =   response.data.data.editdoctor;
+                 var editdoctor =  response.data.data.editdoctor;
                  this.doctors = editdoctor;
                  console.log("editdoctor",editdoctor)
                }
              })
            },
 
-           rotationlink(){
-             this.$router.push({path:'/#/rotation'})
+           rotationlink(linkid,orgid){
+              GetRotationLinkAddress(linkid,orgid).then(response=>{
+                  if(response.data.state == 1){
+                     var linkaddress =  response.data.data.linkaddress;
+                     console.log("linkaddres是什么",linkaddress)
+                     window.location.href = linkaddress.defineaddress;
+                  }
+              })
+           },
+           tallPhone(content){
+               window.location.href = 'tel://'+content+'';
            }
         },
-      destroyed(){
-        clearInterval(this.timer)
-        document.getElementById('target').removeEventListener('scroll', this.scrollToTop);
-      }, 
        created(){
            const orgid = this.$route.query.orgid;
            console.log("机构id是",orgid)
              clickable: true,
             },
         });
-
-
-        // document.getElementById('target').addEventListener('scroll', this.scrollToTop)
        },
     }
 </script>
 
 <style scoped>
+
+    .swiper-slide{
+      margin-bottom: 60px;
+     }
     .scroll{
         width: 100%;
         height: 100%;
 
     .oldmodeone{
         width: 318px;
-        height: 100%;
+        min-height: 22px;
         /* border: solid 1px red; */
-        margin-bottom: 8px;
+        margin-bottom: 8px;       
+    }
+
+    .oldmodesix{
+       position: absolute;
+       width: 50px;
+       min-height: 20px;
+       /* border: solid 1px blue; */
+       margin-left: 200px;
+       margin-top: -20px;
+    }
+
+    .oldmodefive{
+      width: 250px;
+      min-height: 20px;
+      /* border: solid 1px red; */
     }
 
   .oldmodefour{
   }
 
   .artictitle{
-    width: 100%;
+    /* position: absolute; */
+    min-width: 300px;
     min-height: 20px;
     /* border:solid 1px red; */
     text-align: center;
   }
   
    .articcontent{
+     /* position: relative; */
      width: 100%;
-     height: 100%;
+     min-height: 200px;
      /* border:solid 1px red; */
    }
    
   
    .doctorname{
      position: absolute;
-     width: 100%;
+     min-width: 100px;
      height: 20px;
      /* border: solid 1px red; */
      margin-left: 100px;
    }
    .doctorposition{
      position: absolute;
-     width: 100%;
+     min-width: 100px;
      height: 20px;
      /* border: solid 1px red; */
      margin-left: 100px;
 
    .doctorintroduction{
      /* position: absolute; */
-     width: 100%;
-     height: 20px;
+     min-width: 100px;
+     min-height: 20px;
      margin-left: 10px;
      /* border:solid 1px red; */
      font-size: 14px;
    }
    .doctorintro{
-     position: absolute;
+     /* position: absolute; */
      width: 100%;
-     height: 100%;
+     min-height: 200px;
      /* border:solid 1px red; */
      font-size: 14px;
-     margin-left: 10px;
+     /* margin-left: 10px; */
    }
 </style>

src/scrm_pages/rotation/rotation.vue

-<template>
-
-</template>
-
-<script>
-    export default {
-        name: "rotation"
-    }
-</script>
-
-<style scoped>
-
-</style>