完成话题卡片

components/moblie/topicCard.vue

+<template>
+  <yun-slider>
+    <yun-div
+      :width-v="704"
+      :margin-v="[0,'auto']"
+      :padding-v="[40,paddingL]"
+      bg-color-v="#fff"
+      :flex-v="['row','flex-start','flex-start']"
+      :border-v="[1,'solid','#EFEFEF','bottom']"
+      slot="card"
+    >
+      <yun-div :ske-h="100" :width-v="100" :flex-v="['row', 'space-between','flex-start']" :flex-wrap="true">
+        <yun-div :width-v="48" :height-v="48" bg-color-v="#B4DDDE" v-if="imgSrc === ''" :border-r="[4]"></yun-div>
+        <yun-div :width-v="48" :height-v="48" bg-color-v="#E0BDBD" v-if="imgSrc === ''" :border-r="[4]"></yun-div>
+        <yun-div :width-v="48" :height-v="48" bg-color-v="#9FBBC9" v-if="imgSrc === ''" :margin-v="[4,0,0,0]" :border-r="[4]"></yun-div>
+        <yun-div :width-v="48" :height-v="48" bg-color-v="#A6E2B6" v-if="imgSrc === ''" :margin-v="[4,0,0,0]" :border-r="[4]"></yun-div>
+        <yun-img :src="imgSrc" v-if="imgSrc !== ''" :width-v="100" :height-v="100" :border-r="[8]" :ske-w="100" :ske-h="100"></yun-img>
+      </yun-div>
+      <yun-div :margin-v="[0,0,0,16]">
+        <yun-div :ske-w="588" :width-v="588" :font-style="[36,48,500,'#333','left']" :flex-v="['row','space-between','center']">
+          <span># 设计 #</span>
+          <span @click="handelFocus" :style="{fontSize:commonReturnFlexedLength(28),flexShrink: 0}">{{focus ? '取消关注' : '+关注'}}</span>
+        </yun-div>
+        <yun-div :font-style="[20,27,500,'#999','left']" :margin-v="[15,0,0,0]">56万讨论·1.5亿阅读</yun-div>
+      </yun-div>
+    </yun-div>
+  </yun-slider>
+</template>
+
+<script>
+import commonMixin from "./commonMixin";
+
+export default {
+  mixins: [commonMixin],
+  data() {
+    return {
+      imgSrc: '',
+      focus: false
+    }
+  },
+  methods: {
+    handelFocus() {
+      this.focus = !this.focus
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

dev-schedule__ghj.md

@@ -4,4 +4,4 @@
 + 容器卡片(1)
 + 话题卡片(1)
 + 粉丝卡片(1)
-+ 用户卡片小(1)
++ 用户卡片小(1) √