修改图文展示

src/components/common/diagnoseAdvice.vue

 <template>
   <div class="diagnoseAdvice-wrap" v-drag v-if="showAdvice">
-    <div class="header"> <span class="headernum"> 问诊单{{currentAdvice.diagnoseId}} 诊断建议</span> <el-button @click="closeadvice">退出</el-button></div>
+    <div class="header">
+      <span class="headernum">
+        问诊单{{ currentAdvice.diagnoseId }} 诊断建议</span
+      >
+      <el-button @click="closeadvice">退出</el-button>
+    </div>
     <div class="center" v-stopdrag>
-     <span>诊断建议</span> <el-input rows="10" type="textarea" v-model="diagnoseAdvice" placeholder="请输入内容"></el-input>
+      <span>诊断建议</span>
+      <el-input
+        rows="10"
+        type="textarea"
+        v-model="diagnoseAdvice"
+        placeholder="请输入内容"
+      ></el-input>
     </div>
     <div class="record">
       <span>录音/录像：</span>
-      <div v-if="currentAdvice.adviceAudioUrls!=undefined &&currentAdvice.adviceAudioUrls.length > 0">
-        <div v-for="itemAudio in currentAdvice.adviceAudioUrls" :key="itemAudio.diagnoseId">
-          <el-link :href="itemAudio" target="_blank">{{itemAudio}}</el-link>
+      <div
+        v-if="
+          currentAdvice.adviceAudioUrls != undefined &&
+          currentAdvice.adviceAudioUrls.length > 0
+        "
+      >
+        <div
+          v-for="itemAudio in currentAdvice.adviceAudioUrls"
+          :key="itemAudio.diagnoseId"
+        >
+          <el-link :href="itemAudio" target="_blank">{{ itemAudio }}</el-link>
+        </div>
+      </div>
+      <span style="color: #0d9078" v-else>无音频</span>
     </div>
+
+    <div class="record">
+      <span>系统录音/录像：</span>
+      <div
+        v-if="
+          currentAdvice.vodList != undefined && currentAdvice.vodList.length > 0
+        "
+      >
+        <div v-for="(itemvod, index) in currentAdvice.vodList" :key="index">
+          <el-link :href="itemvod.url" target="_blank">{{
+            itemvod.name
+          }}</el-link>
         </div>
-      <span style="color:#0D9078" v-else>无音频</span>
       </div>
+      <span style="color: #0d9078" v-else>无视频</span>
+    </div>
+
     <div class="record flex">
       <span>诊断建议：</span>
       <div class="record-music">
-        <upload-music :musicList="illnessAudioUrls" ref="musicComponent"></upload-music>
+        <upload-music
+          :musicList="illnessAudioUrls"
+          ref="musicComponent"
+        ></upload-music>
       </div>
     </div>
     <div class="footer">
-       <el-button type="primary" style="height:35px" @click="SaveAdvice">提交保存</el-button>
+      <el-button type="primary" style="height: 35px" @click="SaveAdvice"
+        >提交保存</el-button
+      >
     </div>
   </div>
 </template>
 
 <script>
