mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-05 05:42:44 +08:00
chore: remove unused files of site
This commit is contained in:
陈嘉涵
parent
dc6cc6c5af
commit
83d5d0982e
2
.gitignore
vendored
2
.gitignore
vendored
@ -12,7 +12,7 @@ package-lock.json
|
||||
es
|
||||
lib
|
||||
dist
|
||||
docs/dist
|
||||
./site
|
||||
changelog.generated.md
|
||||
test/coverage
|
||||
vetur
|
||||
|
||||
@ -1,149 +0,0 @@
|
||||
<template>
|
||||
<div class="side-nav">
|
||||
<div class="mobile-switch-lang">
|
||||
<span
|
||||
:class="{ active: $vantLang === 'zh-CN' }"
|
||||
@click="switchLang('zh-CN')"
|
||||
>
|
||||
中文
|
||||
</span>
|
||||
<span
|
||||
:class="{ active: $vantLang === 'en-US' }"
|
||||
@click="switchLang('en-US')"
|
||||
>
|
||||
EN
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<h1 class="vant-title">
|
||||
<img src="https://img.yzcdn.cn/vant/logo.png">
|
||||
<span>Vant</span>
|
||||
</h1>
|
||||
<h2 class="vant-desc">{{ description }}</h2>
|
||||
<template v-for="item in navList">
|
||||
<mobile-nav
|
||||
v-for="(group, index) in item.groups"
|
||||
:group="group"
|
||||
:base="$vantLang"
|
||||
:key="index"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import docConfig from '../doc.config';
|
||||
import MobileNav from './MobileNav';
|
||||
import { setLang } from '../utils/lang';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
MobileNav
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
docConfig
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
navList() {
|
||||
return (this.docConfig[this.$vantLang].nav || []).filter(item => item.showInMobile);
|
||||
},
|
||||
|
||||
description() {
|
||||
return this.$vantLang === 'zh-CN' ? '轻量、可靠的移动端 Vue 组件库' : 'Mobile UI Components built on Vue';
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
switchLang(lang) {
|
||||
const from = lang === 'zh-CN' ? 'en-US' : 'zh-CN';
|
||||
this.$router.push(this.$route.path.replace(from, lang));
|
||||
setLang(lang);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@import '../../../src/style/var';
|
||||
|
||||
.side-nav {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
padding: 46px 20px 20px;
|
||||
background: @white;
|
||||
|
||||
.vant-title,
|
||||
.vant-desc {
|
||||
padding-left: @padding-md;
|
||||
font-weight: normal;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.vant-title {
|
||||
margin: 0 0 @padding-md;
|
||||
|
||||
img,
|
||||
span {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 36px;
|
||||
}
|
||||
|
||||
span {
|
||||
margin-left: @padding-md;
|
||||
font-weight: 500;
|
||||
font-size: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
.vant-desc {
|
||||
margin: 0 0 40px;
|
||||
color: #7d7e80;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.mobile-switch-lang {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
overflow: hidden;
|
||||
color: @blue;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
color: @text-color;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
border: 1px solid @border-color;
|
||||
|
||||
&:first-child {
|
||||
border-right: none;
|
||||
border-radius: 3px 0 0 3px;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-left: none;
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: @white;
|
||||
background-color: @blue;
|
||||
border-color: @blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,74 +0,0 @@
|
||||
<template>
|
||||
<van-collapse
|
||||
v-model="active"
|
||||
:border="false"
|
||||
class="mobile-nav"
|
||||
>
|
||||
<van-collapse-item
|
||||
class="mobile-nav__item"
|
||||
:title="group.groupName"
|
||||
:name="group.groupName"
|
||||
>
|
||||
<van-icon
|
||||
:name="group.icon"
|
||||
slot="right-icon"
|
||||
class="mobile-nav__icon"
|
||||
/>
|
||||
<template v-for="(navItem, index) in group.list">
|
||||
<van-cell
|
||||
v-if="!navItem.disabled"
|
||||
:key="index"
|
||||
:to="'/' + base + navItem.path"
|
||||
:title="navItem.title"
|
||||
is-link
|
||||
/>
|
||||
</template>
|
||||
</van-collapse-item>
|
||||
</van-collapse>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
base: String,
|
||||
group: Object
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
active: []
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.mobile-nav {
|
||||
&__item {
|
||||
margin-bottom: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 1px 5px #ebedf0;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
font-size: 24px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.van-collapse-item__content {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.van-collapse-item__title {
|
||||
align-items: center;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
line-height: 40px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,74 +0,0 @@
|
||||
<template>
|
||||
<div class="app">
|
||||
<van-doc
|
||||
:base="base"
|
||||
:config="config"
|
||||
:lang="$vantLang"
|
||||
:github="github"
|
||||
:versions="versions"
|
||||
:simulators="simulators"
|
||||
:search-config="searchConfig"
|
||||
:current-simulator="currentSimulator"
|
||||
@switch-version="onSwitchVersion"
|
||||
>
|
||||
<router-view @changeDemoURL="onChangeDemoURL" />
|
||||
</van-doc>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pkgJson from '../../../package.json';
|
||||
import docConfig, { github, versions, searchConfig } from '../doc.config';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
this.github = github;
|
||||
this.versions = versions;
|
||||
this.searchConfig = searchConfig;
|
||||
|
||||
return {
|
||||
simulators: [`mobile.html${location.hash}`],
|
||||
demoURL: ''
|
||||
};
|
||||
},
|
||||
|
||||
computed: {
|
||||
base() {
|
||||
return `/${this.$vantLang}`;
|
||||
},
|
||||
|
||||
config() {
|
||||
return docConfig[this.$vantLang];
|
||||
},
|
||||
|
||||
currentSimulator() {
|
||||
const { name } = this.$route;
|
||||
return name && name.indexOf('demo') !== -1 ? 1 : 0;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChangeDemoURL(url) {
|
||||
this.simulators = [this.simulators[0], url];
|
||||
},
|
||||
|
||||
onSwitchVersion(version) {
|
||||
if (version !== pkgJson.version) {
|
||||
location.href = `https://youzan.github.io/vant/${version}`;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.van-doc-intro {
|
||||
padding-top: 20px;
|
||||
font-family: 'Dosis', 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif;
|
||||
text-align: center;
|
||||
|
||||
p {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,25 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
|
||||
<link rel="shortcut icon" href="https://img.yzcdn.cn/zanui/vant/vant-2017-12-18.ico">
|
||||
<link href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" rel="stylesheet" />
|
||||
<title>Vant - 轻量、可靠的移动端 Vue 组件库</title>
|
||||
<script>
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?ad6b5732c36321f2dafed737ac2da92f";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
</script>
|
||||
</head>
|
||||
<body ontouchstart>
|
||||
|
||||
<div id="app"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,60 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import VueRouter from 'vue-router';
|
||||
import VantDoc from '@vant/doc';
|
||||
import App from './App';
|
||||
import routes from '../router';
|
||||
import { isMobile, importAll } from '../utils';
|
||||
|
||||
if (isMobile) {
|
||||
location.replace('mobile.html' + location.hash);
|
||||
}
|
||||
|
||||
Vue.use(VueRouter).use(VantDoc);
|
||||
|
||||
const docs = {};
|
||||
const docsFromMarkdown = require.context('../../markdown', false, /(en-US|zh-CN)\.md$/);
|
||||
const docsFromPackages = require.context('../../../src', true, /README(\.zh-CN)?\.md$/);
|
||||
|
||||
importAll(docs, docsFromMarkdown);
|
||||
importAll(docs, docsFromPackages);
|
||||
|
||||
const router = new VueRouter({
|
||||
mode: 'hash',
|
||||
routes: routes({ componentMap: docs }),
|
||||
scrollBehavior(to) {
|
||||
if (to.hash) {
|
||||
return { selector: to.hash };
|
||||
}
|
||||
|
||||
return { x: 0, y: 0 };
|
||||
}
|
||||
});
|
||||
|
||||
router.afterEach(() => {
|
||||
Vue.nextTick(() => window.syncPath());
|
||||
});
|
||||
|
||||
window.vueRouter = router;
|
||||
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Vue.config.productionTip = false;
|
||||
}
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
mounted() {
|
||||
if (this.$route.hash) {
|
||||
// wait page init
|
||||
setTimeout(() => {
|
||||
const el = document.querySelector(this.$route.hash);
|
||||
if (el) {
|
||||
el.scrollIntoView({
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
}, 1000);
|
||||
}
|
||||
},
|
||||
render: h => h(App),
|
||||
router
|
||||
});
|
||||
@ -1,717 +0,0 @@
|
||||
import pkgJson from '../../package.json';
|
||||
|
||||
const { version } = pkgJson;
|
||||
|
||||
export const searchConfig = {
|
||||
apiKey: '90067aecdaa2c85220e2783cd305caac',
|
||||
indexName: 'vant'
|
||||
};
|
||||
|
||||
export const versions = [version, '1.x'];
|
||||
|
||||
export const github = 'https://github.com/youzan/vant';
|
||||
|
||||
export default {
|
||||
'zh-CN': {
|
||||
header: {
|
||||
logo: {
|
||||
image: 'https://b.yzcdn.cn/vant/logo-white.png',
|
||||
title: 'Vant',
|
||||
href: '#/'
|
||||
},
|
||||
nav: {
|
||||
lang: {
|
||||
text: 'En',
|
||||
from: 'zh-CN',
|
||||
to: 'en-US'
|
||||
},
|
||||
logoLink: [
|
||||
{
|
||||
image: 'https://b.yzcdn.cn/vant/logo/weapp.svg',
|
||||
url: '/vant-weapp'
|
||||
},
|
||||
{
|
||||
image: 'https://b.yzcdn.cn/vant/logo/github.svg',
|
||||
url: github
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
nav: [
|
||||
{
|
||||
name: '开发指南',
|
||||
groups: [
|
||||
{
|
||||
list: [
|
||||
{
|
||||
path: '/intro',
|
||||
title: '介绍'
|
||||
},
|
||||
{
|
||||
path: '/quickstart',
|
||||
title: '快速上手'
|
||||
},
|
||||
{
|
||||
path: '/changelog',
|
||||
title: '更新日志'
|
||||
},
|
||||
{
|
||||
path: '/style',
|
||||
title: '内置样式'
|
||||
},
|
||||
{
|
||||
path: '/theme',
|
||||
title: '定制主题'
|
||||
},
|
||||
{
|
||||
path: '/contribution',
|
||||
title: '开发指南'
|
||||
},
|
||||
{
|
||||
path: '/design',
|
||||
title: '设计资源'
|
||||
},
|
||||
{
|
||||
path: '/style-guide',
|
||||
title: '风格指南'
|
||||
},
|
||||
{
|
||||
path: '/locale',
|
||||
title: '国际化'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: '组件',
|
||||
showInMobile: true,
|
||||
groups: [
|
||||
{
|
||||
groupName: '基础组件',
|
||||
icon: 'https://img.yzcdn.cn/vant/basic-0401.svg',
|
||||
list: [
|
||||
{
|
||||
path: '/button',
|
||||
title: 'Button 按钮'
|
||||
},
|
||||
{
|
||||
path: '/cell',
|
||||
title: 'Cell 单元格'
|
||||
},
|
||||
{
|
||||
path: '/icon',
|
||||
title: 'Icon 图标'
|
||||
},
|
||||
{
|
||||
path: '/image',
|
||||
title: 'Image 图片'
|
||||
},
|
||||
{
|
||||
path: '/col',
|
||||
title: 'Layout 布局'
|
||||
},
|
||||
{
|
||||
path: '/popup',
|
||||
title: 'Popup 弹出层'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '表单组件',
|
||||
icon: 'orders-o',
|
||||
list: [
|
||||
{
|
||||
path: '/checkbox',
|
||||
title: 'Checkbox 复选框'
|
||||
},
|
||||
{
|
||||
path: '/datetime-picker',
|
||||
title: 'DatetimePicker 时间选择'
|
||||
},
|
||||
{
|
||||
path: '/field',
|
||||
title: 'Field 输入框'
|
||||
},
|
||||
{
|
||||
path: '/number-keyboard',
|
||||
title: 'NumberKeyboard 数字键盘'
|
||||
},
|
||||
{
|
||||
path: '/password-input',
|
||||
title: 'PasswordInput 密码输入框'
|
||||
},
|
||||
{
|
||||
path: '/picker',
|
||||
title: 'Picker 选择器'
|
||||
},
|
||||
{
|
||||
path: '/radio',
|
||||
title: 'Radio 单选框'
|
||||
},
|
||||
{
|
||||
path: '/rate',
|
||||
title: 'Rate 评分'
|
||||
},
|
||||
{
|
||||
path: '/search',
|
||||
title: 'Search 搜索'
|
||||
},
|
||||
{
|
||||
path: '/slider',
|
||||
title: 'Slider 滑块'
|
||||
},
|
||||
{
|
||||
path: '/stepper',
|
||||
title: 'Stepper 步进器'
|
||||
},
|
||||
{
|
||||
path: '/switch',
|
||||
title: 'Switch 开关'
|
||||
},
|
||||
{
|
||||
path: '/switch-cell',
|
||||
title: 'SwitchCell 开关单元格'
|
||||
},
|
||||
{
|
||||
path: '/uploader',
|
||||
title: 'Uploader 文件上传'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '反馈组件',
|
||||
icon: 'gift-card-o',
|
||||
list: [
|
||||
{
|
||||
path: '/action-sheet',
|
||||
title: 'ActionSheet 上拉菜单'
|
||||
},
|
||||
{
|
||||
path: '/dialog',
|
||||
title: 'Dialog 弹出框'
|
||||
},
|
||||
{
|
||||
path: '/dropdown-menu',
|
||||
title: 'DropdownMenu 下拉菜单'
|
||||
},
|
||||
{
|
||||
path: '/loading',
|
||||
title: 'Loading 加载'
|
||||
},
|
||||
{
|
||||
path: '/notify',
|
||||
title: 'Notify 消息通知'
|
||||
},
|
||||
{
|
||||
path: '/overlay',
|
||||
title: 'Overlay 遮罩层'
|
||||
},
|
||||
{
|
||||
path: '/pull-refresh',
|
||||
title: 'PullRefresh 下拉刷新'
|
||||
},
|
||||
{
|
||||
path: '/swipe-cell',
|
||||
title: 'SwipeCell 滑动单元格'
|
||||
},
|
||||
{
|
||||
path: '/toast',
|
||||
title: 'Toast 轻提示'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '展示组件',
|
||||
icon: 'photo-o',
|
||||
list: [
|
||||
{
|
||||
path: '/circle',
|
||||
title: 'Circle 环形进度条'
|
||||
},
|
||||
{
|
||||
path: '/collapse',
|
||||
title: 'Collapse 折叠面板'
|
||||
},
|
||||
{
|
||||
path: '/count-down',
|
||||
title: 'CountDown 倒计时'
|
||||
},
|
||||
{
|
||||
path: '/divider',
|
||||
title: 'Divider 分割线'
|
||||
},
|
||||
{
|
||||
path: '/image-preview',
|
||||
title: 'ImagePreview 图片预览'
|
||||
},
|
||||
{
|
||||
path: '/lazyload',
|
||||
title: 'Lazyload 图片懒加载'
|
||||
},
|
||||
{
|
||||
path: '/list',
|
||||
title: 'List 列表'
|
||||
},
|
||||
{
|
||||
path: '/notice-bar',
|
||||
title: 'NoticeBar 通知栏'
|
||||
},
|
||||
{
|
||||
path: '/panel',
|
||||
title: 'Panel 面板'
|
||||
},
|
||||
{
|
||||
path: '/progress',
|
||||
title: 'Progress 进度条'
|
||||
},
|
||||
{
|
||||
path: '/skeleton',
|
||||
title: 'Skeleton 骨架屏'
|
||||
},
|
||||
{
|
||||
path: '/steps',
|
||||
title: 'Steps 步骤条'
|
||||
},
|
||||
{
|
||||
path: '/sticky',
|
||||
title: 'Sticky 粘性布局'
|
||||
},
|
||||
{
|
||||
path: '/swipe',
|
||||
title: 'Swipe 轮播'
|
||||
},
|
||||
{
|
||||
path: '/tag',
|
||||
title: 'Tag 标记'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '导航组件',
|
||||
icon: 'peer-pay',
|
||||
list: [
|
||||
{
|
||||
path: '/grid',
|
||||
title: 'Grid 宫格'
|
||||
},
|
||||
{
|
||||
path: '/index-bar',
|
||||
title: 'IndexBar 索引栏'
|
||||
},
|
||||
{
|
||||
path: '/nav-bar',
|
||||
title: 'NavBar 导航栏'
|
||||
},
|
||||
{
|
||||
path: '/pagination',
|
||||
title: 'Pagination 分页'
|
||||
},
|
||||
{
|
||||
path: '/sidebar',
|
||||
title: 'Sidebar 侧边导航'
|
||||
},
|
||||
{
|
||||
path: '/tab',
|
||||
title: 'Tab 标签页'
|
||||
},
|
||||
{
|
||||
path: '/tabbar',
|
||||
title: 'Tabbar 标签栏'
|
||||
},
|
||||
{
|
||||
path: '/tree-select',
|
||||
title: 'TreeSelect 分类选择'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: '业务组件',
|
||||
icon: 'other-pay',
|
||||
list: [
|
||||
{
|
||||
path: '/address-edit',
|
||||
title: 'AddressEdit 地址编辑'
|
||||
},
|
||||
{
|
||||
path: '/address-list',
|
||||
title: 'AddressList 地址列表'
|
||||
},
|
||||
{
|
||||
path: '/area',
|
||||
title: 'Area 省市区选择'
|
||||
},
|
||||
{
|
||||
path: '/card',
|
||||
title: 'Card 商品卡片'
|
||||
},
|
||||
{
|
||||
path: '/contact-card',
|
||||
title: 'Contact 联系人'
|
||||
},
|
||||
{
|
||||
path: '/coupon-list',
|
||||
title: 'Coupon 优惠券'
|
||||
},
|
||||
{
|
||||
path: '/goods-action',
|
||||
title: 'GoodsAction 商品导航'
|
||||
},
|
||||
{
|
||||
path: '/submit-bar',
|
||||
title: 'SubmitBar 提交订单栏'
|
||||
},
|
||||
{
|
||||
path: '/sku',
|
||||
title: 'Sku 商品规格'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
'en-US': {
|
||||
header: {
|
||||
logo: {
|
||||
image: 'https://b.yzcdn.cn/vant/logo-white.png',
|
||||
title: 'Vant',
|
||||
href: '#/'
|
||||
},
|
||||
nav: {
|
||||
lang: {
|
||||
text: '中文',
|
||||
from: 'en-US',
|
||||
to: 'zh-CN'
|
||||
},
|
||||
logoLink: [
|
||||
{
|
||||
image: 'https://b.yzcdn.cn/vant/logo/github.svg',
|
||||
url: github
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
nav: [
|
||||
{
|
||||
name: 'Essentials',
|
||||
groups: [
|
||||
{
|
||||
list: [
|
||||
{
|
||||
path: '/intro',
|
||||
title: 'Introduction'
|
||||
},
|
||||
{
|
||||
path: '/quickstart',
|
||||
title: 'Quickstart'
|
||||
},
|
||||
{
|
||||
path: '/changelog',
|
||||
title: 'Changelog'
|
||||
},
|
||||
{
|
||||
path: '/style',
|
||||
title: 'Built-in style'
|
||||
},
|
||||
{
|
||||
path: '/theme',
|
||||
title: 'Custom Theme'
|
||||
},
|
||||
{
|
||||
path: '/locale',
|
||||
title: 'Internationalization'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Components',
|
||||
showInMobile: true,
|
||||
groups: [
|
||||
{
|
||||
groupName: 'Basic Components',
|
||||
icon: 'https://img.yzcdn.cn/vant/basic-0401.svg',
|
||||
list: [
|
||||
{
|
||||
path: '/button',
|
||||
title: 'Button'
|
||||
},
|
||||
{
|
||||
path: '/cell',
|
||||
title: 'Cell'
|
||||
},
|
||||
{
|
||||
path: '/icon',
|
||||
title: 'Icon'
|
||||
},
|
||||
{
|
||||
path: '/image',
|
||||
title: 'Image'
|
||||
},
|
||||
{
|
||||
path: '/col',
|
||||
title: 'Layout'
|
||||
},
|
||||
{
|
||||
path: '/popup',
|
||||
title: 'Popup'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: 'Form Components',
|
||||
icon: 'orders-o',
|
||||
list: [
|
||||
{
|
||||
path: '/checkbox',
|
||||
title: 'Checkbox'
|
||||
},
|
||||
{
|
||||
path: '/datetime-picker',
|
||||
title: 'DatetimePicker'
|
||||
},
|
||||
{
|
||||
path: '/field',
|
||||
title: 'Field'
|
||||
},
|
||||
{
|
||||
path: '/number-keyboard',
|
||||
title: 'NumberKeyboard'
|
||||
},
|
||||
{
|
||||
path: '/password-input',
|
||||
title: 'PasswordInput'
|
||||
},
|
||||
{
|
||||
path: '/picker',
|
||||
title: 'Picker'
|
||||
},
|
||||
{
|
||||
path: '/radio',
|
||||
title: 'Radio'
|
||||
},
|
||||
{
|
||||
path: '/rate',
|
||||
title: 'Rate'
|
||||
},
|
||||
{
|
||||
path: '/search',
|
||||
title: 'Search'
|
||||
},
|
||||
{
|
||||
path: '/slider',
|
||||
title: 'Slider'
|
||||
},
|
||||
{
|
||||
path: '/stepper',
|
||||
title: 'Stepper'
|
||||
},
|
||||
{
|
||||
path: '/switch',
|
||||
title: 'Switch'
|
||||
},
|
||||
{
|
||||
path: '/switch-cell',
|
||||
title: 'SwitchCell'
|
||||
},
|
||||
{
|
||||
path: '/uploader',
|
||||
title: 'Uploader'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: 'Action Components',
|
||||
icon: 'gift-card-o',
|
||||
list: [
|
||||
{
|
||||
path: '/action-sheet',
|
||||
title: 'ActionSheet'
|
||||
},
|
||||
{
|
||||
path: '/dialog',
|
||||
title: 'Dialog'
|
||||
},
|
||||
{
|
||||
path: '/dropdown-menu',
|
||||
title: 'DropdownMenu'
|
||||
},
|
||||
{
|
||||
path: '/loading',
|
||||
title: 'Loading'
|
||||
},
|
||||
{
|
||||
path: '/notify',
|
||||
title: 'Notify'
|
||||
},
|
||||
{
|
||||
path: '/overlay',
|
||||
title: 'Overlay'
|
||||
},
|
||||
{
|
||||
path: '/pull-refresh',
|
||||
title: 'PullRefresh'
|
||||
},
|
||||
{
|
||||
path: '/swipe-cell',
|
||||
title: 'SwipeCell'
|
||||
},
|
||||
{
|
||||
path: '/toast',
|
||||
title: 'Toast'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: 'Display Components',
|
||||
icon: 'photo-o',
|
||||
list: [
|
||||
{
|
||||
path: '/circle',
|
||||
title: 'Circle'
|
||||
},
|
||||
{
|
||||
path: '/collapse',
|
||||
title: 'Collapse'
|
||||
},
|
||||
{
|
||||
path: '/count-down',
|
||||
title: 'CountDown'
|
||||
},
|
||||
{
|
||||
path: '/divider',
|
||||
title: 'Divider'
|
||||
},
|
||||
{
|
||||
path: '/image-preview',
|
||||
title: 'ImagePreview'
|
||||
},
|
||||
{
|
||||
path: '/lazyload',
|
||||
title: 'Lazyload'
|
||||
},
|
||||
{
|
||||
path: '/list',
|
||||
title: 'List'
|
||||
},
|
||||
{
|
||||
path: '/notice-bar',
|
||||
title: 'NoticeBar'
|
||||
},
|
||||
{
|
||||
path: '/panel',
|
||||
title: 'Panel'
|
||||
},
|
||||
{
|
||||
path: '/progress',
|
||||
title: 'Progress'
|
||||
},
|
||||
{
|
||||
path: '/skeleton',
|
||||
title: 'Skeleton'
|
||||
},
|
||||
{
|
||||
path: '/steps',
|
||||
title: 'Steps'
|
||||
},
|
||||
{
|
||||
path: '/sticky',
|
||||
title: 'Sticky'
|
||||
},
|
||||
{
|
||||
path: '/swipe',
|
||||
title: 'Swipe'
|
||||
},
|
||||
{
|
||||
path: '/tag',
|
||||
title: 'Tag'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: 'Navigation Components',
|
||||
icon: 'peer-pay',
|
||||
list: [
|
||||
{
|
||||
path: '/grid',
|
||||
title: 'Grid'
|
||||
},
|
||||
{
|
||||
path: '/index-bar',
|
||||
title: 'IndexBar'
|
||||
},
|
||||
{
|
||||
path: '/nav-bar',
|
||||
title: 'NavBar'
|
||||
},
|
||||
{
|
||||
path: '/pagination',
|
||||
title: 'Pagination'
|
||||
},
|
||||
{
|
||||
path: '/sidebar',
|
||||
title: 'Sidebar'
|
||||
},
|
||||
{
|
||||
path: '/tab',
|
||||
title: 'Tab'
|
||||
},
|
||||
{
|
||||
path: '/tabbar',
|
||||
title: 'Tabbar'
|
||||
},
|
||||
{
|
||||
path: '/tree-select',
|
||||
title: 'TreeSelect'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: 'Business Components',
|
||||
icon: 'other-pay',
|
||||
list: [
|
||||
{
|
||||
path: '/address-edit',
|
||||
title: 'AddressEdit'
|
||||
},
|
||||
{
|
||||
path: '/address-list',
|
||||
title: 'AddressList'
|
||||
},
|
||||
{
|
||||
path: '/area',
|
||||
title: 'Area'
|
||||
},
|
||||
{
|
||||
path: '/card',
|
||||
title: 'Card'
|
||||
},
|
||||
{
|
||||
path: '/contact-card',
|
||||
title: 'Contact'
|
||||
},
|
||||
{
|
||||
path: '/coupon-list',
|
||||
title: 'Coupon'
|
||||
},
|
||||
{
|
||||
path: '/goods-action',
|
||||
title: 'GoodsAction'
|
||||
},
|
||||
{
|
||||
path: '/submit-bar',
|
||||
title: 'SubmitBar'
|
||||
},
|
||||
{
|
||||
path: '/sku',
|
||||
title: 'Sku'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
@ -1,23 +1,22 @@
|
||||
/**
|
||||
* Demo Common Mixin && i18n
|
||||
*/
|
||||
|
||||
import Vue from 'vue';
|
||||
import VueRouter from 'vue-router';
|
||||
import VantDoc from '@vant/doc';
|
||||
import i18n from '../utils/i18n';
|
||||
import Vant, { Lazyload, Locale } from '../../../src';
|
||||
import { camelize } from '../../../src/utils/format/string';
|
||||
import Locale from '../../src/locale';
|
||||
import { get } from '../../src/utils';
|
||||
import { camelize } from '../../src/utils/format/string';
|
||||
|
||||
Vue
|
||||
.use(Vant)
|
||||
.use(VantDoc)
|
||||
.use(VueRouter)
|
||||
.use(Lazyload, {
|
||||
lazyComponent: true
|
||||
});
|
||||
Vue.mixin({
|
||||
computed: {
|
||||
$t() {
|
||||
const { name } = this.$options;
|
||||
const prefix = name ? camelize(name) + '.' : '';
|
||||
const messages = this.$vantMessages[this.$vantLang];
|
||||
|
||||
Vue.mixin(i18n);
|
||||
return (path, ...args) => {
|
||||
const message = get(messages, prefix + path) || get(messages, path);
|
||||
return typeof message === 'function' ? message(...args) : message;
|
||||
};
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Locale.add({
|
||||
'zh-CN': {
|
||||
@ -77,21 +76,3 @@ Locale.add({
|
||||
passwordPlaceholder: 'Password'
|
||||
}
|
||||
});
|
||||
|
||||
export function demoWrapper(module, name) {
|
||||
const component = module.default;
|
||||
name = 'demo-' + name;
|
||||
component.name = name;
|
||||
|
||||
const { i18n: config } = component;
|
||||
if (config) {
|
||||
const formattedI18n = {};
|
||||
const camelizedName = camelize(name);
|
||||
Object.keys(config).forEach(key => {
|
||||
formattedI18n[key] = { [camelizedName]: config[key] };
|
||||
});
|
||||
Locale.add(formattedI18n);
|
||||
}
|
||||
|
||||
return component;
|
||||
}
|
||||
@ -1,102 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<van-nav-bar
|
||||
v-show="title"
|
||||
class="van-doc-nav-bar"
|
||||
:title="title"
|
||||
:border="false"
|
||||
:left-arrow="showNav"
|
||||
@click-left="onBack"
|
||||
/>
|
||||
<van-notice-bar
|
||||
v-if="weapp"
|
||||
v-show="title"
|
||||
wrapable
|
||||
:text="tips"
|
||||
background="#ecf9ff"
|
||||
color="rgba(52, 73, 94, 0.8)"
|
||||
style="font-size: 12px;"
|
||||
/>
|
||||
<keep-alive>
|
||||
<router-view :weapp="weapp" />
|
||||
</keep-alive>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
function getQueryString(name) {
|
||||
const arr = location.search.substr(1).split('&');
|
||||
for (let i = 0, l = arr.length; i < l; i++) {
|
||||
const item = arr[i].split('=');
|
||||
if (item.shift() === name) {
|
||||
return decodeURIComponent(item.join('='));
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
title() {
|
||||
return this.$route.meta.title || '';
|
||||
},
|
||||
|
||||
showNav() {
|
||||
return getQueryString('hide_nav') !== '1';
|
||||
},
|
||||
|
||||
weapp() {
|
||||
return getQueryString('weapp') === '1';
|
||||
}
|
||||
},
|
||||
|
||||
beforeCreate() {
|
||||
this.tips = 'Tips: 当前预览的是 Vue 版 Vant 的示例，少部分功能可能与小程序版有出入，请以文档描述和实际效果为准。';
|
||||
},
|
||||
|
||||
methods: {
|
||||
onBack() {
|
||||
history.back();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
@import '../../../src/style/var';
|
||||
|
||||
body {
|
||||
min-width: 100vw;
|
||||
color: @text-color;
|
||||
font-family: 'PingFang SC', Helvetica, 'STHeiti STXihei', 'Microsoft YaHei', Tohoma, Arial, sans-serif;
|
||||
line-height: 1;
|
||||
background-color: #f7f8fa;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.van-doc-nav-bar {
|
||||
height: 56px;
|
||||
line-height: 56px;
|
||||
|
||||
.van-nav-bar__title {
|
||||
font-size: 17px;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.van-icon {
|
||||
color: @gray-6;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.van-doc-demo-section {
|
||||
margin-top: -56px;
|
||||
padding-top: 56px;
|
||||
}
|
||||
</style>
|
||||
@ -1,30 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
|
||||
<meta http-Equiv="Cache-Control" Content="no-cache" />
|
||||
<meta http-Equiv="Pragma" Content="no-cache" />
|
||||
<meta http-Equiv="Expires" Content="0" />
|
||||
<link rel="shortcut icon" href="https://img.yzcdn.cn/zanui/vant/vant-2017-12-18.ico">
|
||||
<title>Vant - 轻量、可靠的移动端 Vue 组件库</title>
|
||||
<script>window.Promise || document.write('<script src="//img.yzcdn.cn/huiyi/build/h5/js/pinkie.min.js"><\/script>');</script>
|
||||
<script>
|
||||
// avoid to load analytics in iframe
|
||||
if (window.top === window) {
|
||||
var _hmt = _hmt || [];
|
||||
(function() {
|
||||
var hm = document.createElement("script");
|
||||
hm.src = "https://hm.baidu.com/hm.js?ad6b5732c36321f2dafed737ac2da92f";
|
||||
var s = document.getElementsByTagName("script")[0];
|
||||
s.parentNode.insertBefore(hm, s);
|
||||
})();
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body ontouchstart>
|
||||
|
||||
<div id="app"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,38 +0,0 @@
|
||||
import '../../../src/index.less';
|
||||
import Vue from 'vue';
|
||||
import VueRouter from 'vue-router';
|
||||
import routes from '../router';
|
||||
import App from './App';
|
||||
import { importAll } from '../utils';
|
||||
import '@vant/touch-emulator';
|
||||
|
||||
const componentMap = {};
|
||||
const context = require.context('../../../src', true, /demo\/index.vue$/);
|
||||
|
||||
importAll(componentMap, context);
|
||||
|
||||
const router = new VueRouter({
|
||||
mode: 'hash',
|
||||
routes: routes({ mobile: true, componentMap }),
|
||||
scrollBehavior(to, from, savedPosition) {
|
||||
return savedPosition || { x: 0, y: 0 };
|
||||
}
|
||||
});
|
||||
|
||||
router.afterEach(() => {
|
||||
if (!router.currentRoute.redirectedFrom) {
|
||||
Vue.nextTick(() => window.syncPath());
|
||||
}
|
||||
});
|
||||
|
||||
window.vueRouter = router;
|
||||
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Vue.config.productionTip = false;
|
||||
}
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
render: h => h(App),
|
||||
router
|
||||
});
|
||||
@ -1,84 +0,0 @@
|
||||
import Vue from 'vue';
|
||||
import docConfig from './doc.config';
|
||||
import DemoList from './components/DemoList';
|
||||
import { demoWrapper } from './mobile/demo-common';
|
||||
import { initIframeRouter } from './utils/iframe-router';
|
||||
|
||||
initIframeRouter();
|
||||
|
||||
const registerRoute = ({ mobile, componentMap }) => {
|
||||
const route = [
|
||||
{
|
||||
path: '*',
|
||||
redirect: () => `/${Vue.prototype.$vantLang}/`
|
||||
}
|
||||
];
|
||||
|
||||
Object.keys(docConfig).forEach(lang => {
|
||||
if (mobile) {
|
||||
route.push({
|
||||
path: `/${lang}`,
|
||||
component: DemoList,
|
||||
meta: { lang }
|
||||
});
|
||||
} else {
|
||||
route.push({
|
||||
path: `/${lang}`,
|
||||
redirect: `/${lang}/intro`
|
||||
});
|
||||
}
|
||||
|
||||
function addRoute(page, lang) {
|
||||
let { path } = page;
|
||||
if (path) {
|
||||
path = path.replace('/', '');
|
||||
|
||||
let component;
|
||||
if (mobile) {
|
||||
const module = componentMap[`./${path}/demo/index.vue`];
|
||||
|
||||
if (module) {
|
||||
component = demoWrapper(module, path);
|
||||
}
|
||||
} else {
|
||||
const module =
|
||||
componentMap[`./${path}/README.${lang}.md`] ||
|
||||
componentMap[`./${path}/README.md`] ||
|
||||
componentMap[`./${path}.${lang}.md`];
|
||||
|
||||
component = module.default;
|
||||
}
|
||||
|
||||
if (!component) {
|
||||
return;
|
||||
}
|
||||
|
||||
route.push({
|
||||
component,
|
||||
name: `${lang}/${path}`,
|
||||
path: `/${lang}/${path}`,
|
||||
meta: {
|
||||
lang,
|
||||
name: path,
|
||||
title: page.title
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
const navs = docConfig[lang].nav || [];
|
||||
navs.forEach(nav => {
|
||||
if (nav.groups) {
|
||||
nav.groups.forEach(group => {
|
||||
group.list.forEach(page => addRoute(page, lang));
|
||||
});
|
||||
} else {
|
||||
addRoute(nav, lang);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
return route;
|
||||
};
|
||||
|
||||
export default registerRoute;
|
||||
@ -1,18 +0,0 @@
|
||||
// component mixin
|
||||
import { get } from '../../../src/utils';
|
||||
import { camelize } from '../../../src/utils/format/string';
|
||||
|
||||
export default {
|
||||
computed: {
|
||||
$t() {
|
||||
const { name } = this.$options;
|
||||
const prefix = name ? camelize(name) + '.' : '';
|
||||
const messages = this.$vantMessages[this.$vantLang];
|
||||
|
||||
return (path, ...args) => {
|
||||
const message = get(messages, prefix + path) || get(messages, path);
|
||||
return typeof message === 'function' ? message(...args) : message;
|
||||
};
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -1,40 +0,0 @@
|
||||
/**
|
||||
* 同步父窗口和 iframe 的 vue-router 状态
|
||||
*/
|
||||
|
||||
import { setLang } from './lang';
|
||||
import { iframeReady, isMobile } from '.';
|
||||
|
||||
export function initIframeRouter() {
|
||||
window.syncPath = function () {
|
||||
const router = window.vueRouter;
|
||||
const isInIframe = window !== window.top;
|
||||
const currentDir = router.history.current.path;
|
||||
const pathParts = currentDir.split('/');
|
||||
let lang = pathParts[0];
|
||||
if (currentDir[0] === '/') {
|
||||
lang = pathParts[1];
|
||||
}
|
||||
|
||||
if (!isInIframe && !isMobile) {
|
||||
const iframe = document.querySelector('iframe');
|
||||
if (iframe) {
|
||||
iframeReady(iframe, () => {
|
||||
iframe.contentWindow.changePath(lang, currentDir);
|
||||
});
|
||||
}
|
||||
setLang(lang);
|
||||
} else if (isInIframe) {
|
||||
window.top.changePath(lang, currentDir);
|
||||
}
|
||||
};
|
||||
|
||||
window.changePath = function (lang, path = '') {
|
||||
setLang(lang);
|
||||
|
||||
// should preserve hash for anchor
|
||||
if (window.vueRouter.currentRoute.path !== path) {
|
||||
window.vueRouter.replace(path).catch(() => {});
|
||||
}
|
||||
};
|
||||
}
|
||||
@ -1,33 +0,0 @@
|
||||
function iframeReady(iframe, callback) {
|
||||
const doc = iframe.contentDocument || iframe.contentWindow.document;
|
||||
const interval = () => {
|
||||
if (iframe.contentWindow.changePath) {
|
||||
callback();
|
||||
} else {
|
||||
setTimeout(() => {
|
||||
interval();
|
||||
}, 50);
|
||||
}
|
||||
};
|
||||
|
||||
if (doc.readyState === 'complete') {
|
||||
interval();
|
||||
} else {
|
||||
iframe.onload = interval;
|
||||
}
|
||||
}
|
||||
|
||||
const ua = navigator.userAgent.toLowerCase();
|
||||
const isMobile = /ios|iphone|ipod|ipad|android/.test(ua);
|
||||
|
||||
function importAll(map, r) {
|
||||
r.keys().forEach(key => {
|
||||
map[key] = r(key);
|
||||
});
|
||||
}
|
||||
|
||||
export {
|
||||
isMobile,
|
||||
importAll,
|
||||
iframeReady
|
||||
};
|
||||
@ -1,45 +0,0 @@
|
||||
import Locale from '../../../src/locale';
|
||||
import zhCN from '../../../src/locale/lang/zh-CN';
|
||||
import enUS from '../../../src/locale/lang/en-US';
|
||||
|
||||
const langMap = {
|
||||
'en-US': {
|
||||
title: 'Vant - Mobile UI Components built on Vue',
|
||||
messages: enUS
|
||||
},
|
||||
'zh-CN': {
|
||||
title: 'Vant - 轻量、可靠的移动端 Vue 组件库',
|
||||
messages: zhCN
|
||||
}
|
||||
};
|
||||
|
||||
let currentLang = '';
|
||||
|
||||
function getDefaultLang() {
|
||||
const langs = Object.keys(langMap);
|
||||
const { hash } = location;
|
||||
|
||||
for (let i = 0; i < langs.length; i++) {
|
||||
if (hash.indexOf(langs[i]) !== -1) {
|
||||
return langs[i];
|
||||
}
|
||||
}
|
||||
|
||||
const userLang = localStorage.getItem('VANT_LANGUAGE') || navigator.language || 'en-US';
|
||||
return userLang.indexOf('zh-') !== -1 ? 'zh-CN' : 'en-US';
|
||||
}
|
||||
|
||||
export function setLang(lang) {
|
||||
if (currentLang === lang) {
|
||||
return;
|
||||
}
|
||||
|
||||
currentLang = lang;
|
||||
if (window.localStorage) {
|
||||
localStorage.setItem('VANT_LANGUAGE', lang);
|
||||
}
|
||||
Locale.use(lang, langMap[lang].messages);
|
||||
document.title = langMap[lang].title;
|
||||
}
|
||||
|
||||
setLang(getDefaultLang());
|
||||
@ -58,7 +58,6 @@ export default {
|
||||
},
|
||||
|
||||
data() {
|
||||
console.log(this.config);
|
||||
return {
|
||||
showVersionPop: false
|
||||
};
|
||||
|
||||
@ -12,8 +12,10 @@ if (process.env.NODE_ENV !== 'production') {
|
||||
Vue.component(DemoBlock.name, DemoBlock);
|
||||
Vue.component(DemoSection.name, DemoSection);
|
||||
|
||||
new Vue({
|
||||
el: '#app',
|
||||
render: h => h(App),
|
||||
router
|
||||
});
|
||||
setTimeout(() => {
|
||||
new Vue({
|
||||
el: '#app',
|
||||
render: h => h(App),
|
||||
router
|
||||
});
|
||||
}, 0);
|
||||
|
||||
5
webpack.config.js
Normal file
5
webpack.config.js
Normal file
@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
entry: {
|
||||
'site-mobile': ['./docs/site/mobile']
|
||||
},
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user