feat:暂存

src/components/topButton/large.vue

@@ -8,21 +8,21 @@
 export default {
   name: "LargeTopButton",
   props: {
-    mode: {
+    drawType: {
       type: String,
-      default: "blue"
+      default: "turntable1"
     }
   },
   computed: {
     buttonClass() {
-      if (this.mode === "blue") return "top-button-xy";
+      if (this.drawType === "turntable1") return "top-button-xy";
       return "top-button-hh";
     }
   }
 };
 </script>
 
-<style lang="scss" scoped>
+<style lang="less" scoped>
 .top-button-large {
   width: 276px;
   height: 107px;

src/components/topButton/main.vue

@@ -1,14 +1,14 @@
 <template>
   <div class="top-button">
     <top-btn-view
-      :mode="mode"
-      :active="active === 0"
-      @click.native="clickBtnView(0)"
+      :drawType="drawType"
+      :active="drawType === 'turntable1'"
+      @click.native="clickBtnView('turntable1')"
     ></top-btn-view>
     <top-btn-view
-      :mode="mode"
-      :active="active === 1"
-      @click.native="clickBtnView(1)"
+      :drawType="drawType"
+      :active="drawType === 'turntable2'"
+      @click.native="clickBtnView('turntable2')"
     ></top-btn-view>
   </div>
 </template>
@@ -21,30 +21,24 @@ export default {
     topBtnView
   },
   props: {
-    mode: {
+    drawType: {
       type: String,
-      default: "blue"
-    }
-  },
-  computed: {
-    active() {
-      if (this.mode === "blue") return 0;
-      if (this.mode === "gold") return 1;
-      return 0;
+      default: "turntable1"
     }
   },
+  computed: {},
   methods: {
-    clickBtnView(index) {
-      this.$emit("clickTopButton", index);
+    clickBtnView(drawType) {
+      this.$emit("clickTopButton", drawType);
     }
   }
 };
 </script>
 
-<style lang="scss" scoped>
+<style lang="less" scoped>
 .top-button {
   display: flex;
-  width: 560px;
+  width: 540px;
   justify-content: space-between;
   align-items: flex-end;
   margin: 0 auto;

src/components/topButton/small.vue

@@ -8,21 +8,21 @@
 export default {
   name: "SmallTopButton",
   props: {
-    mode: {
+    drawType: {
       type: String,
-      default: "blue"
+      default: "turntable1"
     }
   },
   computed: {
     buttonClass() {
-      if (this.mode === "blue") return "top-button-hh";
+      if (this.drawType === "turntable1") return "top-button-hh";
       return "top-button-xy";
     }
   }
 };
 </script>
 
-<style lang="scss" scoped>
+<style lang="less" scoped>
 .top-button-small {
   width: 244px;
   height: 78px;

src/components/topButton/topBtnView.vue

@@ -1,7 +1,7 @@
 <template>
   <div>
-    <large-top-button :mode="mode" v-if="active"></large-top-button>
-    <small-top-button :mode="mode" v-else></small-top-button>
+    <large-top-button :drawType="drawType" v-if="active"></large-top-button>
+    <small-top-button :drawType="drawType" v-else></small-top-button>
   </div>
 </template>
 
@@ -15,9 +15,9 @@ export default {
     smallTopButton
   },
   props: {
-    mode: {
+    drawType: {
       type: String,
-      default: "blue"
+      default: "turntable1"
     },
     active: {
       type: Boolean,
@@ -25,11 +25,11 @@ export default {
     }
   },
   watch: {
-    active(val) {
-      console.log("watch", val);
-    }
+    // active(val) {
+    //   console.log("watch", val);
+    // }
   }
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="less" scoped></style>