cyy-vue-material 7.0.19 → 7.0.21

package/src/package/cyy-ArsenalMyNavigation/cyy-ArsenalMyNavigation.vue

@@ -1,125 +1,128 @@
-<template>
-  <div>
-
-    <div v-if="props" class="nav_container" :style="{ marginTop: (props.marginTop - 42) + 'px', marginBottom: (props.marginBottom + 10) + 'px', borderRadius: props.componentCorner + 'px' }">
-     <div class="order_top" @click="jump(props.navList[0].link)" v-if="props.tab == 0">
-        <div class="order_title" :style="{ color: props.titleColor }">{{ props.navTitle }}</div>
-        <div class="more_title" v-if="props.seeAll == 0 && props.navList.length > 0">
-          <span :style="{ color: props.tabColor }">{{ props.navList[0].name }}</span>
-          <img :src="props.navList[0].imgUrl" style="width: 12px; height: 12px" />
-        </div>
-      </div>
-    <div class="assets_list" :style="{ backgroundColor: props.backgroundColor }">
-      <div class="assets_item" :class="[props.navigationNum === 5 ? 'navigationNum5' : 'navigationNum4']" v-for="(item, index) in props.selectImg" :key="index" @click="jump(item.link)" >
-        <img v-if="item && item.imgUrl"  :src="item.imgUrl" :style="{ width:  props.photoSize == 0 ? '24px' : '36px', height: props.photoSize == 0 ? '24px' : '36px', borderRadius: props.photoCorner + 'px' }" />
-        <img v-else  src="http://123.com/image/name.png" :style="{ width:  props.photoSize == 0 ? '24px' : '36px', height: props.photoSize == 0 ? '24px' : '36px', borderRadius: props.photoCorner + 'px' }" />
-        <div v-if="item && item.name" class="item_name" :style="{ color: props.fontColor }">{{ item.name }}</div>
-      </div>
-      
-    </div>
-    </div>
-    
-  </div>
-</template>
-
-<script>
-export default {
-  name: "cyy-ArsenalMyNavigation",
-  data() {
-    return {
-    };
-  },
-  props: {
-    props: {
-      // showStyle: Number, //展示风格
-      componentCorner: Number, //组件边角
-      tab: Number, //导航标题
-      navTitle: String, //标题
-      titleColor: String, //主标题颜色
-      tabColor: String, //查看全部颜色
-      seeAll: Number, // 全部
-      photoSize: Number, //图片尺寸
-      photoCorner: Number, //图片边角
-      fontColor: String, //文字颜色
-      backgroundColor: String, //背景颜色
-      marginTop: Number, //上边距
-      marginBottom: Number, //下边距
-      selectImg: Array, //添加图片
-      navigationNum: Number, //导航数量
-      navList: Array, //导航列表
-    },
-  },
-  mounted() {
-    console.log(this.props,555555)
-    if (this.props.navigationNum === 5) {
-      this.skeleton = ["导航1", "导航2", "导航3", "导航4", "导航5"];
-    }
-  },
-  computed: {
-  },
-  methods: {
-    jump(link) {
-      console.log(link,'link')
-      if (link) {
-        this.$emit("jump", link)
-      }
-    }
-    
-  },
-};
-</script>
-<style lang="less"  scoped>
-.nav_container {
-  display: flex;
-  flex-direction: column;
-  margin: -42px 12px 0;
-  background: #fff;
-  border-radius: 12px;
-}
-.order_top {
-      display: flex;
-      justify-content: space-between;
-      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-      padding: 11px;
-      .order_title {
-        color: #1e1e1e;
-        font-size: 14px;
-        font-weight: bold;
-      }
-      .more_title {
-        color: #999999;
-        font-size: 12px;
-      }
-    }
-.assets_list {
-    background: #fff;
-    display: flex;
-    align-items: center;
-    border-radius: 12px;
-    flex-wrap: wrap;
-    
-    .assets_item {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      flex-wrap: wrap;
-      justify-content: space-around;
-      margin: 10px 0;
-      div:first-child {
-        font-size: 25px;
-      }
-      .item_name {
-        color: #1e1e1e;
-        font-size: 12px;
-        margin-top: 6px;
-      }
-    }
-  }
-  .navigationNum5 {
-    width: 20%;
-  }
-  .navigationNum4 {
-    width: 25%;
-  }
-</style>
-
+<template>
+  <div>
+
+    <div v-if="props" class="nav_container" :style="{ marginTop: (props.marginTop - 42) + 'px', marginBottom: (props.marginBottom + 10) + 'px', borderRadius: props.componentCorner + 'px' }">
+     <div class="order_top" @click="jump(props.navList[0].link)" v-if="props.tab == 0">
+        <div class="order_title" :style="{ color: props.titleColor }">{{ props.navTitle }}</div>
+        <div class="more_title" v-if="props.seeAll == 0 && props.navList.length > 0">
+          <span :style="{ color: props.tabColor }">{{ props.navList[0].name }}</span>
+          <img :src="props.navList[0].imgUrl" style="width: 12px; height: 12px" />
+        </div>
+      </div>
+    <div class="assets_list" :style="{ backgroundColor: props.backgroundColor }">
+      <div class="assets_item" :class="[props.navigationNum === 5 ? 'navigationNum5' : 'navigationNum4']" v-for="(item, index) in props.selectImg" :key="index" @click="jump(item.link)" >
+        <img v-if="item && item.imgUrl"  :src="item.imgUrl" :style="{ width:  props.photoSize == 0 ? '24px' : '36px', height: props.photoSize == 0 ? '24px' : '36px', borderRadius: props.photoCorner + 'px' }" />
+        <img v-else  src="http://123.com/image/name.png" :style="{ width:  props.photoSize == 0 ? '24px' : '36px', height: props.photoSize == 0 ? '24px' : '36px', borderRadius: props.photoCorner + 'px' }" />
+        <div v-if="item && item.name" class="item_name" :style="{ color: props.fontColor }">{{ item.name }}</div>
+      </div>
+      
+    </div>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+export default {
+  name: "cyy-ArsenalMyNavigation",
+  data() {
+    return {
+    };
+  },
+  props: {
+    props: {
+      // showStyle: Number, //展示风格
+      componentCorner: Number, //组件边角
+      tab: Number, //导航标题
+      navTitle: String, //标题
+      titleColor: String, //主标题颜色
+      tabColor: String, //查看全部颜色
+      seeAll: Number, // 全部
+      photoSize: Number, //图片尺寸
+      photoCorner: Number, //图片边角
+      fontColor: String, //文字颜色
+      backgroundColor: String, //背景颜色
+      marginTop: Number, //上边距
+      marginBottom: Number, //下边距
+      selectImg: Array, //添加图片
+      navigationNum: Number, //导航数量
+      navList: Array, //导航列表
+    },
+  },
+  mounted() {
+    console.log(this.props,555555)
+    if (this.props.navigationNum === 5) {
+      this.skeleton = ["导航1", "导航2", "导航3", "导航4", "导航5"];
+    }
+  },
+  computed: {
+  },
+  methods: {
+    jump(link) {
+      console.log(link,'link')
+      if (link) {
+        this.$emit("jump", link)
+      }
+    }
+    
+  },
+};
+</script>
+<style lang="less"  scoped>
+.nav_container {
+  display: flex;
+  flex-direction: column;
+  margin: -42px 12px 0;
+  background: #fff;
+  border-radius: 12px;
+}
+.order_top {
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+      padding: 11px;
+      .order_title {
+        color: #1e1e1e;
+        font-size: 14px;
+        font-weight: bold;
+      }
+      .more_title {
+        color: #999999;
+        font-size: 12px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+.assets_list {
+    background: #fff;
+    display: flex;
+    align-items: center;
+    border-radius: 12px;
+    flex-wrap: wrap;
+    
+    .assets_item {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      flex-wrap: wrap;
+      justify-content: space-around;
+      margin: 10px 0;
+      div:first-child {
+        font-size: 25px;
+      }
+      .item_name {
+        color: #1e1e1e;
+        font-size: 12px;
+        margin-top: 6px;
+      }
+    }
+  }
+  .navigationNum5 {
+    width: 20%;
+  }
+  .navigationNum4 {
+    width: 25%;
+  }
+</style>
+