07b9e059 by simon

1.vuejs基础工程

0 parents
1 > 1%
2 last 2 versions
1 NODE_ENV = 'production'
2 VUE_APP_TITLE = 'production'
...\ No newline at end of file ...\ No newline at end of file
1 NODE_ENV = 'production'
2 VUE_APP_TITLE = 'fev'
...\ No newline at end of file ...\ No newline at end of file
1 module.exports = {
2 root: true,
3 env: {
4 node: true
5 },
6 'extends': [
7 'plugin:vue/essential',
8 // 'eslint:recommended'
9 ],
10 rules: {
11 'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
12 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
13 "no-unused-vars": 'off'
14 },
15 parserOptions: {
16 parser: 'babel-eslint'
17 }
18 }
1 .DS_Store
2 node_modules
3 /dist
4 /fev
5
6 # local env files
7 .env.local
8 .env.*.local
9
10 # Log files
11 npm-debug.log*
12 yarn-debug.log*
13 yarn-error.log*
14
15 # Editor directories and files
16 .idea
17 .vscode
18 *.suo
19 *.ntvs*
20 *.njsproj
21 *.sln
22 *.sw?
1 # vue-cli3-framework
2
3 ## Project setup
4 ```
5 npm install
6 ```
7
8 ### Compiles and hot-reloads for development
9 ```
10 npm run serve
11 ```
12
13 ### Compiles and minifies for production
14 ```
15 npm run build
16 ```
17
18 ### Run your tests
19 ```
20 npm run test
21 ```
22
23 ### Lints and fixes files
24 ```
25 npm run lint
26 ```
27
28 ### Customize configuration
29 See [Configuration Reference](https://cli.vuejs.org/config/).
1 module.exports = {
2 presets: [
3 '@vue/app'
4 ]
5 }
1 /**
2 * Created by pc on 2018/5/11.
3 * 需要的库为(co, ali-oss, glob)
4 * npm i co ali-oss glob --save
5 * ossConfig.json格式如下
6 {
7 "region": "oss-cn-shanghai", //OSS region
8 "accessKeyId": "XXXXXXXX", //OSS accessKeyId
9 "accessKeySecret": "XXXXXXXX", //OSS accessKeySecret
10 "bucket": "ogo", //OSS bucket
11 "localPath": "./dist/**", //本地需要上传的文件目录,(/**)为遍历根号后所有目录
12 "ossPath": "/mobile/", //oss线上文件目录(不能为根目录,避免误操作,最后加上'/')
13 "callbackUrl": "http://nodejs.org/dist/index.json" //预留请求服务器更新缓存的API
14 }
15 *
16 *
17 */
18
19 let co = require('co')
20 let OSS = require('ali-oss')
21 let glob = require('glob')
22 let http = require('http')
23 let Config = require('./ossConfig.json')
24
25 // 配置oss信息
26 let client = new OSS({
27 region: Config.region,
28 accessKeyId: Config.accessKeyId,
29 accessKeySecret: Config.accessKeySecret,
30 bucket: Config.bucket
31 })
32
33 // 删除线上目录
34 function deleteFiles() {
35 if (Config.ossPath !== '' && Config.ossPath !== '/') {
36 co(function* () {
37 let result = yield client.list({
38 prefix: Config.ossPath.slice(1, -1),
39 marker: Config.ossPath.slice(0, -1)
40 })
41 let index = 0
42 if (result.objects !== undefined) {
43 yield result.objects.map(i => {
44 co(function* () {
45 yield client.delete(i.name)
46 index += 1
47 if (index === result.objects.length) {
48 console.log(`全部删除成功~,总共${result.objects.length}个文件`)
49 uploadFiles()
50 }
51 })
52 })
53 } else {
54 uploadFiles()
55 }
56 }).catch(function (err) {
57 console.log(err)
58 })
59 } else {
60 console.error('上传失败,线上路径为根目录~')
61 }
62 }
63
64 function uploadFiles() {
65 // 遍历目录树之后上传
66 glob(Config.localPath, {
67 nodir: true
68 }, (er, files) => {
69 let index = 0
70 files.map(i => {
71 co(function* () {
72 let ossPath = Config.ossPath.substr(Config.ossPath.length - 1, 1) === '/' ? Config.ossPath.slice(0, -1) : Config.ossPath
73 yield client.put(ossPath + i.slice(6), i)
74 index += 1
75 if (index === files.length) {
76 consoleStr(files.length)
77 }
78 }).catch(function (err) {
79 console.error(err.params.object)
80 })
81 })
82 })
83 }
84
85 function consoleStr(length) {
86 console.log(`全部上传成功~,总共${length}个文件`)
87 // http.get(Config.callbackUrl, () => {
88 // console.log('更新缓存成功~')
89 // }).on('error', (e) => {
90 // console.error(`错误: ${e.message}`)
91 // })
92 }
93
94 // 清空目录后上传
95 // deleteFiles()
96
97 // 增量上传
98 uploadFiles()
...\ No newline at end of file ...\ No newline at end of file
1
2 {
3 "region": "oss-cn-shenzhen",
4 "accessKeyId": "LTAIhDZsL5yCN90c",
5 "accessKeySecret": "LIj3OEJ8cMCQeRlUVVznJpMek2dPD2",
6 "bucket": "kdcdn",
7 "localPath": "./dist/**",
8 "ossPath": "/app/rtdn/",
9 "callbackUrl": "http://nodejs.org/dist/index.json"
10 }
11
...\ No newline at end of file ...\ No newline at end of file
This diff could not be displayed because it is too large.
1 {
2 "name": "vue-cli3-framework",
3 "version": "0.1.0",
4 "private": true,
5 "scripts": {
6 "serve": "vue-cli-service serve",
7 "dev": "vue-cli-service serve",
8 "build": "vue-cli-service build",
9 "fev": "vue-cli-service build --mode fev",
10 "lint": "vue-cli-service lint",
11 "oss": "node build/oss-released.js"
12 },
13 "dependencies": {
14 "ali-oss": "^6.1.1",
15 "amfe-flexible": "^2.2.1",
16 "axios": "^0.19.0",
17 "axios-mock-adapter": "^1.16.0",
18 "co": "^4.6.0",
19 "core-js": "^2.6.5",
20 "glob": "^7.1.4",
21 "mockjs": "^1.0.1-beta3",
22 "postcss-pxtorem": "^4.0.1",
23 "vue": "^2.6.10",
24 "vue-router": "^3.0.3",
25 "vuex": "^3.0.1"
26 },
27 "devDependencies": {
28 "@vue/cli-plugin-babel": "^3.8.0",
29 "@vue/cli-plugin-eslint": "^3.8.0",
30 "@vue/cli-service": "^3.8.0",
31 "babel-eslint": "^10.0.1",
32 "eslint": "^5.16.0",
33 "eslint-plugin-vue": "^5.0.0",
34 "node-sass": "^4.12.0",
35 "sass-loader": "^7.1.0",
36 "vue-template-compiler": "^2.6.10"
37 }
38 }
1 module.exports = {
2 plugins: {
3 'autoprefixer': {
4 browsers: ['Android >= 4.0', 'iOS >= 7']
5 },
6 'postcss-pxtorem': {
7 rootValue: 75,
8 propList: ['*'],
9 selectorBlackList: []
10 }
11 }
12 }
...\ No newline at end of file ...\ No newline at end of file
No preview for this file type
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="width=device-width,initial-scale=1.0">
7 <link rel="icon" href="<%= BASE_URL %>favicon.ico">
8 <title>vue-cli3-framework</title>
9 </head>
10 <body>
11 <noscript>
12 <strong>We're sorry but vue-cli3-framework doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
13 </noscript>
14 <div id="app"></div>
15 <!-- built files will be auto injected -->
16 </body>
17 </html>
1 <template>
2 <div id="app">
3 <!-- <div id="nav">
4 <router-link to="/">Home</router-link> |
5 <router-link to="/about">About</router-link>
6 </div>-->
7 <router-view/>
8 </div>
9 </template>
10
11 <style lang="scss">
12 @import './styles/support.scss';
13
14 #app {
15 /* font-family: 'Avenir', Helvetica, Arial, sans-serif;
16 -webkit-font-smoothing: antialiased;
17 -moz-osx-font-smoothing: grayscale;
18 text-align: center;
19 color: #2c3e50;
20 margin-top: 60px; */
21 border: 0;
22 margin: 0;
23 padding: 0;
24 }
25
26 body,
27 div {
28 border: 0;
29 margin: 0;
30 padding: 0;
31 }
32
33 .app__width {
34 width: 750px;
35 }
36
37 .app__width {
38 width: 750px;
39 }
40
41 .app__inner {
42 margin: 20px;
43 }
44
45 .app__title {
46 font-size: $fontSize;
47 line-height: $fontSize + 4px;
48 font-weight: bold;
49 padding-bottom: 10px;
50 margin-bottom: 20px;
51 border-bottom: 0.5px solid #eeeeee;
52 }
53
54 .app__desc {
55 font-size: $fontSizeSmaller;
56 line-height: $fontSizeSmaller + 2px;
57 margin-bottom: 20px;
58 color: $colorGray;
59 }
60
61 .app__bgc {
62 position: fixed;
63 background-color: #ffffff;
64 width: 100%;
65 height: 100%;
66 }
67
68 .app__bg {
69 position: absolute;
70 width: 100%;
71 height: 100%;
72 }
73
74 .app__top-shadow {
75 position: fixed;
76 width: 750px;
77 height: 1px;
78 box-shadow: 0px 4px 0.9px 0.1px rgba(6, 0, 1, 0.07);
79 background-color: #ffffff;
80 }
81
82 .app__content {
83 position: relative;
84 }
85
86
87 </style>
1 module.exports = {
2 testListGet: '/xxx/xxx/list'
3 }
...\ No newline at end of file ...\ No newline at end of file
1 import axios from 'axios';
2 // import {
3 // Toast
4 // } from 'vant';
5
6 function Toast(msg) {
7 console.log("msg:", msg);
8 }
9
10 // axios的默认url
11 // axios.defaults.baseURL = ""
12
13 // 服务器地址
14 let base = "https://ow.go.qudone.com";
15 if (location.href.indexOf("//k.wxpai.cn") > 0) {
16 base = "https://api.k.wxpai.cn/bizproxy"
17 }
18 // let base = COM.baseUrl;
19
20 // 请求拦截器
21 // axios.interceptors.request.use(
22 // config => {
23 // // 每次发送请求之前判断是否存在token,如果存在,则统一在http请求的header都加上token,不用每次请求都手动添加了
24 // // 即使本地存在token,也有可能token是过期的,所以在响应拦截器中要对返回状态进行判断
25 // const token = "token"; //这里写入token
26 // token && (config.headers.Authorization = token);
27 // return config;
28 // },
29 // error => {
30 // return Promise.error(error);
31 // })
32
33 // 响应拦截器
34 axios.interceptors.response.use(
35 response => {
36 if (response.status === 200) {
37 if (response.data.code === 200) {
38 return Promise.resolve(response);
39 } else {
40 Toast(response.data.bizMsg);
41 return Promise.reject(response);
42 }
43 } else {
44 return Promise.reject(response);
45 }
46 },
47 // 服务器状态码不是200的情况
48 error => {
49 if (error.response.status) {
50 switch (error.response.status) {
51 // 401: 未登录
52 // 未登录则跳转登录页面,并携带当前页面的路径
53 // 在登录成功后返回当前页面,这一步需要在登录页操作。
54 case 401:
55 router.replace({
56 path: '/login',
57 query: {
58 redirect: router.currentRoute.fullPath
59 }
60 });
61 break;
62 // 403 token过期
63 // 登录过期对用户进行提示
64 // 清除本地token和清空vuex中token对象
65 // 跳转登录页面
66 case 403:
67 Toast({
68 message: '登录过期,请重新登录',
69 duration: 1000,
70 forbidClick: true
71 });
72 // 清除token
73 localStorage.removeItem('token');
74 store.commit('loginSuccess', null);
75 // 跳转登录页面,并将要浏览的页面fullPath传过去,登录成功后跳转需要访问的页面
76 setTimeout(() => {
77 router.replace({
78 path: '/login',
79 query: {
80 redirect: router.currentRoute.fullPath
81 }
82 });
83 }, 1000);
84 break;
85 // 404请求不存在
86 case 404:
87 Toast({
88 message: '网络请求不存在',
89 duration: 1500,
90 forbidClick: true
91 });
92 break;
93 // 其他错误,直接抛出错误提示
94 default:
95 Toast({
96 message: error.response.data.message,
97 duration: 1500,
98 forbidClick: true
99 });
100 }
101 return Promise.reject(error.response);
102 }
103 }
104 );
105
106 //formDataHeaders设置
107 let formDataHeaders = {
108 headers: {
109 "Content-Type": "multipart/form-data"
110 }
111 }
112
113 /**
114 * 封装get方法
115 * @param {*} params
116 */
117 export const httpGet = params => {
118 let {
119 url,
120 data
121 } = params;
122 return axios.get(`${base}${url}`, {
123 params: data
124 }).then(res => res.data.content);
125 }
126
127 /**
128 * 封装post方法
129 * @param {*} params
130 */
131 export const httpPost = params => {
132 let {
133 url,
134 data
135 } = params;
136 return axios.post(`${base}${url}`, data).then(res => res.data.content);
137 }
138
139
140 /**
141 * 封装post方法
142 * @param {*} params
143 * data数据是 formdata格式
144 * 例如:
145 * this.file = file
146 let data = new FormData() //使用formData对象
147 data.append('path', '/pro/mzczcradmin/')
148 data.append('file', file.file)
149 */
150 export const formdata = params => {
151 let {
152 url,
153 data
154 } = params;
155 return axios.post(`${base}${url}`, data, formDataHeaders).then(res => res.data);
156 }
...\ No newline at end of file ...\ No newline at end of file
1 import * as api from './api';
2
3 export default api;
1 // @font-face {
2 // font-family: 'vivo-BoldExtended';
3 // src: url('./vivo-BoldExtended.ttf');
4 // font-weight: normal;
5 // font-style: normal;
6 // }
7 // @font-face {
8 // font-family: 'vivo-Regular';
9 // src: url('./vivo-Regular.ttf');
10 // font-weight: normal;
11 // font-style: normal;
12 // }
13 // @font-face {
14 // font-family: 'regular2';
15 // src: url('./regular2.otf');
16 // font-weight: normal;
17 // font-style: normal;
18 // }
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="bottom-tips" v-if="visb">
3 <div class="line"></div>
4 <div class="tips-wrap">
5 <div class="tips">{{innerText ? innerText :'我是有底线的'}}</div>
6 </div>
7 </div>
8 </template>
9
10 <script>
11 export default {
12 props: ['visb', 'innerText'],
13 data() {
14 return {
15 key: 'value'
16 }
17 },
18 created() {
19 console.log('visb:', this.visb)
20 }
21 }
22 </script>
23
24 <style lang="less" scoped>
25 /// 底线
26 .bottom-tips {
27 position: relative;
28 padding: 40px 0;
29 width: 100%;
30 text-align: center;
31 color: #666666;
32
33 .line {
34 border-bottom: dashed 1px #cccccc;
35 width: 80%;
36 position: absolute;
37 top: 50%;
38 left: 0;
39 right: 0;
40 margin: 0 auto;
41 }
42
43 .tips-wrap {
44 font-size: 28px;
45 display: flex;
46 justify-content: center;
47 .tips {
48 position: relative;
49 padding: 0 20px;
50 background-color: #ffffff;
51 }
52 }
53 }
54 </style>
1 <template>
2 <div class="empty-tips" v-if="visb">
3 <div class="tips">
4 <span class="iconfont iconempty"></span>
5 <div class="tips">{{innerText ? innerText :'这里空空如也~'}}</div>
6 </div>
7 </div>
8 </template>
9
10 <script>
11 export default {
12 props: ['visb', 'innerText'],
13 data() {
14 return {
15 key: 'value'
16 }
17 }
18 }
19 </script>
20
21 <style lang="scss" scoped>
22 .empty-tips {
23 box-sizing: border-box;
24 position: fixed;
25 text-align: center;
26 color: #666666;
27 font-size: 32px;
28 width: 100%;
29 height: 100%;
30 display: flex;
31 justify-content: center;
32 top: 35%;
33
34 .iconfont {
35 font-size: 100px;
36 }
37
38 .tips {
39 position: relative;
40 padding: 20px;
41 }
42 }
43 </style>
1 // 全局事件
2 module.exports = {
3 NAV_FILTER: '_nav_filter', // 导航菜单过滤,触发请求
4 TAB_SELECT: '_tab_select', // 选择tab ,主题 classify
5 EVT_SET_TAB_INDEX: '_evt_set_tab_index', // 选择tab ,主题 classify
6 EVT_TAB_INDEX_CHANGE: '_evt_tab_index_change', // 从navbar发至index 点击头部导航 index
7 }
8
...\ No newline at end of file ...\ No newline at end of file
1 import Vue from 'vue'
2 import App from './App.vue'
3 import router from './router'
4 import store from './store'
5
6 import Mock from './mock'
7 Mock.bootstrap();
8
9 import 'amfe-flexible';
10
11
12
13 Vue.config.productionTip = false
14
15 new Vue({
16 router,
17 store,
18 render: h => h(App)
19 }).$mount('#app')
...\ No newline at end of file ...\ No newline at end of file
1 import Mock from 'mockjs';
2 const LoginUsers = [
3 {
4 id: 1,
5 username: 'admin',
6 password: 'admin',
7 avatar: 'https://raw.githubusercontent.com/taylorchen709/markdown-images/master/vueadmin/user.png',
8 name: '张某某'
9 }
10 ];
11
12 const Users = [];
13
14 for (let i = 0; i < 5; i++) {
15 Users.push(Mock.mock({
16 id: Mock.Random.guid(),
17 province: Mock.Random.province(),
18 city: Mock.Random.city(),
19 fieldName: Mock.Random.cname(),
20 address: Mock.mock('@county(true)'),
21 'age|18-60': 1,
22 birth: Mock.Random.date(),
23 sex: Mock.Random.integer(0, 1)
24 }));
25 }
26
27 export { LoginUsers, Users };
1 import mock from './mock';
2
3 export default mock;
1 import axios from 'axios';
2 import MockAdapter from 'axios-mock-adapter';
3 import {
4 LoginUsers,
5 Users
6 } from './data/user';
7 let _Users = Users;
8
9 export default {
10 /**
11 * mock bootstrap
12 */
13 bootstrap() {
14 return;
15 // 紧在dev环境下使用
16 if (process.env.NODE_ENV !== "development") {
17 return;
18 }
19 let mock = new MockAdapter(axios);
20
21 // mock success request
22 mock.onGet('/success').reply(200, {
23 msg: 'success'
24 });
25
26 // mock error request
27 mock.onGet('/error').reply(500, {
28 msg: 'failure'
29 });
30
31 // 拦截 get方法demo
32 mock.onGet('/path1/path2/getdemo').reply(config => {
33 // 拦截参数
34 let {
35 params1,
36 params2
37 } = config.params;
38 return new Promise((resolve, reject) => {
39 let content = {};
40 let success = true;
41 resolve([200, {
42 code: 2000,
43 msg: '请求成功',
44 success,
45 content
46 }]);
47 });
48 });
49
50 // 拦截post方法demo
51 mock.onPost('/path1/path2/postdemo').reply(config => {
52 let {
53 params1,
54 params2
55 } = JSON.parse(config.data);
56 return new Promise((resolve, reject) => {
57 let content = {};
58 let success = true;
59 resolve([200, {
60 code: 2000,
61 msg: '请求成功',
62 success,
63 content
64 }]);
65 });
66 });
67
68 }
69 };
1 <template>
2 <div class="about">
3 <h1>This is an about page</h1>
4 <div class="cc">
5 <div class="ddd"></div>
6 </div>
7 </div>
8 </template>
9
10 <style lang="scss" scoped>
11 .cc {
12 .ddd {
13 width: 746px;
14 height: 300px;
15 background-color: wheat;
16 }
17 }
18 </style>
19
1 <template>
2 <div class="home">home</div>
3 </template>
4
5 <script>
6 export default {
7 name: 'home'
8 }
9 </script>
10
11 <style lang="scss" scoped>
12 .home {
13 text-align: center;
14 }
15 </style>
1 import api from '../../api/api'
2 import {
3 httpGet,
4 httpPost
5 } from '../../api/fetch-api.js'
6
7 export default {
8 data() {
9 return {
10 key: 'value'
11 }
12 },
13 components: {},
14 methods: {
15 initData() {}
16 },
17 mounted() {},
18 created() {
19 console.log("demo created");
20 }
21 }
...\ No newline at end of file ...\ No newline at end of file
1 @import './../../styles/support';
1
2 <template>
3 <div class="page">
4 <div class="app__bgc bgc"></div>
5 <div class="app__bg bg"></div>
6 <div class="app__content main">
7 <div class="top-space"></div>
8 <div class="content">
9 <span class="iconfont iconclose">demo</span>
10 </div>
11 </div>
12 </div>
13 </template>
14
15 <script src="./index.js"></script>
16 <style lang="scss" scoped>
17 // @import './index.scss';
18 </style>
...\ No newline at end of file ...\ No newline at end of file
1 import Vue from 'vue'
2 import Router from 'vue-router'
3 import Home from './pages/Home.vue'
4
5 Vue.use(Router)
6
7 const routes = [{
8 path: '/',
9 name: 'home',
10 component: Home,
11 meta: {
12 title: '首页'
13 }
14 },
15 {
16 path: '/demo',
17 name: 'demo',
18 component: () => import('./pages/demo/index.vue'),
19 meta: {
20 title: '模板'
21 }
22 },
23 {
24 path: '/about',
25 name: 'about',
26 component: () => import('./pages/About.vue'),
27 meta: {
28 title: '关于'
29 }
30 }
31 ]
32
33 // add route path
34 routes.forEach(route => {
35 route.path = route.path || '/' + (route.name || '');
36 });
37
38 const router = new Router({
39 routes
40 });
41
42 router.beforeEach((to, from, next) => {
43 const title = to.meta && to.meta.title;
44 if (title) {
45 document.title = title;
46 }
47 next();
48 });
49
50 export default router;
...\ No newline at end of file ...\ No newline at end of file
1 import Vue from 'vue'
2 import Vuex from 'vuex'
3
4 Vue.use(Vuex)
5
6 export default new Vuex.Store({
7 state: {
8
9 },
10 mutations: {
11
12 },
13 actions: {
14
15 }
16 })
1 /* 图片字体 */
2 @font-face {
3 font-family: 'iconfont';
4 src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAASEAAsAAAAACSAAAAQ3AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDSAqFGIQnATYCJAMYCw4ABCAFhG0HVBvZBxGVnNvIfhzYDV+BAe9wtJiGONTGYuHBZ/Oh77Q3OxupItOeFFTcQjpRXwK+AIbn08ne766XppsiwRKPksQTj7AO4xAOv3fOAdsJc0KNZO3Io89Lf8K9BkY+ce+4df4Dms+yXMacNNbEAOOAAtrbF1mBxAlqy/Dq8uqwrgMBiPGAD4g6dbgGQhSseQRAKstK8iFMmFAVBMHSdsFWFpkNHhYzhbkEYJb3efIGQUQIDCaFtXQ0l1KEhOfKV+G019Ary7GgbzgHAGEXUIAPABZIZ6GrGTSI+oBia7/A4gVAioWBeq58vvHlkJeNr8INBhIyy0dwwV8esJg4MBAgfGCVlKUNj/HguZIawGrqjZgLPHg5xACK1Y2YCwy8Cpdclo4/YIMIcBLANZh9YGkIPHta2NorTKxUSlUNV7Koz2zswo0mRfNNRs9fbFq8YJr5uEXLWo7cEd+6pbl9W3v3rj4g7tzRpU+7HauR0YbmJ2+dalLELZy6ude0uGh+75Zp5iXFCxZMW2Q+0IQOKsa7SMJIKH18h3y9hWY+mN4tEtW0bYT2memWpk1db7L81tQ7dgs3isUbt1rrl0kU0yy1Sza7ZCw0m4lCIzFMF2ww15+Qp1u43sRk/hJT7YJN5uaLluolPZSTvq1m4vmbgR7veM116OjBGp2K21oMbkRGnvqglnCLVharuAM6gl+toTNYPZs5doyZDXyHbx/RSvZMt6tNtx7RlzkWlcysWQySV2I+Pio008Np8mQvL/j0CEVLLIItloiEIPIFnCBDN7ZpC6n3i/erE0uXICT/t+269rVrjx4de+wrwynfjo1BaN/tXQmzJ3wIF9krghUHqN1eFB4fMvuCROrnvVwdkUeWLff2k70IiO8fs2yOabXpHHdlvX+A5rmK6dx4piXlbHunib+iNeVM+UnXFvWZjR2uleVF/jsbK12wo8OWDpY+TRH0jP8syLs0WIlOAIDhFHOP+gIA1TF3kCOBOcbaj9FjgYCJ97CEFvwt35GfKZ2Yq4j5JiGUsAC+Juu7saSZavDK1Wgs/jeaagB/Q0WUsuYutTOdIKDlmTLhATa03MskN0+G0t1vcjyETCMMArY4CLmQiuaDSSIETSgem7dBu0/G6o2REgGeJiAQSrvAkDsKSukyiaU9Bo+Zd+BTZgwxXdZHSrjFro4ZoqKlgj+VSe4UsdaVX3iDfgeR41KP8UIuNkCBfgHpxBUd8hArGj760FgVcZkjpaLbEAJTbWYHWTeltfaNvz9X9KJNIcfBSrIMhApapMAfKSOxjnJ6V6vM+29AewuEXNFR432BrLCDk0B+AhqQrqquUceljG7woR00qhQ7i5OxiKRiBwSIMlJbPMkBqdoo7RDuNfyZblxT1WZ6TbzLfbBZ53QYQglLeIRPBBB9hPTHH9oLMhQ5r5ipDFwwMRwxRezrfzAAAA==')
5 format('woff2');
6 }
7
8 .iconfont {
9 font-family: 'iconfont' !important;
10 font-size: 16px;
11 font-style: normal;
12 -webkit-font-smoothing: antialiased;
13 -moz-osx-font-smoothing: grayscale;
14 }
15
16 .iconrefresh:before {
17 content: '\e874';
18 }
19
20 .iconempty:before {
21 content: '\e6a6';
22 }
23 .iconclose:before {
24 content: '\e849';
25 }
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * ------------------------------------------------------------------
3 * Sass Minxins
4 *
5 * 参考收集:
6 * https://github.com/twbs/bootstrap-sass/tree/master/assets/stylesheets/bootstrap/mixins
7 * ------------------------------------------------------------------
8 *
9 */
10
11 // 文字截取
12 @mixin text-overflow() {
13 overflow: hidden;
14 white-space: normal;
15 text-overflow: ellipsis;
16 word-break: break-all;
17 word-wrap: normal;
18 }
19
20 @mixin word-break() {
21 word-break: break-all;
22 word-wrap: break-word;
23 white-space: normal;
24 }
25
26 // No wrap
27 @mixin no-wrap() {
28 word-break: normal;
29 word-wrap: normal;
30 white-space: nowrap;
31 }
32
33 // 清除浮动
34 @mixin clearfix() {
35 &:before,
36 &:after {
37 content: " "; // 1
38 display: table; // 2
39 }
40 &:after {
41 clear: both;
42 }
43 }
44
45 // Single side border-radius
46 @mixin border-top-radius($radius) {
47 border-top-right-radius: $radius;
48 border-top-left-radius: $radius;
49 }
50
51 @mixin border-right-radius($radius) {
52 border-bottom-right-radius: $radius;
53 border-top-right-radius: $radius;
54 }
55
56 @mixin border-bottom-radius($radius) {
57 border-bottom-right-radius: $radius;
58 border-bottom-left-radius: $radius;
59 }
60
61 @mixin border-left-radius($radius) {
62 border-bottom-left-radius: $radius;
63 border-top-left-radius: $radius;
64 }
65
66 // Center-align a block level element
67 @mixin center-block() {
68 display: block;
69 margin-left: auto;
70 margin-right: auto;
71 }
72
73 // CSS image replacement
74 // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
75 @mixin hide-text() {
76 font-size: 0;
77 line-height: 0;
78 color: transparent;
79 text-shadow: none;
80 background-color: transparent;
81 border: 0;
82 }
1 /**
2 * ------------------------------------------------------------------
3 * 支持文件
4 * 需要引用的地方均需要加上这个支持文件
5 *
6 * ------------------------------------------------------------------
7 *
8 */
9
10 @import "mixins";
11
12 @import "var";
13
14 // 图标字体
15 @import "fonticon";
16
17 // 字体引入
18 @import './../assets/fonts/font.scss'
...\ No newline at end of file ...\ No newline at end of file
1 /**
2 * ------------------------------------------------------------------
3 * 原子类
4 *
5 * ------------------------------------------------------------------
6 *
7 */
8 @import "support";
9
10 // Margin
11 .u-mt-smaller {
12 margin-top: $marginTopSmaller;
13 }
14
15 .u-mt-small {
16 margin-top: $marginTopSmall;
17 }
18
19 .u-mt-medium {
20 margin-top: $marginTopMedium;
21 }
22
23 .u-mt-large {
24 margin-top: $marginTopLarge;
25 }
26
27 .u-mt-larger {
28 margin-top: $marginTopLarger;
29 }
30
31 .u-mb-smaller {
32 margin-bottom: $marginTopSmaller;
33 }
34
35 .u-mb-small {
36 margin-bottom: $marginTopSmall;
37 }
38
39 .u-mb-medium {
40 margin-bottom: $marginTopMedium;
41 }
42
43 .u-mb-large {
44 margin-bottom: $marginTopLarge;
45 }
46
47 .u-mb-larger {
48 margin-bottom: $marginTopLarger;
49 }
50
51 // Padding
52 .u-pt-smaller {
53 padding-top: $paddingTopSmaller;
54 }
55
56 .u-pt-small {
57 padding-top: $paddingTopSmall;
58 }
59
60 .u-pt-medium {
61 padding-top: $paddingTopMedium;
62 }
63
64 .u-pt-large {
65 padding-top: $paddingTopLarge;
66 }
67
68 .u-pt-larger {
69 padding-top: $paddingTopLarger;
70 }
71
72 .u-pb-smaller {
73 padding-bottom: $paddingTopSmaller;
74 }
75
76 .u-pb-small {
77 padding-bottom: $paddingTopSmall;
78 }
79
80 .u-pb-medium {
81 padding-bottom: $paddingTopMedium;
82 }
83
84 .u-pb-large {
85 padding-bottom: $paddingTopLarge;
86 }
87
88 .u-pb-larger {
89 padding-bottom: $paddingTopLarger;
90 }
91
92 // 布局方位
93 .u-ta-c {
94 text-align: center !important;
95 }
96
97 .u-ta-l {
98 text-align: left !important;
99 }
100
101 .u-ta-r {
102 text-align: right !important;
103 }
104
105 .u-fl-l {
106 float: left;
107 }
108
109 .u-fl-n {
110 float: none;
111 }
112
113 .u-fl-r {
114 float: right;
115 }
116
117 .u-d-b {
118 display: block;
119 }
120
121 .u-d-i {
122 display: inline !important;
123 }
124
125 .u-d-ib {
126 display: inline-block !important;
127 }
128
129 .u-d-n {
130 display: none !important;
131 }
132
133 .u-d-t {
134 display: table;
135 table-layout: fixed;
136 }
137
138 .u-d-tc {
139 display: table-cell;
140 }
141
142 .u-va-b {
143 vertical-align: bottom;
144 }
145
146 .u-va-m {
147 vertical-align: middle;
148 }
149
150 .u-va-t {
151 vertical-align: top;
152 }
153
154 // clearfix
155 .u-clearfix {
156 @include clearfix;
157 }
158
159 // 虚拟格式
160 .u-cur-d {
161 cursor: default;
162 }
163
164 .u-cur-p {
165 cursor: pointer;
166 }
167
168 // flex
169 .u-flex {
170 display: -webkit-box;
171 display: -webkit-flex;
172 display: flex;
173 }
174
175 .u-flex-item {
176 -webkit-box-flex: 1;
177 -webkit-flex: 1;
178 flex: 1;
179 }
180
181 // 小程序中模拟ul、li
182 .u-ul {
183 padding-left: 30px;
184 text-align: left;
185 display: block;
186 }
187
188 .u-li {
189 position: relative;
190 font-size: $fontSizeSmall;
191 line-height: $fontSizeSmall + 4px;
192 margin-bottom: $marginTopSmall;
193
194 &:before {
195 position: absolute;
196 content: " ";
197 top: 14px;
198 left: -20px;
199 width: 8px;
200 height: 8px;
201 border-radius: 8px;
202 background-color: $colorBlack;
203 }
204 }
1 /**
2 * ------------------------------------------------------------------
3 * Sass 变量
4 *
5 * ------------------------------------------------------------------
6 *
7 */
8
9 // Margin
10 $marginTopSmaller: 20px;
11 $marginTopSmall: 30px;
12 $marginTopMedium: 40px;
13 $marginTopLarge: 60px;
14 $marginTopLarger: 80px;
15
16 // Padding
17 $paddingTopSmaller: 20px;
18 $paddingTopSmall: 30px;
19 $paddingTopMedium: 40px;
20 $paddingTopLarge: 60px;
21 $paddingTopLarger: 80px;
22
23 // Color
24 $colorBlue: #20A0FF;
25 $colorGreen: #13CE66;
26 $colorGray: #475669;
27 $colorBlack: #000;
28 $colorRed: #FF4949;
29 $colorYellow: #F7BA2A;
30
31 $color: #787878;
32 $colorLink: #1D8CE0;
33
34 $backGroundColor: #fff;
35
36 // Font
37 $fontSize: 32px;
38 $fontSizeSmall: 28px;
39 $fontSizeSmaller: 24px;
40 $fontSizeLarge: 36px;
41 $fontSizeLarger: 44px;
1 // 正在表达式
2 export const REGEXPS = {
3 "mobile": /^1\d{10}$/
4 }
5
6 // 验证手机
7 export function checkMobile(str) {
8 return REGEXPS.mobile.test(str);
9 }
10
11 /**
12 * 链接参数转换为obj
13 * 入参 完整链接
14 * @param {*} url
15 */
16 export function param2Obj(url) {
17 const search = url.split('?')[1]
18 if (!search) {
19 return {}
20 }
21 return JSON.parse(
22 '{"' +
23 decodeURIComponent(search)
24 .replace(/"/g, '\\"')
25 .replace(/&/g, '","')
26 .replace(/=/g, '":"') +
27 '"}'
28 )
29 }
30
31
32
33 //获取cookie、
34 export function getCookie(name) {
35 var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
36 if (arr = document.cookie.match(reg))
37 return (arr[2]);
38 else
39 return null;
40 }
41
42 //设置cookie
43 export function setCookie(c_name, value, expiredays) {
44 var exdate = new Date();
45 exdate.setDate(exdate.getDate() + expiredays);
46 document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());
47 };
48
49 //删除cookie
50 export function delCookie(name) {
51 var exp = new Date();
52 exp.setTime(exp.getTime() - 1);
53 var cval = getCookie(name);
54 if (cval != null)
55 document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
56 };
57
58
59 /**
60 * 获取环境信息
61 * @return {Object} 环境信息对象
62 */
63 export function getEnv() {
64 var nav = window.navigator;
65 var env = {
66 "iphone": false,
67 "ipad": false,
68 "android": false,
69 "pc": false,
70 "ios": false,
71 "ver": "0"
72 };
73
74 var ua = nav.userAgent;
75 var android = ua.match(/(Android)\s+([\d.]+)/);
76 var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
77 var iphone = !ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/);
78 if (ipad) {
79 env.ipad = ipad[1] && true || false;
80 env.ver = ipad[2] && ipad[2].replace(/-/g, ".") || "";
81 env.ios = true;
82 } else if (iphone) {
83 env.iphone = iphone[1] && true || false;
84 env.ver = iphone[2] && iphone[2].replace(/-/g, ".") || "";
85 env.ios = true;
86 } else if (android) {
87 env.android = android[1] && true || false;
88 env.ver = android[2];
89 } else {
90 env.pc = true;
91 }
92
93 return env;
94 }
95
96 /**
97 * 设定页面 title
98 * @param {[type]} title [description]
99 */
100 export function setTitle(title) {
101 if (!title) {
102 return;
103 }
104 document.title = title;
105 // if (ENV.ios && navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1) {
106 // 修复微信端IOS无法修改document.title的情况
107 if (getEnv().ios && (navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1 || navigator.userAgent.toLowerCase().indexOf("alipay") !== -1)) {
108 //修复IOS微信端和支付宝无法修改document.title的情况
109 var $iframe = document.createElement('iframe');
110 $iframe.className = "C-hiddenIframe";
111 $iframe.src = "/" + location.pathname.split('/')[1] + "/favicon.ico";
112 $iframe.style.visibility = 'hidden';
113 $iframe.style.width = '1px';
114 $iframe.style.height = '1px';
115 $iframe.onload = function onIframeLoad() {
116 setTimeout(function () {
117 $iframe.onload = null;
118 onIframeLoad = null;
119 document.body.removeChild($iframe);
120 $iframe = null;
121 }, 0);
122 };
123 document.body.appendChild($iframe);
124 }
125 }
126
127 // 为链接添加参数
128 export function addQuery(url, query) {
129 query = query || {}
130 query = (function (query) {
131 var q = []
132 Object.keys(query).forEach(function (_q) {
133 q.push(_q + '=' + query[_q])
134 })
135 return q.join('&')
136 })(query)
137 if (url.indexOf('?') !== -1) {
138 url += '&' + query
139 } else {
140 url += '?' + query
141 }
142 return url
143 }
144
145
146 /**
147 * 获得当前页面的path
148 * @return {String} 页面path
149 */
150 export function getPath() {
151 var path = window.location.hash;
152 path = path || "#/";
153 path = path === "#/" ? "#/index" : path;
154 path = path.split("?");
155 return path[0];
156 }
157
158 // 获取 url 参数
159 export function getQuery(name) {
160 return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null;
161 }
162
163 /**
164 * 把 \n换行符转换成<br>
165 * 转换后需要用 v-html渲染
166 * 用{{}}会当成字符串把 html渲染出来
167 */
168 export function formatBr(str) {
169 str = str.replace(/\n/g, '<br/>')
170 return str
171 };
172
173
174 /**
175 * @desc 函数防抖
176 * @param func 函数
177 * @param wait 延迟执行毫秒数
178 * @param immediate true 表立即执行,false 表非立即执行
179 */
180 export function debounce(func, wait, immediate) {
181 let timeout;
182
183 return function () {
184 let context = this;
185 let args = arguments;
186
187 if (timeout) clearTimeout(timeout);
188 if (immediate) {
189 var callNow = !timeout;
190 timeout = setTimeout(() => {
191 timeout = null;
192 }, wait)
193 if (callNow) func.apply(context, args)
194 } else {
195 timeout = setTimeout(function () {
196 func.apply(context, args)
197 }, wait);
198 }
199 }
200 }
201
202 /**
203 * @desc 函数节流
204 * @param func 函数
205 * @param wait 延迟执行毫秒数
206 * @param type 1 表时间戳版,2 表定时器版
207 * 时间戳版的函数触发是在时间段内开始的时候,而定时器版的函数触发是在时间段内结束的时候。
208 */
209 export function throttle(func, wait, type) {
210 if (type === 1) {
211 var previous = 0;
212 } else if (type === 2) {
213 var timeout;
214 }
215 return function () {
216 let context = this;
217 let args = arguments;
218 if (type === 1) {
219 let now = Date.now();
220
221 if (now - previous > wait) {
222 func.apply(context, args);
223 previous = now;
224 }
225 } else if (type === 2) {
226 if (!timeout) {
227 timeout = setTimeout(() => {
228 timeout = null;
229 func.apply(context, args)
230 }, wait)
231 }
232 }
233 }
234 }
...\ No newline at end of file ...\ No newline at end of file
1 import wx from 'weixin-js-sdk';
2
3 wx.ready(function () { //通过ready接口处理成功验证
4 // config信息验证成功后会执行ready方法
5 wx.onMenuShareAppMessage({ // 分享给朋友 ,在config里面填写需要使用的JS接口列表,然后这个方法才可以用
6 title: '这里是标题', // 分享标题
7 desc: 'This is a test!', // 分享描述
8 link: '链接', // 分享链接
9 imgUrl: '图片', // 分享图标
10 type: '', // 分享类型,music、video或link,不填默认为link
11 dataUrl: '', // 如果type是music或video,则要提供数据链接,默认为空
12 success: function () {
13 // 用户确认分享后执行的回调函数
14 },
15 cancel: function () {
16 // 用户取消分享后执行的回调函数
17 }
18 });
19 wx.onMenuShareTimeline({ //分享朋友圈
20 title: '标题', // 分享标题
21 link: '链接',
22 imgUrl: '图片', // 分享图标
23 success: function () {
24 // 用户确认分享后执行的回调函数
25 },
26 cancel: function () {
27 // 用户取消分享后执行的回调函数
28 }
29 });
30 });
31 wx.error(function (res) {//通过error接口处理失败验证
32 // config信息验证失败会执行error函数
33 });
34
35
36 wx.config({
37 debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
38 appId: '', // 必填,公众号的唯一标识
39 timestamp: '', // 必填,生成签名的时间戳
40 nonceStr: '', // 必填,生成签名的随机串
41 signature: '',// 必填,签名,见附录1
42 jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
43 });
1 // 打包目录
2 let webpack_public_path = 'dist'
3 if (process.env.NODE_ENV === 'production') {
4 webpack_public_path = process.env.VUE_APP_TITLE
5 }
6 module.exports = {
7 // 部署生产环境和开发环境下的URL。
8 // 默认情况下,Vue CLI 会假设你的应用是被部署在一个域名的根路径上
9 //例如 https://www.my-app.com/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.my-app.com/my-app/,则设置 baseUrl 为 /my-app/。
10 //baseUrl 从 Vue CLI 3.3 起已弃用,请使用publicPath
11 //baseUrl: process.env.NODE_ENV === "production" ? "./" : "/",
12 publicPath: process.env.NODE_ENV === "dev" ? "/" : "./",
13
14 // outputDir: 在npm run build 或 yarn build 时 ,生成文件的目录名称(要和baseUrl的生产环境路径一致)
15 outputDir: webpack_public_path,
16 //用于放置生成的静态资源 (js、css、img、fonts) 的;(项目打包之后,静态资源会放在这个文件夹下)
17 assetsDir: "assets",
18 //指定生成的 index.html 的输出路径 (打包之后,改变系统默认的index.html的文件名)
19 // indexPath: "myIndex.html",
20 //默认情况下,生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存。你可以通过将这个选项设为 false 来关闭文件名哈希。(false的时候就是让原来的文件名不改变)
21 filenameHashing: false,
22
23 // lintOnSave:{ type:Boolean default:true } 问你是否使用eslint
24 lintOnSave: true,
25 //如果你想要在生产构建时禁用 eslint-loader,你可以用如下配置
26 // lintOnSave: process.env.NODE_ENV !== 'production',
27
28 //是否使用包含运行时编译器的 Vue 构建版本。设置为 true 后你就可以在 Vue 组件中使用 template 选项了,但是这会让你的应用额外增加 10kb 左右。(默认false)
29 // runtimeCompiler: false,
30
31 /**
32 * 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
33 * 打包之后发现map文件过大,项目文件体积很大,设置为false就可以不输出map文件
34 * map文件的作用在于:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。
35 * 有了map就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。
36 * */
37 productionSourceMap: false,
38
39 // 它支持webPack-dev-server的所有选项
40 devServer: {
41 host: "localhost",
42 port: 9001, // 端口号
43 https: false, // https:{type:Boolean}
44 open: true, //配置自动启动浏览器
45 // proxy: 'http://localhost:4000' // 配置跨域处理,只有一个代理
46 }
47 };
...\ No newline at end of file ...\ No newline at end of file