-import {mapState} from "vuex";
-import uploadMusic from '@/components/editor/upload-music'
+import { mapState } from "vuex";
+import uploadMusic from "@/components/editor/upload-music";
 export default {
   components: {
-    uploadMusic
+    uploadMusic,
   },
   data() {
-
-    return{
-      diagnoseAdvice: '',
-      illnessAudioUrls:[]
-    }
+    return {
+      diagnoseAdvice: "",
+      illnessAudioUrls: [],
+    };
   },
-  props:{
-    showAdvice:{
-      type:Boolean,
-      default:false
+  props: {
+    showAdvice: {
+      type: Boolean,
+      default: false,
     },
   },
   watch: {
     showAdvice(newVal, oldVal) {
-      if(newVal !== oldVal && newVal){
+      if (newVal !== oldVal && newVal) {
         const c = this.currentAdvice && this.currentAdvice.content;
-        console.log('ccc=cc=c=c=', c)
-        if(c == null){
-          this.diagnoseAdvice = '';
-        }else{
+        console.log("ccc=cc=c=c=", c);
+        if (c == null) {
+          this.diagnoseAdvice = "";
+        } else {
           this.diagnoseAdvice = c;
         }
-
-      }
       }
     },
-  created() {
-  },
-  mounted() {
-
   },
-  computed:{
+  created() {},
+  mounted() {},
+  computed: {
     ...mapState({
-      currentAdvice: 'currentAdvice',
+      currentAdvice: "currentAdvice",
     }),
   },
-  methods:{
+  methods: {
     SaveAdvice() {
-      if( String(this.diagnoseAdvice).trim() === ''){
+      if (String(this.diagnoseAdvice).trim() === "") {
         this.$message({
           message: "请填写诊断建议",
           type: "success",
         });
         return false;
       }
-      const url = this.$refs.musicComponent ? [...this.$refs.musicComponent.setNewArr()] : [];
+      const url = this.$refs.musicComponent
+        ? [...this.$refs.musicComponent.setNewArr()]
+        : [];
       let params = {
         adviceAudioUrls: this.currentAdvice.adviceAudioUrls,
         content: this.diagnoseAdvice,
-        diagnoseId: this.currentAdvice.diagnoseId,//id需要获取
-        illnessAudioUrls: url
-      }
-      this.POST('/diagnose/admin/diagnose/doctorAdvice/create',params).then(res=>{
-        if(res.code == "000000"){
+        diagnoseId: this.currentAdvice.diagnoseId, //id需要获取
+        illnessAudioUrls: url,
+      };
+      this.POST("/diagnose/admin/diagnose/doctorAdvice/create", params)
+        .then((res) => {
+          if (res.code == "000000") {
             this.$message({
               message: "保存成功",
               type: "success",
             });
-          this.closeadvice()
+            this.closeadvice();
           }
-      }).catch(err=>{
-        console.log(err);
         })
+        .catch((err) => {
+          console.log(err);
+        });
     },
     closeadvice() {
-      this.diagnoseAdvice = '';
-      this.$store.commit('updateShowAdvice', false);
-    }
+      this.diagnoseAdvice = "";
+      this.$store.commit("updateShowAdvice", false);
+    },
   },
   directives: {
     drag: {
@@ -111,38 +151,38 @@ export default {
           //算出鼠标相对元素的位置
           let disX = e.clientX - odiv.offsetLeft;
           let disY = e.clientY - odiv.offsetTop;
-                let left = '';
-                let top = '';
-                document.onmousemove = (e)=>{
+          let left = "";
+          let top = "";
+          document.onmousemove = (e) => {
             //用鼠标的位置减去鼠标相对元素的位置，得到元素的位置
             left = e.clientX - disX;
             top = e.clientY - disY;
             //绑定元素位置到positionX和positionY上面
             //移动当前元素
-                    odiv.style.left = left + 'px';
-                    odiv.style.top = top + 'px';
+            odiv.style.left = left + "px";
+            odiv.style.top = top + "px";
           };
           document.onmouseup = (e) => {
             document.onmousemove = null;
             document.onmouseup = null;
           };
         };
-        }
+      },
     },
     stopdrag: {
-          inserted:function(el, binding, vnode) {
+      inserted: function (el, binding, vnode) {
         let element = el;
-              element.onmousedown =function(e) {
-                  e.stopPropagation()
-              }
-          }
-      }
-  }
-}
+        element.onmousedown = function (e) {
+          e.stopPropagation();
+        };
+      },
+    },
+  },
+};
 </script>
 
 <style lang="scss">
-  .diagnoseAdvice-wrap{
+.diagnoseAdvice-wrap {
   position: absolute;
   top: 125px;
   right: 20px;
@@ -154,18 +194,18 @@ export default {
   box-shadow: 10px 10px 50px 0px #d9d9d9;
   overflow: hidden;
   border-radius: 18px;
-    .header{
+  .header {
     height: 60px;
     border-bottom: 1px rgb(231, 228, 228) solid;
     display: flex;
     justify-content: space-between;
     padding-left: 15px;
     margin-bottom: 30px;
-      .headernum{
+    .headernum {
       font-weight: 700;
       line-height: 60px;
     }
-      .el-button{
+    .el-button {
       width: 85px;
       height: 25px;
       margin-top: 17px;
@@ -173,43 +213,43 @@ export default {
       line-height: 0;
       border-color: #9fba81;
       color: #9fba81;
-        >span{
+      > span {
         font-weight: 700;
       }
     }
   }
-    .center{
+  .center {
     display: flex;
     margin-right: 28px;
     margin-bottom: 30px;
     height: 210px;
-      >span{
+    > span {
       display: inline-block;
       margin-top: 5px;
       width: 110px;
     }
-      .el-textarea{
+    .el-textarea {
       height: 110px;
-        .el-textarea__inner{
+      .el-textarea__inner {
         height: 110px;
       }
     }
   }
-    .record{
+  .record {
     padding-left: 28px;
     margin-top: 45px;
   }
-    .flex{
+  .flex {
     display: flex;
-      .record-music{
+    .record-music {
       flex: 1;
     }
   }
-    .footer{
+  .footer {
     bottom: 0;
     left: 0;
     text-align: center;
     margin-top: 5px;
   }
-  }
+}
 </style>

src/components/common/inquirylist.vue

@@ -34,7 +34,7 @@
               <div
                 class="offline"
                 v-if="
-                  (item.diagnoseType == 1 || item.diagnoseType == 2) &&
+                  (diagnoseTypeIcon== 'voice') &&
                   (item.returnStatus == 1 || item.returnStatus == 3) &&
                   doctorTrtcEntryStatus != 1
                 "
@@ -69,7 +69,7 @@
           <div
             class="call-status"
             v-if="
-              (item.diagnoseType == 1 || item.diagnoseType == 2) &&
+              diagnoseTypeIcon== 'voice' &&
               doctorTrtcEntryStatus != 1
             "
           >
@@ -93,10 +93,9 @@
               <div
                 class="offline"
                 v-if="
-                  (item.diagnoseType == 1 || item.diagnoseType == 2) &&
+                  diagnoseTypeIcon== 'voice' &&
                   (item.returnStatus == 1 || item.returnStatus == 3) &&
-                  userTrtcEntryStatus != 1
-                "
+                  userTrtcEntryStatus != 1"
               >
                 <img :src="offline" alt="" />
               </div>
@@ -127,10 +126,7 @@
 
           <div
             class="call-status"
-            v-if="
-              (item.diagnoseType == 1 || item.diagnoseType == 2) &&
-              userTrtcEntryStatus != 1
-            "
+            v-if="diagnoseTypeIcon== 'voice' &&userTrtcEntryStatus != 1"
           >
             <img
               v-if="isCall"