Browse Source

feat: 增加 wrapper 组件. wrapper支持 link

LosMessi 2 năm trước cách đây
mục cha
commit
2d1a85cce5

+ 8 - 1
src/components/base.js

@@ -5,7 +5,14 @@ export default {
   },
   methods: {
     click(link) {
-      link = ['string', 'number'].indexOf(typeof link) > -1 ? link : this.options.link
+      if(['string', 'number'].indexOf(typeof link) === -1) {
+        const event = link;
+        link = this.options.link;
+        if(link) {
+          event.stopPropagation();
+        }
+      }
+
       if(link === undefined) return;
       this.$router.push({
         name: 'page',

+ 2 - 0
src/components/index.js

@@ -8,6 +8,7 @@ import Title from './title.vue';
 import Video from './video.vue';
 import Tabs from './tabs.vue';
 import TableTexts from './tableTexts.vue';
+import Wrapper from './wrapper.vue';
 
 const componets = {
   View,
@@ -20,6 +21,7 @@ const componets = {
   Video,
   Tabs,
   TableTexts,
+  Wrapper,
 }
 
 export default {

+ 3 - 3
src/components/matrix.vue

@@ -23,9 +23,9 @@ const _cols = [
   'grid-cols-7',
   'grid-cols-8',
   'grid-cols-9',
-  'grid-cols-1',
-  'grid-cols-1',
-  'grid-cols-1',
+  'grid-cols-10',
+  'grid-cols-11',
+  'grid-cols-12',
   'grid-cols-none',
 ]
 

+ 14 - 0
src/components/wrapper.vue

@@ -0,0 +1,14 @@
+<template>
+  <v-view class="wrapper mb-4 last:mb-0" inner :options="options" @click.native="click"></v-view>
+</template>
+<script>
+import Base from './base';
+
+export default {
+  name: 'v-wrapper',
+  extends: Base,
+}
+</script>
+<style lang="less">
+
+</style>

+ 21 - 0
src/tailwind.css

@@ -476,6 +476,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   position: relative;
 }
 
+.m-4 {
+  margin: 1rem;
+}
+
 .mx-auto {
   margin-left: auto;
   margin-right: auto;
@@ -573,6 +577,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   grid-template-columns: none;
 }
 
+.grid-cols-10 {
+  grid-template-columns: repeat(10, minmax(0, 1fr));
+}
+
+.grid-cols-11 {
+  grid-template-columns: repeat(11, minmax(0, 1fr));
+}
+
+.grid-cols-12 {
+  grid-template-columns: repeat(12, minmax(0, 1fr));
+}
+
 .flex-col {
   flex-direction: column;
 }
@@ -620,6 +636,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 0.25rem;
 }
 
+.py-4 {
+  padding-top: 1rem;
+  padding-bottom: 1rem;
+}
+
 .text-center {
   text-align: center;
 }