更新页面

src/views/consultation/components/content.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class="callingNotification_content">
+    <div class="left">
+      <div class="icon">
+        <img :src="currentIcon" width="32" height="32" />
+      </div>
+    </div>
+    <div class="right">
+      <div class="name">
+        {{ getName }}
+      </div>
+      <div class="fixed">
+        <div class="icon">
+          <img
+            v-if="call_mode === 0"
+            src="@/assets/images/webPuc/svgs/phone_off_small.svg"
+            width="12"
+            height="12"
+          />
+          <img
+            v-if="call_mode > 0"
+            src="@/assets/images/webPuc/svgs/video_off_small.svg"
+            width="12"
+            height="9"
+          />
+        </div>
+        <div class="text">
+          {{ calling }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+  import { computed, toRef } from 'vue';
+
+  const props = defineProps({
+    callInfo: {
+      type: Object,
+      required: true,
+    },
+    calling: {
+      type: String,
+      required: true,
+    },
+    getName: {
+      type: String,
+      required: true,
+    },
+  });
+  const callInfo = toRef(props, 'callInfo');
+  const calling = toRef(props, 'calling');
+  const getName = toRef(props, 'getName');
+
+  const {
+    attribute: { call_mode },
+  } = callInfo.value;
+
+  const currentIcon = computed(() => {
+    return require('@/assets/images/webPuc/svgs/avatar_call_online_small.svg');
+  });
+</script>
+
+<style lang="scss" scoped>
+  .callingNotification_content {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    .left {
+      margin-right: 8px;
+    }
+    .right {
+      .name {
+        margin-bottom: 5px;
+        font-size: 14px;
+      }
+      .fixed {
+        display: flex;
+        align-items: center;
+        .icon {
+          margin-right: 5px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+        .text {
+          font-size: 12px;
+          color: var(--color-text-2);
+        }
+      }
+    }
+  }
+</style>