组件修改

src/views/assembly/index.vue

@@ -5,7 +5,10 @@
         <p>组件目录</p>
       </div>
       <div class="ztree-container">
-        <p v-for="(i, k) in menu" :key="k" @click="scrollToSection(k)">{{ k }}({{ i.length }})</p>
+        <p v-for="(i, k, index) in menu" :key="index" @click="scrollToSection(k, index)"
+          :class="[`${action == index ? 'action' : ''}`]">{{ k
+          }}({{
+  i.length }})</p>
       </div>
     </div>
     <div class="datacenter-right">
@@ -30,6 +33,7 @@ export default defineComponent({
   setup() {
     var menu = ref({});
     var assemblylist = ref([]);
+    const action = ref(0)
     onMounted(() => {
       list().then(res => {
         if (res && res.length) {
@@ -39,17 +43,20 @@ export default defineComponent({
             if (i.source) menu.value[i.source].push(i), list.push(i);
           })
           // eventBus.emit('assemblylist', list)
+          console.log(menu.value)
           eventBus.emit('assemblylist', menu.value)
         }
       })
     })
 
-    function scrollToSection(id) {
+    function scrollToSection(id, index) {
+      action.value = index;
       var dom = document.getElementById(id);
       if (dom) dom.scrollIntoView({ behavior: 'smooth' });
     }
 
     return {
+      action,
       scrollToSection,
       menu,
       assemblylist,
@@ -59,6 +66,11 @@ export default defineComponent({
 });
 </script>
 <style lang="less" scoped>
+.ztree-container p.action {
+  background: #0671DD;
+  color: #fff;
+}
+
 .account-center-bottom {
   background: #fff;
   height: calc(100vh - 110px);

src/views/assembly/item/AssemblyData.vue

@@ -21,7 +21,7 @@
           <div v-for="(i, n) in j" :key="n" class="item">
             <div><img :src="i.url" srcset=""></div>
             <b>{{ i.servicename }}</b>
-            <p>
+            <p class="bottomBut">
               <span><a :href="[`../../mapview.html?onlineIde_${i.servicealiasname}`]" target="_blank"
                   rel="noopener noreferrer">浏览</a></span>
               <span>详情</span>
@@ -72,7 +72,7 @@ export default defineComponent({
         i[j].map(async (k) => k.url = await getImg(k.mapingurl))
       }
       list.value = i
-      setTimeout(() => list.value = i, 3000)
+      setTimeout(() => list.value = i, 5000)
     })
 
     function handleQuery(record: Recordable) {
@@ -104,6 +104,20 @@ export default defineComponent({
 </script>
 
 <style scoped>
+.bottomBut span:first-child,
+.bottomBut span:nth-child(2) {
+  float: left;
+}
+
+.bottomBut span:nth-child(3),
+.bottomBut span:nth-child(4) {
+  float: right;
+  color: #fff;
+  background: #05B069;
+}
+.bottomBut span:nth-child(3) {
+  margin-right: 0px;
+}
 .itemName {
   font-size: 16px;
   font-weight: 500;
@@ -147,5 +161,4 @@ export default defineComponent({
 .item img {
   width: 354px;
   height: 190px;
-}
-</style>
+}</style>