From 41b36f013d4103ffc59fd58feb6b6177ee5b04f7 Mon Sep 17 00:00:00 2001
From: inleft <inleft@qq.com>
Date: Sat, 15 Jan 2022 21:06:24 +0800
Subject: [PATCH] 组件 模块分离
---
src/components/mini/box3-archive.vue | 166 ++++++++++
src/components/swichLabel/main2-show.vue | 14
src/components/fixed/footer.vue | 15
src/components/fixed/header.vue | 80 +++++
src/components/mini/box5-article.vue | 0
src/components/mini/tagInfo.vue | 63 +++
src/components/mini/mdDetail.vue | 0
src/components/swichLabel/main3-show.vue | 18
src/components/mini/box4-minibox.vue | 0
src/components/mini/box7-search.vue | 0
src/components/mini/tagTime.vue | 179 +++++++++++
src/components/swichLabel/main1-show.vue | 140 +++++---
src/components/mini/box8-panal.vue | 0
src/config/router.config.js | 29 +
src/components/mini/box2-class.vue | 22
/dev/null | 71 ----
src/components/group/boxRight.vue | 4
src/main.js | 10
src/components/group/boxLeft.vue | 30 +
src/config/screenConfig.js | 2
package.json | 2
src/components/layouts/baseLayout.vue | 73 +---
src/components/mini/box9-netFile.vue | 0
src/App.vue | 18
src/components/mini/box1-info.vue | 0
src/components/group/articleList.vue | 4
26 files changed, 701 insertions(+), 239 deletions(-)
diff --git a/package.json b/package.json
index 25e272d..e55a267 100644
--- a/package.json
+++ b/package.json
@@ -19,8 +19,8 @@
"text-loader": "^0.0.1",
"vue": "^2.6.14",
"vue-markdown": "^2.2.4",
+ "vue-router": "^3.5.3",
"vue-simple-uploader": "^0.7.6",
- "vue-virtual-scroller": "^1.0.10",
"vuex": "^3.6.2"
},
"devDependencies": {
diff --git a/src/App.vue b/src/App.vue
index 733dab0..f7d2f41 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,6 +1,6 @@
<template>
- <div id="app" class="app app1">
- <router-view class="scrollbar"></router-view>
+ <div id="app" class="app">
+ <router-view class=""></router-view>
</div>
</template>
@@ -19,17 +19,15 @@
</script>
-<style>
- @import url("https://www.layuicdn.com/layui/css/layui.css");
- .app {
- overflow: auto;
- border: none;
+<style lang="less">
+ #app {
+ // overflow: auto;
+ // border: none;
}
- .scrollbar {
+ /* .scrollbar {
margin: 0 auto;
- }
-
+ } */
::-webkit-scrollbar {
/*滚动条整体样式*/
width: 8px;
diff --git a/src/components/fixed/footer.vue b/src/components/fixed/footer.vue
new file mode 100644
index 0000000..2fcf84a
--- /dev/null
+++ b/src/components/fixed/footer.vue
@@ -0,0 +1,15 @@
+<template>
+ <div>
+ <p>备案号:
+ <a href="http://www.miitbeian.gov.cn/" target="_blank">粤ICP备19000592号-1</a>
+ </p>
+ </div>
+
+</template>
+
+<script>
+ export default {
+
+ }
+</script>
+
diff --git a/src/components/fixed/header.vue b/src/components/fixed/header.vue
new file mode 100644
index 0000000..1d70d32
--- /dev/null
+++ b/src/components/fixed/header.vue
@@ -0,0 +1,80 @@
+<template>
+ <a-row type="flex" justify="start" >
+ <a-col v-bind="showSmall">
+ <router-link to="/main1">Home »</router-link>
+ </a-col>
+ <a-col v-bind="showSmall">
+ <router-link to="/main2">乐谱搜索 »</router-link>
+ </a-col>
+ <a-col v-bind="showSmall">
+ <router-link to="/main3">动漫搜索 »</router-link>
+ </a-col>
+ <a-col v-bind="showMain">
+ <router-link to="/tagInfo">关于我 »</router-link>
+ </a-col>
+ <a-col v-bind="showMain">
+ <a-auto-complete v-bind="search" @select="onSelect" @search="onSearch" @change="onChange">
+ <a-input>
+ <a-icon slot="suffix" type="search" class="certain-category-icon" />
+ </a-input>
+ </a-auto-complete>
+ </a-col>
+
+ </a-row>
+
+</template>
+
+<script>
+ export default {
+
+ data() {
+ return {
+ search: {
+ placeholder: "全局搜索..",
+ allowClear: true,
+ // autoFocus: true,
+ backfill: true,
+ dataSource: [],
+ },
+ showSmall: {
+ xs: 6,
+ sm: 6,
+ md: 6,
+ lg: 6,
+ xl: 6,
+ xxl: 6,
+ },
+ showMain: {
+ xs: 0,
+ sm: 0,
+ md: 2,
+ lg: 2,
+ xl: 2,
+ xxl: 2,
+ }
+ }
+
+ },
+ watch: {
+ value(val) {
+ console.log('值:', val);
+ },
+ },
+ methods: {
+ onSearch(searchText) {
+ this.dataSource = !searchText ? [] : [searchText, searchText.repeat(2), searchText.repeat(3)];
+ console.log("补全..");
+ },
+ onSelect(value) {
+ console.log('回车', value);
+ },
+ onChange(value) {
+ console.log('修改', value);
+ },
+ keyListener(value) {
+ console.log('ref', this.$refs.mySearch);
+ console.log('键盘', value);
+ },
+ },
+ }
+</script>
\ No newline at end of file
diff --git a/src/components/layouts/box6-articleList.vue b/src/components/group/articleList.vue
similarity index 89%
rename from src/components/layouts/box6-articleList.vue
rename to src/components/group/articleList.vue
index 0f7cbb1..608261b 100644
--- a/src/components/layouts/box6-articleList.vue
+++ b/src/components/group/articleList.vue
@@ -1,5 +1,5 @@
<template>
- <div>
+ <div >
<box5></box5>
<box5></box5>
<box5></box5>
@@ -11,7 +11,7 @@
</template>
<script>
- import box5 from "./box5-article.vue"
+ import box5 from "../mini/box5-article.vue"
export default {
components: {
box5
diff --git a/src/components/group/boxLeft.vue b/src/components/group/boxLeft.vue
new file mode 100644
index 0000000..7d8ab19
--- /dev/null
+++ b/src/components/group/boxLeft.vue
@@ -0,0 +1,30 @@
+<template>
+ <div class="blog-left-side fadeInLeft">
+ <div class="blog-cell">
+ <box1></box1>
+ </div>
+ <div class="blog-cell">
+ <box2></box2>
+ </div>
+ <div class="blog-cell">
+ <box3></box3>
+ </div>
+ </div>
+</template>
+
+<script>
+ import box1 from "../mini/box1-info.vue"
+ import box2 from "../mini/box2-class.vue"
+ import box3 from "../mini/box3-archive.vue"
+ export default {
+ components: {
+ box1,
+ box2,
+ box3,
+ },
+ data() {
+ return {}
+ }
+ }
+</script>
+
diff --git a/src/components/layouts/boxRight.vue b/src/components/group/boxRight.vue
similarity index 97%
rename from src/components/layouts/boxRight.vue
rename to src/components/group/boxRight.vue
index e8d9b9e..f7fd762 100644
--- a/src/components/layouts/boxRight.vue
+++ b/src/components/group/boxRight.vue
@@ -3,7 +3,7 @@
<div class="blog-cell ">
<box4 v-bind="vo1"></box4>
</div>
- <div class="blog-cell ">
+ <div class="blog-cell ">
<box4 v-bind="vo2"></box4>
</div>
<div class="blog-cell ">
@@ -19,7 +19,7 @@
</template>
<script>
- import box4 from "./box4-minibox.vue"
+ import box4 from "../mini/box4-minibox.vue"
export default {
components: {
box4,
diff --git a/src/components/layouts/main.vue b/src/components/layouts/baseLayout.vue
similarity index 76%
rename from src/components/layouts/main.vue
rename to src/components/layouts/baseLayout.vue
index 66f377e..9d5a6ee 100644
--- a/src/components/layouts/main.vue
+++ b/src/components/layouts/baseLayout.vue
@@ -1,28 +1,24 @@
<template>
- <div id="components-layout-basic">
- <a-layout>
- <a-layout-header :style="{ position: 'fixed', zIndex: 999, width: '100%' }">
- <tag-Header></tag-Header>
- </a-layout-header>
- <a-layout>
- <router-view class="fade"></router-view>
- </a-layout>
- <a-layout-footer>
- <div>
- <p>备案号:
- <a href="http://www.miitbeian.gov.cn/" target="_blank">粤ICP备19000592号-1</a>
- </p>
- </div>
- </a-layout-footer>
- </a-layout>
- </div>
+ <a-layout>
+ <a-layout-header :style="{position:'fixed',height:'60px',marginBottom:'35px',zIndex: 999, width: '100%' }">
+ <tag-Header />
+ </a-layout-header>
+
+ <router-view class="fade"></router-view>
+
+ <a-layout-footer>
+ <tagFooter />
+ </a-layout-footer>
+ </a-layout>
</template>
<script>
- import tagHeader from "./tag-header.vue"
+ import tagHeader from "../fixed/header.vue"
+ import tagFooter from "../fixed/footer.vue"
export default {
components: {
- tagHeader
+ tagHeader,
+ tagFooter,
},
data() {
return {
@@ -46,8 +42,8 @@
});
let url = window.URL.createObjectURL(blob)
let link = document.createElement('a')
- link.download="inleft.jpg"
-
+ link.download = "inleft.jpg"
+
link.style.display = 'none'
link.href = url
document.body.appendChild(link)
@@ -60,11 +56,7 @@
</script>
<style lang="less">
- #components-layout-basic {
- width: 100%;
- margin: 0;
- padding: 0;
-
+ .app {
.ant-layout {}
.ant-layout-header {
@@ -76,6 +68,7 @@
.ant-layout-footer {
background-color: #edf1f299;
padding: 0px;
+ padding-top: 20px;
p {
margin: auto;
@@ -88,34 +81,6 @@
}
}
- .ant-layout-sider {
- background: #3ba0e9;
- color: #fff;
- line-height: 120px;
- }
-
- .ant-col,
- .ant-layout-content {
- height: 100%;
- }
-
-
- }
-
-
- .h1,
- .h2,
- .h3,
- .h4,
- .h5,
- .h6,
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- font-weight: 400;
}
span,
diff --git a/src/components/layouts/box3-archive.vue b/src/components/layouts/box3-archive.vue
deleted file mode 100644
index e1a3f8f..0000000
--- a/src/components/layouts/box3-archive.vue
+++ /dev/null
@@ -1,161 +0,0 @@
-<template>
- <div class="blog-container">
- <span class="blog-pigeonhole">归档信息</span>
- <div class="blog-scroll ">
- <div class="">
- <p class="blog-pigeonhole-p">2020</p>
- <div class="blog-pigeonhole-list">
-
- <div class="blog-pigeonhole-item" v-for="item in list2020">
- <router-link to="/tagTime">
- <span>{{item.month}}月</span>
- </router-link>
- <span>{{item.count}}篇</span>
-
- </div>
- </div>
- </div>
- <div>
- <p class="blog-pigeonhole-p">2019</p>
- <div class="blog-pigeonhole-list">
-
- <div class="blog-pigeonhole-item" v-for="item in list2019">
- <router-link to="/tagTime">
- <span>{{item.month}}月</span>
- </router-link>
- <span>{{item.count}}篇</span>
- </div>
- </div>
- </div>
- <div>
- <p class="blog-pigeonhole-p">2019</p>
- <div class="blog-pigeonhole-list">
-
- <div class="blog-pigeonhole-item" v-for="item in list2019">
- <router-link to="/tagTime">
- <span>{{item.month}}月</span>
- </router-link>
- <span>{{item.count}}篇</span>
- </div>
- </div>
- </div>
- </div>
- </div>
-
-</template>
-
-<script>
- export default {
- data() {
- return {
- list2019: [{
- month: "12",
- count: 10
- }, {
- month: "10",
- count: 11
- }, {
- month: "9",
- count: 9
- }],
- list2020: [{
- month: "12",
- count: 8
- }, {
- month: "10",
- count: 7
- }, {
- month: "9",
- count: 6
- }, {
- month: "8",
- count: 5
- }, {
- month: "7",
- count: 4
- }, {
- month: "6",
- count: 3
- }, {
- month: "5",
- count: 2
- }, {
- month: "4",
- count: 1
- }]
- }
- }
- }
-</script>
-
-</script>
-
-<style lang="less">
- /*归档部分*/
-
- .blog-pigeonhole {
- font-size: 15px;
- }
-
- .blog-pigeonhole-p {
- width: 20%;
- text-align: center;
- line-height: 20px;
- border-radius: 6px 6px 6px 6px;
- /*background-color: #edf0f3;*/
- margin-left: 3%;
- margin-bottom: 3%;
- opacity: 0.7;
- }
-
- .blog-pigeonhole-list {
- line-height: 1.6;
- padding-left: 3%;
- padding-right: 3%;
- /*display: flex; !*弹性盒子*!*/
- /*justify-content: flex-end; !*在弹性盒对象的 <div> 元素中的各项周围留有空白：*!*/
-
- display: flex;
- display: -webkit-flex;
- -webkit-justify-content: flex-start;
- justify-content: flex-start;
-
- flex-wrap: wrap;
- /*让弹性盒元素在必要的时候拆行：*/
- align-content: flex-start;
- -webkit-align-content: flex-start;
-
- }
-
- .blog-pigeonhole-item {
- min-width: 22%;
- margin-left: 1.5%;
- margin-right: 1.5%;
- margin-bottom: 5%;
-
- a span:first-child {
- height: 22px;
- background-color: #edf0f3;
- border-radius: 6px 6px 0 0;
- opacity: .8;
- color: #999aaa;
- line-height: 22px;
- margin-bottom: 1px;
- text-align: center;
- }
-
- a span:last-child {
- height: 22px;
- background-color: #f6f8fa;
- border-radius: 0 0 6px 6px;
- color: #555666;
- line-height: 20px;
- font-weight: 600;
- text-align: center;
- }
-
- span {
- display: block;
- }
- }
-</style>
diff --git a/src/components/layouts/boxLeft.vue b/src/components/layouts/boxLeft.vue
deleted file mode 100644
index 5308fc0..0000000
--- a/src/components/layouts/boxLeft.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<template>
- <div class="blog-left-side fadeInLeft">
- <div class="blog-cell ">
- <box1></box1>
- </div>
- <div class="blog-cell ">
- <box2></box2>
- </div>
- <div class="blog-cell ">
- <box3></box3>
- </div>
- </div>
-</template>
-
-<script>
- import box1 from "./box1-info.vue"
- import box2 from "./box2-class.vue"
- import box3 from "./box3-archive.vue"
- export default {
- components: {
- box1,
- box2,
- box3,
- },
- data() {
- return {}
- }
- }
-</script>
-
diff --git a/src/components/layouts/tag-header.vue b/src/components/layouts/tag-header.vue
deleted file mode 100644
index 2380bdf..0000000
--- a/src/components/layouts/tag-header.vue
+++ /dev/null
@@ -1,130 +0,0 @@
-<template>
- <div class="layui-row">
- <a-row type="flex" justify="start">
- <a-col v-bind="showSmall">
- <router-link to="/main1">Home »</router-link>
- </a-col>
- <a-col v-bind="showSmall">
- <router-link to="/main2">乐谱搜索 »</router-link>
- </a-col>
- <a-col v-bind="showSmall">
- <router-link to="/main3">动漫搜索 »</router-link>
- </a-col>
- <a-col v-bind="showMain">
- <router-link to="/tagInfo">关于我 »</router-link>
- </a-col>
- <a-col v-bind="showMain">
- <a-auto-complete v-bind="search" @select="onSelect" @search="onSearch" @change="onChange">
- <a-input>
- <a-icon slot="suffix" type="search" class="certain-category-icon" />
- </a-input>
- </a-auto-complete>
- </a-col>
-
- </a-row>
-
- <!-- <ul class="layui-nav ">
- <li class="layui-nav-item blog-displayIn-minScreen">
- <i class="layui-icon layui-icon-spread-left">Home</i>
- </li>
- <li class="layui-nav-item blog-displayIn-BidScreen">
- <legend> Home</legend>
- </li>
- <li class="layui-nav-item">
- <a href="javascript:;">文章<span class="layui-nav-more"></span></a>
- <dl class="layui-nav-child layui-anim layui-anim-upbit">
- <dd><a href="#">按时间线</a></dd>
- <dd><a href="#">按Tag</a></dd>
- <dd><a href="#">按热度</a></dd>
- </dl>
- </li>
- <li class="layui-nav-item"><a href="#">曲谱/曲库</a></li>
- <li class="layui-nav-item">
- <a href="javascript:;">动漫<span class="layui-nav-more"></span></a>
- <dl class="layui-nav-child layui-anim layui-anim-upbit">
- <dd><a href="#">番</a></dd>
- <dd><a href="#">电影</a></dd>
- <dd><a href="#">声优</a></dd>
- </dl>
- </li>
- <li class="layui-nav-item blog-displayIn-BidScreen"><a href="#">第九艺术</a></li>
- </ul>
- <ul class="layui-nav layui-layout-right">
- <li class="layui-nav-item blog-displayIn-BidScreen">
- <input type="text" placeholder="搜索一下" value="" class="layui-input">
- </li>
- <li class="layui-nav-item">
- <a href="javascript:;">
- <img src="http://t.inleft.com/share/media_photo/xigong.png" class="layui-nav-img">
- inleft
- </a>
- <dl class="layui-nav-child">
- <dd><a href="#">About</a></dd>
- <dd><a href="#">时间轴</a></dd>
- </dl>
- </li>
- </ul> -->
- </div>
-
-</template>
-
-<script>
- export default {
-
- data() {
- return {
- search: {
- placeholder: "全局搜索..",
- allowClear: true,
- // autoFocus: true,
- backfill: true,
- dataSource: [],
- },
- showSmall: {
- xs: 6,
- sm: 6,
- md: 6,
- lg: 6,
- xl: 6,
- xxl: 6,
- },
- showMain: {
- xs: 0,
- sm: 0,
- md: 2,
- lg: 2,
- xl: 2,
- xxl: 2,
- }
- }
-
- },
- watch: {
- value(val) {
- console.log('值:', val);
- },
- },
- methods: {
- onSearch(searchText) {
- this.dataSource = !searchText ? [] : [searchText, searchText.repeat(2), searchText.repeat(3)];
- console.log("补全..");
- },
- onSelect(value) {
- console.log('回车', value);
- },
- onChange(value) {
- console.log('修改', value);
- },
- keyListener(value) {
- console.log('ref', this.$refs.mySearch);
- console.log('键盘', value);
- },
- },
- }
-</script>
-
-</script>
-
-<style lang="less">
-
-</style>
diff --git a/src/components/layouts/tag-time.vue b/src/components/layouts/tag-time.vue
deleted file mode 100644
index 8117c9f..0000000
--- a/src/components/layouts/tag-time.vue
+++ /dev/null
@@ -1,67 +0,0 @@
-<template>
- <div class="swichTag">
- <a-divider orientation="left">
- 归档时间线
- </a-divider>
-
- <fieldset class="layui-elem-field layui-field-title ">
- <legend><a name="docend">2020年</a></legend>
- </fieldset>
-
- <div class="layui-field-box">
- <ul class="layui-timeline">
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h3 class="layui-timeline-title">8月18日</h3>
- <p>
- layui 2.0 的一切准备工作似乎都已到位。发布之弦，一触即发。
- <br>不枉近百个日日夜夜与之为伴。因小而大，因弱而强。
- <br>无论它能走多远，抑或如何支撑？至少我曾倾注全心，无怨无悔 <i class="layui-icon"></i>
- </p>
- </div>
- </li>
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h3 class="layui-timeline-title">8月16日</h3>
- <p>杜甫的思想核心是儒家的仁政思想，他有“<em>致君尧舜上，再使风俗淳</em>”的宏伟抱负。个人最爱的名篇有：</p>
- <ul>
- <li>《登高》</li>
- <li>《茅屋为秋风所破歌》</li>
- </ul>
- </div>
- </li>
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h3 class="layui-timeline-title">8月15日</h3>
- <p>
- 中国人民抗日战争胜利72周年
- <br>常常在想，尽管对这个国家有这样那样的抱怨，但我们的确生在了最好的时代
- <br>铭记、感恩
- <br>所有为中华民族浴血奋战的英雄将士
- <br>永垂不朽
- </p>
- </div>
- </li>
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <div class="layui-timeline-title">过去</div>
- </div>
- </li>
- </ul>
- </div>
-
- </div>
-</template>
-
-<script>
-</script>
-
-<style lang="less">
-
-
-
-</style>
diff --git a/src/components/layouts/tagInfo.vue b/src/components/layouts/tagInfo.vue
deleted file mode 100644
index 73a0a2d..0000000
--- a/src/components/layouts/tagInfo.vue
+++ /dev/null
@@ -1,71 +0,0 @@
-<template>
- <div class="swichTag">
- <blockquote class="layui-elem-quote layui-quote-nm">关于我的一些..小故事</blockquote>
-
- <div class="layui-field-box">
- <ul class="layui-timeline">
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h4 class="layui-timeline-title">过去</h4>
- <p>
- <ul>
- <li> 尘世间一个迷途小码农</li>
- <li> 喜欢钢琴~喜欢吉他 </li>
- </ul>
- </p>
- </div>
- </li>
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h4 class="layui-timeline-title">202108</h4>
- <p>到我提笔准备写下篇类日记的时候,时间已经来到了16号,
- <br>此刻的心情,也是平静了许多,想来,这周算是近年来比较忙的周末了吧,从周五凌晨1点就开始马不停蹄..
- </p>
- <br>然后,从哪里说起好呢,似乎从哪里起头都是一笔坏账啊..
- <br>临上车前,我靠在车站的栏杆上,她拿着个电动小风扇,倒是自己不吹,直愣愣对着我,在我旁边吱吱说话,不过此刻我早就不记得她说过了什么,
- <br>那时,我满脑子都是在想:说吧,说吧,你再不说,以后可能就没机会了
- <br>没等我脑子缓过神来,我把目光从直视栏杆的方向就自然扭回到了她的方向,话题一转:你觉得,我是在用什么心情在看你呢
- <br>
- <br>她啊了一下,似乎也没停顿,这个比较直的女孩就接过我的话:应该是.....她自顾说了几个她觉得的我对她的印象,但我又不记得了,
- <br>几分神,我顿了顿,遥遥头:不是,我是说,我对你的...
- <br>我的双手在胸前不停打转,很想通过肢体的语言给她传递我心里的感受,有那么一会,我实在是不知道怎么说下去了..
- <br>
- <br>客车要发动了,我停下双手,想起也是在5年前的一个场景,我眼神示意了下车子,我要走了..客流开始向车的入口靠过去,我正要提步,
- <br>"哎..给我一个拥抱吧"..我张了双臂,她稍微停了下,还是靠了过来..
- <br>离开她的怀抱后,我比一个六的手势:"其实,六年前,到现在为止"..趁机,我在她耳边,轻轻地道:"***,***"
- <br>
- <br>end..希望我们的故事还没有终点..
- </div>
- </li>
-
- <li class="layui-timeline-item">
- <i class="layui-icon layui-timeline-axis"></i>
- <div class="layui-timeline-content layui-text">
- <h3 class="layui-timeline-title">
- ...
- <p>
- <em>爱她所爱,思她所思,为她承担伤痛</em>
- <br>度过苦难 无论贫寒,无论卑贱或富贵
- <br>无论身处乱世还是神所不顾 我都愿为她拔剑而战
- <br>为她收起翅膀
- <br>不离不弃,直至永远
- </p>
- </h3>
- </div>
- </li>
-
- </ul>
-
- </div>
-
- </div>
-</template>
-
-<script>
-</script>
-
-<style lang="less">
-
-</style>
diff --git a/src/components/layouts/box1-info.vue b/src/components/mini/box1-info.vue
similarity index 100%
rename from src/components/layouts/box1-info.vue
rename to src/components/mini/box1-info.vue
diff --git a/src/components/layouts/box2-class.vue b/src/components/mini/box2-class.vue
similarity index 86%
rename from src/components/layouts/box2-class.vue
rename to src/components/mini/box2-class.vue
index 4733e83..8248734 100644
--- a/src/components/layouts/box2-class.vue
+++ b/src/components/mini/box2-class.vue
@@ -1,5 +1,5 @@
<template>
- <div class="blog-container ">
+ <div class="blog-container ">
<span class="blog-pigeonhole">分类</span>
<div class="blog-scroll ">
<div class="blog-log-list">
@@ -18,14 +18,6 @@
</router-link>
<span>{{item.count}}</span>
- </div>
- </div>
- <div class="blog-log-list">
- <div class="blog-log-item" v-for="item in list2">
- <router-link to="/box1">
- <span>{{item.name}}</span>
- </router-link>
- <span>{{item.count}}</span>
</div>
</div>
</div>
@@ -59,6 +51,18 @@
}, {
name: "星标",
count: 14
+ },{
+ name: "Tag",
+ count: 133
+ }, {
+ name: "专题",
+ count: 10
+ }, {
+ name: "偏好",
+ count: 12
+ }, {
+ name: "星标",
+ count: 14
}]
}
}
diff --git a/src/components/mini/box3-archive.vue b/src/components/mini/box3-archive.vue
new file mode 100644
index 0000000..bf6d70b
--- /dev/null
+++ b/src/components/mini/box3-archive.vue
@@ -0,0 +1,166 @@
+<template>
+ <div class="blog-container archive">
+ <span class="blog-pigeonhole">
+ <router-link to="/tagTime?type=1">
+ 归档信息
+ </router-link>
+ </span>
+ <div class="blog-scroll ">
+ <div v-for="yearData in myData">
+ <router-link to="/tagTime?type=2">
+ <p class="blog-pigeonhole-p">{{yearData.year}}</p>
+ </router-link>
+ <div class="blog-pigeonhole-list">
+
+ <div class="blog-pigeonhole-item" v-for="item in yearData.list">
+ <router-link to="/tagTime?type=3">
+ <span>{{item.month}}月</span>
+ </router-link>
+ <span>{{item.count}}篇</span>
+
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ "myData": [{
+ "year": "2022",
+ "list": [{
+ "month": "12",
+ "count": 10
+ },
+ {
+ "month": "10",
+ "count": 11
+ },
+ {
+ "month": "9",
+ "count": 9
+ }
+ ]
+ },
+ {
+ "year": "2021",
+ "list": [{
+ "month": "12",
+ "count": 8
+ },
+ {
+ "month": "10",
+ "count": 7
+ },
+ {
+ "month": "9",
+ "count": 6
+ },
+ {
+ "month": "8",
+ "count": 5
+ },
+ {
+ "month": "7",
+ "count": 4
+ },
+ {
+ "month": "6",
+ "count": 3
+ },
+ {
+ "month": "5",
+ "count": 2
+ },
+ {
+ "month": "4",
+ "count": 1
+ }
+ ]
+ }
+ ],
+ }
+ }
+ }
+</script>
+
+</script>
+
+<style lang="less">
+ /*归档部分*/
+ .archive {
+ a {
+ color: black;
+ }
+ }
+
+ .blog-pigeonhole {
+ font-size: 15px;
+ }
+
+ .blog-pigeonhole-p {
+ width: 20%;
+ text-align: center;
+ line-height: 20px;
+ border-radius: 6px 6px 6px 6px;
+ /*background-color: #edf0f3;*/
+ margin-left: 3%;
+ margin-bottom: 3%;
+ opacity: 0.7;
+ }
+
+ .blog-pigeonhole-list {
+ line-height: 1.6;
+ padding-left: 3%;
+ padding-right: 3%;
+ /*display: flex; !*弹性盒子*!*/
+ /*justify-content: flex-end; !*在弹性盒对象的 <div> 元素中的各项周围留有空白：*!*/
+
+ display: flex;
+ display: -webkit-flex;
+ -webkit-justify-content: flex-start;
+ justify-content: flex-start;
+
+ flex-wrap: wrap;
+ /*让弹性盒元素在必要的时候拆行：*/
+ align-content: flex-start;
+ -webkit-align-content: flex-start;
+
+ }
+
+ .blog-pigeonhole-item {
+ min-width: 22%;
+ margin-left: 1.5%;
+ margin-right: 1.5%;
+ margin-bottom: 5%;
+
+ a span:first-child {
+ height: 22px;
+ background-color: #edf0f3;
+ border-radius: 6px 6px 0 0;
+ opacity: .8;
+ color: #999aaa;
+ line-height: 22px;
+ margin-bottom: 1px;
+ text-align: center;
+ }
+
+ a span:last-child {
+ height: 22px;
+ background-color: #f6f8fa;
+ border-radius: 0 0 6px 6px;
+ color: #555666;
+ line-height: 20px;
+ font-weight: 600;
+ text-align: center;
+ }
+
+ span {
+ display: block;
+ }
+ }
+</style>
diff --git a/src/components/layouts/box4-minibox.vue b/src/components/mini/box4-minibox.vue
similarity index 100%
rename from src/components/layouts/box4-minibox.vue
rename to src/components/mini/box4-minibox.vue
diff --git a/src/components/layouts/box5-article.vue b/src/components/mini/box5-article.vue
similarity index 100%
rename from src/components/layouts/box5-article.vue
rename to src/components/mini/box5-article.vue
diff --git a/src/components/layouts/music.vue b/src/components/mini/box7-search.vue
similarity index 100%
rename from src/components/layouts/music.vue
rename to src/components/mini/box7-search.vue
diff --git a/src/components/layouts/musicPanal.vue b/src/components/mini/box8-panal.vue
similarity index 100%
rename from src/components/layouts/musicPanal.vue
rename to src/components/mini/box8-panal.vue
diff --git a/src/components/layouts/module.vue b/src/components/mini/box9-netFile.vue
similarity index 100%
rename from src/components/layouts/module.vue
rename to src/components/mini/box9-netFile.vue
diff --git a/src/components/layouts/mdDetail.vue b/src/components/mini/mdDetail.vue
similarity index 100%
rename from src/components/layouts/mdDetail.vue
rename to src/components/mini/mdDetail.vue
diff --git a/src/components/mini/tagInfo.vue b/src/components/mini/tagInfo.vue
new file mode 100644
index 0000000..c4ade27
--- /dev/null
+++ b/src/components/mini/tagInfo.vue
@@ -0,0 +1,63 @@
+<template>
+ <div class="swichTag">
+ <a-page-header style="padding: 0px;" title=" " @back="() => this.$router.go(-1)">
+ </a-page-header>
+ <a-divider :dashed="true" orientation="left">关于我的一些..小故事</a-divider>
+
+ <a-timeline pending="...">
+ <p slot="pendingDot" style="font-size: 18px;" />
+ <a-timeline-item color="green">
+ <a-icon slot="dot" type="form" style="font-size: 18px;" />
+ <h4 >我是?</h4>
+ <p>
+ <ul>
+ <li> 尘世间一个迷途小码农</li>
+ <li> 喜欢钢琴~喜欢吉他 </li>
+ </ul>
+ </p>
+ </a-timeline-item>
+
+ <a-timeline-item color="green">
+ <a-icon slot="dot" type="clock-circle-o" style="font-size: 18px;" />
+ <h4 class="layui-timeline-title">202108</h4>
+ <p>到我提笔准备写下篇类日记的时候,时间已经来到了16号,
+ <br>此刻的心情,也是平静了许多,想来,这周算是近年来比较忙的周末了吧,从周五凌晨1点就开始马不停蹄..
+ </p>
+ <br>然后,从哪里说起好呢,似乎从哪里起头都是一笔坏账啊..
+ <br>临上车前,我靠在车站的栏杆上,她拿着个电动小风扇,倒是自己不吹,直愣愣对着我,在我旁边吱吱说话,不过此刻我早就不记得她说过了什么,
+ <br>那时,我满脑子都是在想:说吧,说吧,你再不说,以后可能就没机会了
+ <br>没等我脑子缓过神来,我把目光从直视栏杆的方向就自然扭回到了她的方向,话题一转:你觉得,我是在用什么心情在看你呢
+ <br>
+ <br>她啊了一下,似乎也没停顿,这个比较直的女孩就接过我的话:应该是.....她自顾说了几个她觉得的我对她的印象,但我又不记得了,
+ <br>几分神,我顿了顿,遥遥头:不是,我是说,我对你的...
+ <br>我的双手在胸前不停打转,很想通过肢体的语言给她传递我心里的感受,有那么一会,我实在是不知道怎么说下去了..
+ <br>
+ <br>客车要发动了,我停下双手,想起也是在5年前的一个场景,我眼神示意了下车子,我要走了..客流开始向车的入口靠过去,我正要提步,
+ <br>"哎..给我一个拥抱吧"..我张了双臂,她稍微停了下,还是靠了过来..
+ <br>离开她的怀抱后,我比一个六的手势:"其实,六年前,到现在为止"..趁机,我在她耳边,轻轻地道:"***,***"
+ <br>
+ <br>end..希望我们的故事还没有终点..
+ </a-timeline-item>
+
+ <a-timeline-item color="green">
+ <a-icon slot="dot" type="align-center" style="font-size: 18px;" />
+ <p>
+
+ <br><em>爱她所爱,思她所思,为她承担伤痛</em>
+ <br>度过苦难 无论贫寒,无论卑贱或富贵
+ <br>无论身处乱世还是神所不顾 我都愿为她拔剑而战
+ <br>为她收起翅膀
+ <br>不离不弃,直至永远
+ </p>
+ </a-timeline-item>
+ </a-timeline>
+
+ </div>
+</template>
+
+<script>
+</script>
+
+<style lang="less">
+
+</style>
diff --git a/src/components/mini/tagTime.vue b/src/components/mini/tagTime.vue
new file mode 100644
index 0000000..1aa0c90
--- /dev/null
+++ b/src/components/mini/tagTime.vue
@@ -0,0 +1,179 @@
+<template>
+ <div class="swichTag">
+
+ <a-page-header title="归档时间线" style="padding: 0px;" @back="() => this.$router.go(-1)" />
+
+ <a-timeline pending="没有更多了...">
+ <a-icon slot="pendingDot" type="close-circle" style="font-size: 18px;" />
+ <div v-for="yearData in list">
+ <a-divider orientation="left">
+ {{yearData.year}}年
+ </a-divider>
+
+ <a-timeline-item v-for="monthData in yearData.monthList" color="green">
+ <a-icon slot="dot" type="clock-circle-o" style="font-size: 18px;" />
+ <h3>{{monthData.month}}</h3>
+ <div v-for="article in monthData.list">
+ <span>{{article.name}} </span>{{article.remark}}
+ </div>
+ </a-timeline-item>
+ </div>
+ </a-timeline>
+ </div>
+</template>
+
+<script>
+ export default {
+ props: {
+ 'type': Number,
+ },
+ mounted() {
+ console.log(this.$route.query)
+ },
+
+ data() {
+ var tempList = [{
+ "year": "2022",
+ "monthList": [{
+ "month": "9月18日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "随笔"
+ },
+ {
+ "name": "vue动态路由异步加载",
+
+ }
+ ]
+ },
+ {
+ "month": "9月08日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ }]
+ },
+ {
+ "month": "8月16日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词1",
+
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词2",
+ "remark": "22"
+ }
+ ]
+ }
+ ]
+ },
+ {
+ "year": "2021",
+ "monthList": [{
+ "month": "9月18日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "随笔"
+ },
+ {
+ "name": "vue动态路由异步加载",
+
+ }
+ ]
+ },
+ {
+ "month": "9月08日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ }]
+ },
+ {
+ "month": "8月16日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词1",
+
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词2",
+ "remark": "22"
+ }
+ ]
+ }
+ ]
+ },
+ {
+ "year": "2020",
+ "monthList": [{
+ "month": "9月18日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "随笔"
+ },
+ {
+ "name": "vue动态路由异步加载",
+
+ }
+ ]
+ },
+ {
+ "month": "9月08日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ }]
+ },
+ {
+ "month": "8月16日",
+ "list": [{
+ "name": "陈奕迅-Body Song 歌词1",
+ "remark": "111"
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词1",
+
+ },
+ {
+ "name": "陈奕迅-Body Song 歌词2",
+ "remark": "22"
+ }
+ ]
+ }
+ ]
+ }
+ ]
+
+ var list = [];
+ var type = this.$route.query.type;
+ if (type == 1) {
+ list = tempList;
+ } else if (type == 2) {
+ list.push(tempList[0]);
+ list.push(tempList[1]);
+ } else if (type == 3) {
+ list.push(tempList[1]);
+ }
+
+ return {
+ list: list
+ }
+ }
+ }
+</script>
+
+
+<style lang="less">
+ .ant-timeline-item-content {
+ span {
+ line-height: 30px;
+ }
+ }
+</style>
diff --git a/src/components/layouts/main1-show.vue b/src/components/swichLabel/main1-show.vue
similarity index 61%
rename from src/components/layouts/main1-show.vue
rename to src/components/swichLabel/main1-show.vue
index c2f86b3..b53280b 100644
--- a/src/components/layouts/main1-show.vue
+++ b/src/components/swichLabel/main1-show.vue
@@ -1,47 +1,59 @@
<template>
- <div class="blog-main">
- <a-row>
- <a-col v-bind="colApiLeft">
+ <div>
+ <div class="blog-drawer">
+ <a-drawer placement="left" :closable="false" :visible="visible1" :getContainer="'body'"
+ :after-visible-change="afterVisibleChange" @close="onClose1" :zIndex="10" :width=270
+ :bodyStyle="{padding:'0px'}" :wrapStyle="{padding:'0px',top:'60px'}">
<boxLeft></boxLeft>
- <a-drawer placement="left" :closable="false" :visible="visible1"
- :after-visible-change="afterVisibleChange" @close="onClose1">
- <boxLeft></boxLeft>
- </a-drawer>
- </a-col>
- <a-col v-bind="colApiMain ">
- <a-button @click="showDrawer1">
- 小抽屉1
- </a-button>
- <a-button @click="showDrawer2">
- 小抽屉2
- </a-button>
- <router-view></router-view>
- </a-col>
- <a-col v-bind="colApiRight" ref="myDrawer">
- <boxRight></boxRight>
+ </a-drawer>
- <a-drawer placement="right" :closable="false" :visible="visible2"
- :after-visible-change="afterVisibleChange" @close="onClose2">
+ <a-drawer placement="right" :closable="false" :visible="visible2" :getContainer="'body'"
+ :after-visible-change="afterVisibleChange" @close="onClose2" :zIndex="10" :width=270
+ :bodyStyle="{padding:'0px'}" :wrapStyle="{padding:'0px',top:'60px'}">
+ <boxRight></boxRight>
+ </a-drawer>
+ </div>
+ <div class="blog-main">
+
+
+ <a-row>
+ <a-col v-bind="colApiLeft">
+ <boxLeft></boxLeft>
+ </a-col>
+ <a-col v-bind="colApiMain ">
+
+ <a-button @click="showDrawer1">
+ 小抽屉1
+ </a-button>
+ <a-button @click="showDrawer2">
+ 小抽屉2
+ </a-button>
+ <router-view></router-view>
+ </a-col>
+
+ <a-col v-bind="colApiRight" ref="myDrawer">
<boxRight></boxRight>
- </a-drawer>
- </a-col>
- </a-row>
+ </a-col>
+ </a-row>
+ </div>
+
</div>
</template>
<script>
- import boxLeft from "./boxLeft.vue"
- import boxRight from "./boxRight.vue"
- import box6 from "./box6-articleList.vue"
+ import boxLeft from "../group/boxLeft.vue"
+ import boxRight from "../group/boxRight.vue"
+ import articleList from "../group/articleList.vue"
+
export default {
+
components: {
boxLeft,
boxRight,
- box6
+ articleList
},
methods: {
- afterVisibleChange(val) {
- },
+ afterVisibleChange(val) {},
showDrawer1() {
this.visible1 = true;
},
@@ -55,40 +67,67 @@
this.visible2 = false;
},
},
-
data() {
return {
visible1: false,
visible2: false,
- sliderApi: {
- collapsible: true, //是否可收起
-
- collapsedWidth: 0 //收缩宽度，设置为 0 会出现特殊 trigger
- },
colApiLeft: {
xs: 0,
sm: 0,
- md: 0,
- lg: 8,
- xl: 8,
- xxl: 6,
+ md: {
+ span: 8,
+ },
+ lg: {
+ span: 7,
+ offset: 1,
+ },
+ xl: {
+ span: 5,
+ offset: 2,
+ },
+ xxl: {
+ span: 4,
+ offset: 3,
+ },
},
colApiRight: {
xs: 0,
sm: 0,
md: 0,
lg: 0,
- xl: 0,
- xxl: 4,
+ xl: {
+ span: 5,
+ offset: 1,
+ },
+ xxl: {
+ span: 4,
+ offset: 1,
+ },
},
colApiMain: {
xs: 24,
- sm: 24,
- md: 24,
- lg: 14,
- xl: 14,
- xxl: 14,
+ sm: {
+ span: 20,
+ offset: 2,
+ },
+ md: {
+ span: 14,
+ offset: 1,
+ },
+ lg: {
+ span: 13,
+ offset: 2,
+ },
+ xl: {
+ span: 9,
+ offset: 1,
+ },
+ xxl: {
+ span: 8,
+ offset: 1,
+ },
}
+
}
}
}
@@ -96,6 +135,7 @@
<style lang="less">
.swichTag {
+ min-height: 750px;
padding: 30px 30px 10px;
background-color: white;
border-radius: 15px;
@@ -107,9 +147,9 @@
}
.blog-main {
+ margin-top: 80px;
padding-left: 5%;
padding-right: 5%;
- padding-top: 80px;
}
/*左右两边的盒子容器*/
@@ -122,9 +162,8 @@
.blog-left-side {
position: sticky;
// top: 80px;
- padding-left: 2%;
+ // padding-left: 2%;
/*padding-right: 2%;*/
- z-index: 100;
}
/*中间部分*/
@@ -141,7 +180,6 @@
padding-top: 10px;
/*padding-left: 2%;*/
/*padding-right: 2%;*/
- z-index: 100;
}
div .blog-right-side-meta div {
diff --git a/src/components/layouts/main2-show.vue b/src/components/swichLabel/main2-show.vue
similarity index 76%
rename from src/components/layouts/main2-show.vue
rename to src/components/swichLabel/main2-show.vue
index 7205933..cd368fe 100644
--- a/src/components/layouts/main2-show.vue
+++ b/src/components/swichLabel/main2-show.vue
@@ -2,10 +2,10 @@
<div class="blog-main">
<a-row>
<a-col v-bind="colApiLeft">
- <music :searchType="searchType"></music>
+ <box7 :searchType="searchType"></box7>
</a-col>
<a-col v-bind="colApiMain ">
- <musicPanal></musicPanal>
+ <box8></box8>
<!-- <boxLeft></boxLeft> -->
</a-col>
<a-col v-bind="colApiRight">
@@ -15,13 +15,13 @@
</template>
<script>
- import music from "./music.vue"
- import musicPanal from "./musicPanal.vue"
- import boxLeft from "./boxLeft.vue"
+ import box7 from "../mini/box7-search.vue"
+ import box8 from "../mini/box8-panal.vue"
+ import boxLeft from "../group/boxLeft.vue"
export default {
components: {
- music,
- musicPanal,
+ box7,
+ box8,
boxLeft,
},
diff --git a/src/components/layouts/main3-show.vue b/src/components/swichLabel/main3-show.vue
similarity index 72%
rename from src/components/layouts/main3-show.vue
rename to src/components/swichLabel/main3-show.vue
index a133d1d..01af5bc 100644
--- a/src/components/layouts/main3-show.vue
+++ b/src/components/swichLabel/main3-show.vue
@@ -2,10 +2,10 @@
<div class="blog-main">
<a-row>
<a-col v-bind="colApiLeft">
- <music :searchType="searchType"></music>
+ <box7 :searchType="searchType"></box7>
</a-col>
<a-col v-bind="colApiMain ">
- <boxModule></boxModule>
+ <box9></box9>
<!-- <boxLeft></boxLeft> -->
</a-col>
<a-col v-bind="colApiRight">
@@ -15,16 +15,16 @@
</template>
<script>
- import music from "./music.vue"
- import musicPanal from "./musicPanal.vue"
- import boxLeft from "./boxLeft.vue"
- import boxModule from "./module.vue"
+ import box7 from "../mini/box7-search.vue"
+ import box8 from "../mini/box8-panal.vue"
+ import box9 from "../mini/box9-netFile.vue"
+ import boxLeft from "../group/boxLeft.vue"
export default {
components: {
- music,
- musicPanal,
+ box7,
+ box8,
+ box9,
boxLeft,
- boxModule,
},
data() {
diff --git a/src/config/router.config.js b/src/config/router.config.js
index 5a2f759..0239b54 100644
--- a/src/config/router.config.js
+++ b/src/config/router.config.js
@@ -1,13 +1,15 @@
-import main from '../components/layouts/main.vue'
-import main1 from '../components/layouts/main1-show.vue'
-import main2 from '../components/layouts/main2-show.vue'
-import main3 from '../components/layouts/main3-show.vue'
-import box6 from '../components/layouts/box6-articleList.vue'
-import box1 from '../components/layouts/box1-info.vue'
-import box2 from '../components/layouts/box2-class.vue'
-import tagTime from '../components/layouts/tag-time.vue'
-import tagInfo from '../components/layouts/tagInfo.vue'
-import mdDetail from '../components/layouts/mdDetail.vue'
+import baseLayout from '../components/layouts/baseLayout.vue'
+
+import articleList from '../components/group/articleList.vue'
+
+import main1 from '../components/swichLabel/main1-show.vue'
+import main2 from '../components/swichLabel/main2-show.vue'
+import main3 from '../components/swichLabel/main3-show.vue'
+
+import box1 from '../components/mini/box1-info.vue'
+import tagTime from '../components/mini/tagTime.vue'
+import tagInfo from '../components/mini/tagInfo.vue'
+import mdDetail from '../components/mini/mdDetail.vue'
export const asyncRouterMap = [{
@@ -18,13 +20,13 @@
},
{
path: '/',
- component: main,
+ component: baseLayout,
children: [{
path: '/',
component: main1,
children: [{
path: '/',
- component: box6,
+ component: articleList,
},
{
path: '/box1',
@@ -33,6 +35,7 @@
{
path: '/tagTime',
component: tagTime,
+ props:true
},
{
path: '/tagInfo',
@@ -49,7 +52,7 @@
component: main1,
children: [{
path: '/',
- component: box6,
+ component: articleList,
}]
},
diff --git a/src/config/screenConfig.js b/src/config/screenConfig.js
new file mode 100644
index 0000000..154a58c
--- /dev/null
+++ b/src/config/screenConfig.js
@@ -0,0 +1,2 @@
+export const screenVo = {
+}
diff --git a/src/main.js b/src/main.js
index b944326..fbed757 100644
--- a/src/main.js
+++ b/src/main.js
@@ -10,16 +10,6 @@
Vue.prototype.$axios = axios
-
-import {
- Layout,
- Row,
- Col,
-} from 'ant-design-vue'
-Vue.use(Layout)
-Vue.use(Row)
-Vue.use(Col)
-
new Vue({
el: '#app',
router, //挂载路由
--
Gitblit v1.9.1