瀏覽代碼

Merge branch 'master' of http://face3d.4dage.com:7005/chenzhiguang/guangdongVR_museum into master

shaogen1995 2 年之前
父節點
當前提交
7b094302ca
共有 3 個文件被更改,包括 65 次插入8 次删除
  1. 二進制
      code/src/assets/images/icon/down_prompt.png
  2. 32 4
      code/src/views/exhibition/mobile.vue
  3. 33 4
      code/src/views/gdmuseum/mobile.vue

二進制
code/src/assets/images/icon/down_prompt.png


+ 32 - 4
code/src/views/exhibition/mobile.vue

@@ -1,8 +1,16 @@
 <template>
   <div class="gdmuseum">
     <div class="info" v-if="currentMuseum">
-      <div>{{currentMuseum.name}}</div>
-      <p>
+      <div class="title">
+        <div>
+          {{currentMuseum.name}}
+          <img
+            :class="isShowDesc ? 'expand' : 'collapse'" src="@/assets/images/icon/down_prompt.png" alt=""
+            @click="onClickExpandBtn"
+          >
+        </div>
+      </div>
+      <p v-show="isShowDesc">
         {{currentMuseum.description || '暂无简介'}}
       </p>
     </div>
@@ -60,11 +68,17 @@ const menu = ref([
   },
 ]);
 
+const isShowDesc = ref(true)
+
 let handleTab = (data) => {
   console.log(data, "data");
   panelPage.value = data.component
 };
 
+const onClickExpandBtn = () => {
+  isShowDesc.value = !isShowDesc.value
+}
+
 let updateMuseum = (data)=>{
   console.log(data,'sdsd');
   currentMuseum.value = data
@@ -83,12 +97,26 @@ let updateMuseum = (data)=>{
     width: 90%;
     margin: 0 auto;
 
-    >div {
-      width: 100%;
+    > .title {
       font-size: 18px;
       font-weight: bold;
       color: var(--main-color);
       text-align: center;
+      position: relative;
+      text-align: center;
+      > div {
+        display: inline-block;
+        > img {
+          position: absolute;
+          right: calc(-1 * (15px + 17px));
+          top: 11px;
+          width: 17px;
+          height: 9px;
+          &.collapse {
+            transform: rotate(180deg);
+          }
+        }
+      }
     }
 
     >p {

+ 33 - 4
code/src/views/gdmuseum/mobile.vue

@@ -1,8 +1,16 @@
 <template>
   <div class="gdmuseum">
     <div class="info" v-if="currentMuseum">
-      <div>{{currentMuseum.name}}</div>
-      <p>
+      <div class="title">
+        <div>
+          {{currentMuseum.name}}
+          <img
+            :class="isShowDesc ? 'expand' : 'collapse'" src="@/assets/images/icon/down_prompt.png" alt=""
+            @click="onClickExpandBtn"
+          >
+        </div>
+      </div>
+      <p v-show="isShowDesc">
         {{currentMuseum.description || '暂无简介'}}
       </p>
     </div>
@@ -59,10 +67,17 @@ const menu = ref([
   },
 ]);
 
+const isShowDesc = ref(true)
+
 let handleTab = (data) => {
   console.log(data, "data");
   panelPage.value = data.component
 };
+
+const onClickExpandBtn = () => {
+  isShowDesc.value = !isShowDesc.value
+}
+
 onMounted(() => {
   getMuseumDetail({
     id: 1,
@@ -84,12 +99,26 @@ onMounted(() => {
     width: 90%;
     margin: 0 auto;
 
-    >div {
-      width: 100%;
+    > .title {
       font-size: 18px;
       font-weight: bold;
       color: var(--main-color);
       text-align: center;
+      position: relative;
+      text-align: center;
+      > div {
+        display: inline-block;
+        > img {
+          position: absolute;
+          right: calc(-1 * (15px + 17px));
+          top: 11px;
+          width: 17px;
+          height: 9px;
+          &.collapse {
+            transform: rotate(180deg);
+          }
+        }
+      }
     }
 
     >p {