├── px-wechat-app ├── static │ ├── .gitkeep │ └── weui │ │ └── weui.css ├── config │ ├── prod.env.js │ ├── dev.env.js │ └── index.js ├── src │ ├── pages │ │ ├── index │ │ │ ├── main.js │ │ │ └── index.vue │ │ └── test │ │ │ ├── main.js │ │ │ └── index.vue │ ├── css │ │ ├── button.css │ │ └── app.css │ ├── components │ │ └── card.vue │ ├── utils │ │ ├── apiUtil.js │ │ ├── index.js │ │ └── httpUtil.js │ ├── App.vue │ └── main.js ├── .postcssrc.js ├── .editorconfig ├── .gitignore ├── index.html ├── build │ ├── dev-client.js │ ├── vue-loader.conf.js │ ├── build.js │ ├── check-versions.js │ ├── utils.js │ ├── webpack.base.conf.js │ ├── dev-server.js │ ├── webpack.dev.conf.js │ └── webpack.prod.conf.js ├── .babelrc ├── README.md ├── project.config.json └── package.json └── .DS_Store /px-wechat-app/static/.gitkeep: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/doinbean/mpvue-demo/HEAD/.DS_Store -------------------------------------------------------------------------------- /px-wechat-app/config/prod.env.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | NODE_ENV: '"production"' 3 | } 4 | -------------------------------------------------------------------------------- /px-wechat-app/src/pages/index/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './index' 3 | 4 | const app = new Vue(App) 5 | app.$mount() 6 | -------------------------------------------------------------------------------- /px-wechat-app/.postcssrc.js: -------------------------------------------------------------------------------- 1 | // https://github.com/michael-ciniawsky/postcss-load-config 2 | 3 | module.exports = { 4 | "plugins": { 5 | "postcss-mpvue-wxss": {} 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /px-wechat-app/config/dev.env.js: -------------------------------------------------------------------------------- 1 | var merge = require('webpack-merge') 2 | var prodEnv = require('./prod.env') 3 | 4 | module.exports = merge(prodEnv, { 5 | NODE_ENV: '"development"' 6 | }) 7 | -------------------------------------------------------------------------------- /px-wechat-app/.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | -------------------------------------------------------------------------------- /px-wechat-app/src/css/button.css: -------------------------------------------------------------------------------- 1 | .button-sp-area{ 2 | margin: 0 auto; 3 | padding-top: 15px; 4 | width: 60%; 5 | } 6 | .mini-btn{ 7 | width: auto !important; 8 | margin-right: 5px !important; 9 | } 10 | -------------------------------------------------------------------------------- /px-wechat-app/src/pages/test/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './index' 3 | 4 | const app = new Vue(App) 5 | app.$mount() 6 | 7 | export default { 8 | config: { 9 | navigationBarTitleText: '查看启动日志' 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /px-wechat-app/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Editor directories and files 9 | .idea 10 | *.suo 11 | *.ntvs* 12 | *.njsproj 13 | *.sln 14 | *.package-lock.json 15 | -------------------------------------------------------------------------------- /px-wechat-app/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | px-wechat-app 6 | 7 | 8 |
9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /px-wechat-app/src/components/card.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 14 | 15 | 20 | -------------------------------------------------------------------------------- /px-wechat-app/build/dev-client.js: -------------------------------------------------------------------------------- 1 | /* eslint-disable */ 2 | require('eventsource-polyfill') 3 | var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true') 4 | 5 | hotClient.subscribe(function (event) { 6 | if (event.action === 'reload') { 7 | window.location.reload() 8 | } 9 | }) 10 | -------------------------------------------------------------------------------- /px-wechat-app/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { 4 | "modules": false, 5 | "targets": { 6 | "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] 7 | } 8 | }], 9 | "stage-2" 10 | ], 11 | "plugins": ["transform-runtime"], 12 | "env": { 13 | "test": { 14 | "presets": ["env", "stage-2"], 15 | "plugins": ["istanbul"] 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /px-wechat-app/src/utils/apiUtil.js: -------------------------------------------------------------------------------- 1 | 2 | /** 3 | * Created by yuchen on 2018/4/2. 4 | */ 5 | //封装httpApi 6 | import request from './httpUtil' 7 | const host = "https://h5api.xxxxx.com" 8 | const api = { 9 | // test地址 10 | authorList:() => request.get(`${host}/index/list_author_recommend.html`) 11 | } 12 | 13 | // export default api 14 | export default { //作为组件库(install) 15 | install: function(Vue,name="$http") {//自定义名字(vue-resource也使用$http) 16 | Object.defineProperty(Vue.prototype, name, { value: api });//将组件库挂载在原型对象上 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /px-wechat-app/README.md: -------------------------------------------------------------------------------- 1 | # px-wechat-app 2 | 3 | > px-wx-app 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | 17 | # build for production and view the bundle analyzer report 18 | npm run build --report 19 | ``` 20 | 21 | For detailed explanation on how things work, checkout the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader). 22 | -------------------------------------------------------------------------------- /px-wechat-app/build/vue-loader.conf.js: -------------------------------------------------------------------------------- 1 | var utils = require('./utils') 2 | var config = require('../config') 3 | // var isProduction = process.env.NODE_ENV === 'production' 4 | // for mp 5 | var isProduction = true 6 | 7 | module.exports = { 8 | loaders: utils.cssLoaders({ 9 | sourceMap: isProduction 10 | ? config.build.productionSourceMap 11 | : config.dev.cssSourceMap, 12 | extract: isProduction 13 | }), 14 | transformToRequire: { 15 | video: 'src', 16 | source: 'src', 17 | img: 'src', 18 | image: 'xlink:href' 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /px-wechat-app/src/utils/index.js: -------------------------------------------------------------------------------- 1 | function formatNumber (n) { 2 | const str = n.toString() 3 | return str[1] ? str : `0${str}` 4 | } 5 | 6 | export function formatTime (date) { 7 | const year = date.getFullYear() 8 | const month = date.getMonth() + 1 9 | const day = date.getDate() 10 | 11 | const hour = date.getHours() 12 | const minute = date.getMinutes() 13 | const second = date.getSeconds() 14 | 15 | const t1 = [year, month, day].map(formatNumber).join('/') 16 | const t2 = [hour, minute, second].map(formatNumber).join(':') 17 | 18 | return `${t1} ${t2}` 19 | } 20 | 21 | -------------------------------------------------------------------------------- /px-wechat-app/project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "description": "项目配置文件。", 3 | "setting": { 4 | "urlCheck": true, 5 | "es6": false, 6 | "postcss": true, 7 | "minified": true, 8 | "newFeature": true 9 | }, 10 | "miniprogramRoot": "./dist/", 11 | "compileType": "miniprogram", 12 | "appid": "touristappid", 13 | "projectname": "px-wechat-app", 14 | "condition": { 15 | "search": { 16 | "current": -1, 17 | "list": [] 18 | }, 19 | "conversation": { 20 | "current": -1, 21 | "list": [] 22 | }, 23 | "game": { 24 | "currentL": -1, 25 | "list": [] 26 | }, 27 | "miniprogram": { 28 | "current": -1, 29 | "list": [] 30 | } 31 | } 32 | } -------------------------------------------------------------------------------- /px-wechat-app/src/css/app.css: -------------------------------------------------------------------------------- 1 | @import './button.css'; 2 | page { 3 | background-color: #F8F8F8; 4 | font-size: 16px; 5 | font-family: -apple-system-font, Helvetica Neue, Helvetica, sans-serif; 6 | } 7 | 8 | .page__hd { 9 | padding: 40px; 10 | } 11 | 12 | .page__bd { 13 | padding-bottom: 40px; 14 | } 15 | 16 | .page__bd_spacing { 17 | padding-left: 15px; 18 | padding-right: 15px; 19 | } 20 | 21 | .page__ft { 22 | padding-bottom: 10px; 23 | text-align: center; 24 | } 25 | 26 | .page__title { 27 | text-align: left; 28 | font-size: 20px; 29 | font-weight: 400; 30 | } 31 | 32 | .page__desc { 33 | margin-top: 5px; 34 | color: #888888; 35 | text-align: left; 36 | font-size: 14px; 37 | } 38 | -------------------------------------------------------------------------------- /px-wechat-app/src/App.vue: -------------------------------------------------------------------------------- 1 | 13 | 14 | 32 | -------------------------------------------------------------------------------- /px-wechat-app/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App' 3 | import flyioPlugin from './utils/apiUtil.js' 4 | 5 | import '../static/weui/weui.css' 6 | import './css/app.css' 7 | 8 | Vue.use(flyioPlugin);//使用组件库 9 | 10 | Vue.config.productionTip = false 11 | App.mpType = 'app' 12 | 13 | const app = new Vue(App) 14 | app.$mount() 15 | 16 | export default { 17 | // 这个字段走 app.json 18 | config: { 19 | // 页面前带有 ^ 符号的，会被编译成首页，其他页面可以选填，我们会自动把 webpack entry 里面的入口页面加进去 20 | pages: ['pages/test/main', '^pages/index/main'], 21 | window: { 22 | backgroundTextStyle: 'light', 23 | navigationBarBackgroundColor: '#fff', 24 | navigationBarTitleText: 'WeChat', 25 | navigationBarTextStyle: 'black' 26 | } 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /px-wechat-app/src/utils/httpUtil.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Created by yuchen on 2018/4/2. 3 | */ 4 | import Fly from 'flyio/dist/npm/wx' 5 | // 'flyio'(与axios、fentch对比 https://wendux.github.io/dist/#/doc/flyio/compare) 6 | // var Fly=require("flyio/dist/npm/wx") //npm引入方式 7 | 8 | const request = new Fly() 9 | 10 | request.interceptors.request.use((request) => { 11 | wx.showLoading({ title: '心急吃不了热豆腐' }) 12 | // wx.showNavigationBarLoading() //显示导航条加载动画。 13 | return request 14 | }) 15 | 16 | request.interceptors.response.use( 17 | (response, promise) => { 18 | wx.hideLoading() 19 | // wx.hideNavigationBarLoading() 20 | return promise.resolve(response.data) 21 | }, 22 | (err, promise) => { 23 | wx.hideNavigationBarLoading() 24 | wx.showToast({ 25 | title: err.message, 26 | icon: 'none', 27 | duration:1000 28 | }) 29 | return promise.resolve() 30 | } 31 | ) 32 | 33 | export default request 34 | -------------------------------------------------------------------------------- /px-wechat-app/build/build.js: -------------------------------------------------------------------------------- 1 | require('./check-versions')() 2 | 3 | process.env.NODE_ENV = 'production' 4 | 5 | var ora = require('ora') 6 | var rm = require('rimraf') 7 | var path = require('path') 8 | var chalk = require('chalk') 9 | var webpack = require('webpack') 10 | var config = require('../config') 11 | var webpackConfig = require('./webpack.prod.conf') 12 | 13 | var spinner = ora('building for production...') 14 | spinner.start() 15 | 16 | rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => { 17 | if (err) throw err 18 | webpack(webpackConfig, function (err, stats) { 19 | spinner.stop() 20 | if (err) throw err 21 | process.stdout.write(stats.toString({ 22 | colors: true, 23 | modules: false, 24 | children: false, 25 | chunks: false, 26 | chunkModules: false 27 | }) + '\n\n') 28 | 29 | if (stats.hasErrors()) { 30 | console.log(chalk.red(' Build failed with errors.\n')) 31 | process.exit(1) 32 | } 33 | 34 | console.log(chalk.cyan(' Build complete.\n')) 35 | console.log(chalk.yellow( 36 | ' Tip: built files are meant to be served over an HTTP server.\n' + 37 | ' Opening index.html over file:// won\'t work.\n' 38 | )) 39 | }) 40 | }) 41 | -------------------------------------------------------------------------------- /px-wechat-app/build/check-versions.js: -------------------------------------------------------------------------------- 1 | var chalk = require('chalk') 2 | var semver = require('semver') 3 | var packageConfig = require('../package.json') 4 | var shell = require('shelljs') 5 | function exec (cmd) { 6 | return require('child_process').execSync(cmd).toString().trim() 7 | } 8 | 9 | var versionRequirements = [ 10 | { 11 | name: 'node', 12 | currentVersion: semver.clean(process.version), 13 | versionRequirement: packageConfig.engines.node 14 | } 15 | ] 16 | 17 | if (shell.which('npm')) { 18 | versionRequirements.push({ 19 | name: 'npm', 20 | currentVersion: exec('npm --version'), 21 | versionRequirement: packageConfig.engines.npm 22 | }) 23 | } 24 | 25 | module.exports = function () { 26 | var warnings = [] 27 | for (var i = 0; i < versionRequirements.length; i++) { 28 | var mod = versionRequirements[i] 29 | if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) { 30 | warnings.push(mod.name + ': ' + 31 | chalk.red(mod.currentVersion) + ' should be ' + 32 | chalk.green(mod.versionRequirement) 33 | ) 34 | } 35 | } 36 | 37 | if (warnings.length) { 38 | console.log('') 39 | console.log(chalk.yellow('To use this template, you must update following to modules:')) 40 | console.log() 41 | for (var i = 0; i < warnings.length; i++) { 42 | var warning = warnings[i] 43 | console.log(' ' + warning) 44 | } 45 | console.log() 46 | process.exit(1) 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /px-wechat-app/config/index.js: -------------------------------------------------------------------------------- 1 | // see http://vuejs-templates.github.io/webpack for documentation. 2 | var path = require('path') 3 | 4 | module.exports = { 5 | build: { 6 | env: require('./prod.env'), 7 | index: path.resolve(__dirname, '../dist/index.html'), 8 | assetsRoot: path.resolve(__dirname, '../dist'), 9 | assetsSubDirectory: 'static', 10 | assetsPublicPath: '/', 11 | productionSourceMap: false, 12 | // Gzip off by default as many popular static hosts such as 13 | // Surge or Netlify already gzip all static assets for you. 14 | // Before setting to `true`, make sure to: 15 | // npm install --save-dev compression-webpack-plugin 16 | productionGzip: false, 17 | productionGzipExtensions: ['js', 'css'], 18 | // Run the build command with an extra argument to 19 | // View the bundle analyzer report after build finishes: 20 | // `npm run build --report` 21 | // Set to `true` or `false` to always turn it on or off 22 | bundleAnalyzerReport: process.env.npm_config_report 23 | }, 24 | dev: { 25 | env: require('./dev.env'), 26 | port: 8080, 27 | // 在小程序开发者工具中不需要自动打开浏览器 28 | autoOpenBrowser: false, 29 | assetsSubDirectory: 'static', 30 | assetsPublicPath: '/', 31 | proxyTable: {}, 32 | // CSS Sourcemaps off by default because relative paths are "buggy" 33 | // with this option, according to the CSS-Loader README 34 | // (https://github.com/webpack/css-loader#sourcemaps) 35 | // In our experience, they generally work as expected, 36 | // just be aware of this issue when enabling this option. 37 | cssSourceMap: false 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /px-wechat-app/src/pages/test/index.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 70 | 71 | 82 | -------------------------------------------------------------------------------- /px-wechat-app/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "px-wechat-app", 3 | "version": "1.0.0", 4 | "description": "px-wx-app", 5 | "author": "诺导 ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "node build/dev-server.js", 9 | "start": "node build/dev-server.js", 10 | "build": "node build/build.js" 11 | }, 12 | "dependencies": { 13 | "mpvue": "^1.0.6", 14 | "flyio": "^0.4.3" 15 | }, 16 | "devDependencies": { 17 | "mpvue-loader": "^1.0.8", 18 | "mpvue-webpack-target": "^1.0.0", 19 | "mpvue-template-compiler": "^1.0.6", 20 | "postcss-mpvue-wxss": "^1.0.0", 21 | "px2rpx-loader": "^0.1.8", 22 | "babel-core": "^6.22.1", 23 | "glob": "^7.1.2", 24 | "webpack-mpvue-asset-plugin": "^0.0.1", 25 | "babel-loader": "^7.1.1", 26 | "babel-plugin-transform-runtime": "^6.22.0", 27 | "babel-preset-env": "^1.3.2", 28 | "babel-preset-stage-2": "^6.22.0", 29 | "babel-register": "^6.22.0", 30 | "chalk": "^2.0.1", 31 | "connect-history-api-fallback": "^1.3.0", 32 | "copy-webpack-plugin": "^4.0.1", 33 | "css-loader": "^0.28.0", 34 | "cssnano": "^3.10.0", 35 | "eventsource-polyfill": "^0.9.6", 36 | "express": "^4.14.1", 37 | "extract-text-webpack-plugin": "^2.0.0", 38 | "file-loader": "^0.11.1", 39 | "friendly-errors-webpack-plugin": "^1.1.3", 40 | "html-webpack-plugin": "^2.28.0", 41 | "http-proxy-middleware": "^0.17.3", 42 | "webpack-bundle-analyzer": "^2.2.1", 43 | "semver": "^5.3.0", 44 | "shelljs": "^0.7.6", 45 | "optimize-css-assets-webpack-plugin": "^2.0.0", 46 | "ora": "^1.2.0", 47 | "rimraf": "^2.6.0", 48 | "url-loader": "^0.5.8", 49 | "vue-style-loader": "^3.0.1", 50 | "webpack": "^2.6.1", 51 | "webpack-dev-middleware-hard-disk": "^1.10.0", 52 | "webpack-merge": "^4.1.0", 53 | "postcss-loader": "^2.0.6" 54 | }, 55 | "engines": { 56 | "node": ">= 4.0.0", 57 | "npm": ">= 3.0.0" 58 | }, 59 | "browserslist": [ 60 | "> 1%", 61 | "last 2 versions", 62 | "not ie <= 8" 63 | ] 64 | } 65 | -------------------------------------------------------------------------------- /px-wechat-app/build/utils.js: -------------------------------------------------------------------------------- 1 | var path = require('path') 2 | var config = require('../config') 3 | var ExtractTextPlugin = require('extract-text-webpack-plugin') 4 | 5 | exports.assetsPath = function (_path) { 6 | var assetsSubDirectory = process.env.NODE_ENV === 'production' 7 | ? config.build.assetsSubDirectory 8 | : config.dev.assetsSubDirectory 9 | return path.posix.join(assetsSubDirectory, _path) 10 | } 11 | 12 | exports.cssLoaders = function (options) { 13 | options = options || {} 14 | 15 | var cssLoader = { 16 | loader: 'css-loader', 17 | options: { 18 | minimize: process.env.NODE_ENV === 'production', 19 | sourceMap: options.sourceMap 20 | } 21 | } 22 | 23 | var postcssLoader = { 24 | loader: 'postcss-loader', 25 | options: { 26 | sourceMap: true 27 | } 28 | } 29 | 30 | var px2rpxLoader = { 31 | loader: 'px2rpx-loader', 32 | options: { 33 | baseDpr: 1, 34 | rpxUnit: 0.5 35 | } 36 | } 37 | 38 | // generate loader string to be used with extract text plugin 39 | function generateLoaders (loader, loaderOptions) { 40 | var loaders = [cssLoader, px2rpxLoader, postcssLoader] 41 | if (loader) { 42 | loaders.push({ 43 | loader: loader + '-loader', 44 | options: Object.assign({}, loaderOptions, { 45 | sourceMap: options.sourceMap 46 | }) 47 | }) 48 | } 49 | 50 | // Extract CSS when that option is specified 51 | // (which is the case during production build) 52 | if (options.extract) { 53 | return ExtractTextPlugin.extract({ 54 | use: loaders, 55 | fallback: 'vue-style-loader' 56 | }) 57 | } else { 58 | return ['vue-style-loader'].concat(loaders) 59 | } 60 | } 61 | 62 | // https://vue-loader.vuejs.org/en/configurations/extract-css.html 63 | return { 64 | css: generateLoaders(), 65 | postcss: generateLoaders(), 66 | less: generateLoaders('less'), 67 | sass: generateLoaders('sass', { indentedSyntax: true }), 68 | scss: generateLoaders('sass'), 69 | stylus: generateLoaders('stylus'), 70 | styl: generateLoaders('stylus') 71 | } 72 | } 73 | 74 | // Generate loaders for standalone style files (outside of .vue) 75 | exports.styleLoaders = function (options) { 76 | var output = [] 77 | var loaders = exports.cssLoaders(options) 78 | for (var extension in loaders) { 79 | var loader = loaders[extension] 80 | output.push({ 81 | test: new RegExp('\\.' + extension + '$'), 82 | use: loader 83 | }) 84 | } 85 | return output 86 | } 87 | -------------------------------------------------------------------------------- /px-wechat-app/build/webpack.base.conf.js: -------------------------------------------------------------------------------- 1 | var path = require('path') 2 | var fs = require('fs') 3 | var utils = require('./utils') 4 | var config = require('../config') 5 | var vueLoaderConfig = require('./vue-loader.conf') 6 | var MpvuePlugin = require('webpack-mpvue-asset-plugin') 7 | var glob = require('glob') 8 | 9 | function resolve (dir) { 10 | return path.join(__dirname, '..', dir) 11 | } 12 | 13 | function getEntry (rootSrc, pattern) { 14 | var files = glob.sync(path.resolve(rootSrc, pattern)) 15 | return files.reduce((res, file) => { 16 | var info = path.parse(file) 17 | var key = info.dir.slice(rootSrc.length + 1) + '/' + info.name 18 | res[key] = path.resolve(file) 19 | return res 20 | }, {}) 21 | } 22 | 23 | const appEntry = { app: resolve('./src/main.js') } 24 | const pagesEntry = getEntry(resolve('./src'), 'pages/**/main.js') 25 | const entry = Object.assign({}, appEntry, pagesEntry) 26 | 27 | module.exports = { 28 | // 如果要自定义生成的 dist 目录里面的文件路径， 29 | // 可以将 entry 写成 {'toPath': 'fromPath'} 的形式， 30 | // toPath 为相对于 dist 的路径, 例：index/demo，则生成的文件地址为 dist/index/demo.js 31 | entry, 32 | target: require('mpvue-webpack-target'), 33 | output: { 34 | path: config.build.assetsRoot, 35 | filename: '[name].js', 36 | publicPath: process.env.NODE_ENV === 'production' 37 | ? config.build.assetsPublicPath 38 | : config.dev.assetsPublicPath 39 | }, 40 | resolve: { 41 | extensions: ['.js', '.vue', '.json'], 42 | alias: { 43 | 'vue': 'mpvue', 44 | '@': resolve('src') 45 | }, 46 | symlinks: false 47 | }, 48 | module: { 49 | rules: [ 50 | { 51 | test: /\.vue$/, 52 | loader: 'mpvue-loader', 53 | options: vueLoaderConfig 54 | }, 55 | { 56 | test: /\.js$/, 57 | include: [resolve('src'), resolve('test')], 58 | use: [ 59 | 'babel-loader', 60 | { 61 | loader: 'mpvue-loader', 62 | options: { 63 | checkMPEntry: true 64 | } 65 | }, 66 | ] 67 | }, 68 | { 69 | test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, 70 | loader: 'url-loader', 71 | options: { 72 | limit: 10000, 73 | name: utils.assetsPath('img/[name].[ext]') 74 | } 75 | }, 76 | { 77 | test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/, 78 | loader: 'url-loader', 79 | options: { 80 | limit: 10000, 81 | name: utils.assetsPath('media/[name]].[ext]') 82 | } 83 | }, 84 | { 85 | test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, 86 | loader: 'url-loader', 87 | options: { 88 | limit: 10000, 89 | name: utils.assetsPath('fonts/[name].[ext]') 90 | } 91 | } 92 | ] 93 | }, 94 | plugins: [ 95 | new MpvuePlugin() 96 | ] 97 | } 98 | -------------------------------------------------------------------------------- /px-wechat-app/build/dev-server.js: -------------------------------------------------------------------------------- 1 | require('./check-versions')() 2 | 3 | var config = require('../config') 4 | if (!process.env.NODE_ENV) { 5 | process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV) 6 | } 7 | 8 | // var opn = require('opn') 9 | var path = require('path') 10 | var express = require('express') 11 | var webpack = require('webpack') 12 | var proxyMiddleware = require('http-proxy-middleware') 13 | var webpackConfig = require('./webpack.dev.conf') 14 | 15 | // default port where dev server listens for incoming traffic 16 | var port = process.env.PORT || config.dev.port 17 | // automatically open browser, if not set will be false 18 | var autoOpenBrowser = !!config.dev.autoOpenBrowser 19 | // Define HTTP proxies to your custom API backend 20 | // https://github.com/chimurai/http-proxy-middleware 21 | var proxyTable = config.dev.proxyTable 22 | 23 | var app = express() 24 | var compiler = webpack(webpackConfig) 25 | 26 | // var devMiddleware = require('webpack-dev-middleware')(compiler, { 27 | // publicPath: webpackConfig.output.publicPath, 28 | // quiet: true 29 | // }) 30 | 31 | // var hotMiddleware = require('webpack-hot-middleware')(compiler, { 32 | // log: false, 33 | // heartbeat: 2000 34 | // }) 35 | // force page reload when html-webpack-plugin template changes 36 | // compiler.plugin('compilation', function (compilation) { 37 | // compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) { 38 | // hotMiddleware.publish({ action: 'reload' }) 39 | // cb() 40 | // }) 41 | // }) 42 | 43 | // proxy api requests 44 | Object.keys(proxyTable).forEach(function (context) { 45 | var options = proxyTable[context] 46 | if (typeof options === 'string') { 47 | options = { target: options } 48 | } 49 | app.use(proxyMiddleware(options.filter || context, options)) 50 | }) 51 | 52 | // handle fallback for HTML5 history API 53 | app.use(require('connect-history-api-fallback')()) 54 | 55 | // serve webpack bundle output 56 | // app.use(devMiddleware) 57 | 58 | // enable hot-reload and state-preserving 59 | // compilation error display 60 | // app.use(hotMiddleware) 61 | 62 | // serve pure static assets 63 | var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory) 64 | app.use(staticPath, express.static('./static')) 65 | 66 | var uri = 'http://localhost:' + port 67 | 68 | var _resolve 69 | var readyPromise = new Promise(resolve => { 70 | _resolve = resolve 71 | }) 72 | 73 | // console.log('> Starting dev server...') 74 | // devMiddleware.waitUntilValid(() => { 75 | // console.log('> Listening at ' + uri + '\n') 76 | // // when env is testing, don't need open it 77 | // if (autoOpenBrowser && process.env.NODE_ENV !== 'testing') { 78 | // opn(uri) 79 | // } 80 | // _resolve() 81 | // }) 82 | 83 | var server = app.listen(port, 'localhost') 84 | 85 | // for 小程序的文件保存机制 86 | require('webpack-dev-middleware-hard-disk')(compiler, { 87 | publicPath: webpackConfig.output.publicPath, 88 | quiet: true 89 | }) 90 | 91 | module.exports = { 92 | ready: readyPromise, 93 | close: () => { 94 | server.close() 95 | } 96 | } 97 | -------------------------------------------------------------------------------- /px-wechat-app/build/webpack.dev.conf.js: -------------------------------------------------------------------------------- 1 | var utils = require('./utils') 2 | var webpack = require('webpack') 3 | var config = require('../config') 4 | var merge = require('webpack-merge') 5 | var baseWebpackConfig = require('./webpack.base.conf') 6 | // var HtmlWebpackPlugin = require('html-webpack-plugin') 7 | var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') 8 | 9 | // copy from ./webpack.prod.conf.js 10 | var path = require('path') 11 | var ExtractTextPlugin = require('extract-text-webpack-plugin') 12 | var CopyWebpackPlugin = require('copy-webpack-plugin') 13 | var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') 14 | 15 | // add hot-reload related code to entry chunks 16 | // Object.keys(baseWebpackConfig.entry).forEach(function (name) { 17 | // baseWebpackConfig.entry[name] = ['./build/dev-client'].concat(baseWebpackConfig.entry[name]) 18 | // }) 19 | 20 | module.exports = merge(baseWebpackConfig, { 21 | module: { 22 | rules: utils.styleLoaders({ 23 | sourceMap: config.dev.cssSourceMap, 24 | extract: true 25 | }) 26 | }, 27 | // cheap-module-eval-source-map is faster for development 28 | // devtool: '#cheap-module-eval-source-map', 29 | devtool: '#source-map', 30 | output: { 31 | path: config.build.assetsRoot, 32 | // filename: utils.assetsPath('js/[name].[chunkhash].js'), 33 | // chunkFilename: utils.assetsPath('js/[id].[chunkhash].js') 34 | filename: utils.assetsPath('js/[name].js'), 35 | chunkFilename: utils.assetsPath('js/[id].js') 36 | }, 37 | plugins: [ 38 | new webpack.DefinePlugin({ 39 | 'process.env': config.dev.env 40 | }), 41 | 42 | // copy from ./webpack.prod.conf.js 43 | // extract css into its own file 44 | new ExtractTextPlugin({ 45 | // filename: utils.assetsPath('css/[name].[contenthash].css') 46 | filename: utils.assetsPath('css/[name].wxss') 47 | }), 48 | // Compress extracted CSS. We are using this plugin so that possible 49 | // duplicated CSS from different components can be deduped. 50 | new OptimizeCSSPlugin({ 51 | cssProcessorOptions: { 52 | safe: true 53 | } 54 | }), 55 | new webpack.optimize.CommonsChunkPlugin({ 56 | name: 'vendor', 57 | minChunks: function (module, count) { 58 | // any required modules inside node_modules are extracted to vendor 59 | return ( 60 | module.resource && 61 | /\.js$/.test(module.resource) && 62 | module.resource.indexOf('node_modules') >= 0 63 | ) || count > 1 64 | } 65 | }), 66 | new webpack.optimize.CommonsChunkPlugin({ 67 | name: 'manifest', 68 | chunks: ['vendor'] 69 | }), 70 | // copy custom static assets 71 | new CopyWebpackPlugin([ 72 | { 73 | from: path.resolve(__dirname, '../static'), 74 | to: config.build.assetsSubDirectory, 75 | ignore: ['.*'] 76 | } 77 | ]), 78 | 79 | // https://github.com/glenjamin/webpack-hot-middleware#installation--usage 80 | // new webpack.HotModuleReplacementPlugin(), 81 | new webpack.NoEmitOnErrorsPlugin(), 82 | // https://github.com/ampedandwired/html-webpack-plugin 83 | // new HtmlWebpackPlugin({ 84 | // filename: 'index.html', 85 | // template: 'index.html', 86 | // inject: true 87 | // }), 88 | new FriendlyErrorsPlugin() 89 | ] 90 | }) 91 | -------------------------------------------------------------------------------- /px-wechat-app/src/pages/index/index.vue: -------------------------------------------------------------------------------- 1 | 56 | 57 | 107 | 108 | 138 | -------------------------------------------------------------------------------- /px-wechat-app/build/webpack.prod.conf.js: -------------------------------------------------------------------------------- 1 | var path = require('path') 2 | var utils = require('./utils') 3 | var webpack = require('webpack') 4 | var config = require('../config') 5 | var merge = require('webpack-merge') 6 | var baseWebpackConfig = require('./webpack.base.conf') 7 | var CopyWebpackPlugin = require('copy-webpack-plugin') 8 | // var HtmlWebpackPlugin = require('html-webpack-plugin') 9 | var ExtractTextPlugin = require('extract-text-webpack-plugin') 10 | var OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin') 11 | 12 | var env = config.build.env 13 | 14 | var webpackConfig = merge(baseWebpackConfig, { 15 | module: { 16 | rules: utils.styleLoaders({ 17 | sourceMap: config.build.productionSourceMap, 18 | extract: true 19 | }) 20 | }, 21 | devtool: config.build.productionSourceMap ? '#source-map' : false, 22 | output: { 23 | path: config.build.assetsRoot, 24 | // filename: utils.assetsPath('js/[name].[chunkhash].js'), 25 | // chunkFilename: utils.assetsPath('js/[id].[chunkhash].js') 26 | filename: utils.assetsPath('js/[name].js'), 27 | chunkFilename: utils.assetsPath('js/[id].js') 28 | }, 29 | plugins: [ 30 | // http://vuejs.github.io/vue-loader/en/workflow/production.html 31 | new webpack.DefinePlugin({ 32 | 'process.env': env 33 | }), 34 | new webpack.optimize.UglifyJsPlugin({ 35 | compress: { 36 | warnings: false 37 | }, 38 | sourceMap: true 39 | }), 40 | // extract css into its own file 41 | new ExtractTextPlugin({ 42 | // filename: utils.assetsPath('css/[name].[contenthash].css') 43 | filename: utils.assetsPath('css/[name].wxss') 44 | }), 45 | // Compress extracted CSS. We are using this plugin so that possible 46 | // duplicated CSS from different components can be deduped. 47 | new OptimizeCSSPlugin({ 48 | cssProcessorOptions: { 49 | safe: true 50 | } 51 | }), 52 | // generate dist index.html with correct asset hash for caching. 53 | // you can customize output by editing /index.html 54 | // see https://github.com/ampedandwired/html-webpack-plugin 55 | // new HtmlWebpackPlugin({ 56 | // filename: config.build.index, 57 | // template: 'index.html', 58 | // inject: true, 59 | // minify: { 60 | // removeComments: true, 61 | // collapseWhitespace: true, 62 | // removeAttributeQuotes: true 63 | // // more options: 64 | // // https://github.com/kangax/html-minifier#options-quick-reference 65 | // }, 66 | // // necessary to consistently work with multiple chunks via CommonsChunkPlugin 67 | // chunksSortMode: 'dependency' 68 | // }), 69 | // keep module.id stable when vender modules does not change 70 | new webpack.HashedModuleIdsPlugin(), 71 | // split vendor js into its own file 72 | new webpack.optimize.CommonsChunkPlugin({ 73 | name: 'vendor', 74 | minChunks: function (module, count) { 75 | // any required modules inside node_modules are extracted to vendor 76 | return ( 77 | module.resource && 78 | /\.js$/.test(module.resource) && 79 | module.resource.indexOf('node_modules') >= 0 80 | ) || count > 1 81 | } 82 | }), 83 | // extract webpack runtime and module manifest to its own file in order to 84 | // prevent vendor hash from being updated whenever app bundle is updated 85 | new webpack.optimize.CommonsChunkPlugin({ 86 | name: 'manifest', 87 | chunks: ['vendor'] 88 | }), 89 | // copy custom static assets 90 | new CopyWebpackPlugin([ 91 | { 92 | from: path.resolve(__dirname, '../static'), 93 | to: config.build.assetsSubDirectory, 94 | ignore: ['.*'] 95 | } 96 | ]) 97 | ] 98 | }) 99 | 100 | // if (config.build.productionGzip) { 101 | // var CompressionWebpackPlugin = require('compression-webpack-plugin') 102 | 103 | // webpackConfig.plugins.push( 104 | // new CompressionWebpackPlugin({ 105 | // asset: '[path].gz[query]', 106 | // algorithm: 'gzip', 107 | // test: new RegExp( 108 | // '\\.(' + 109 | // config.build.productionGzipExtensions.join('|') + 110 | // ')$' 111 | // ), 112 | // threshold: 10240, 113 | // minRatio: 0.8 114 | // }) 115 | // ) 116 | // } 117 | 118 | if (config.build.bundleAnalyzerReport) { 119 | var BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin 120 | webpackConfig.plugins.push(new BundleAnalyzerPlugin()) 121 | } 122 | 123 | module.exports = webpackConfig 124 | -------------------------------------------------------------------------------- /px-wechat-app/static/weui/weui.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * WeUI v1.1.1 (https://github.com/weui/weui-wxss) 3 | * Copyright 2017 Tencent, Inc. 4 | * Licensed under the MIT license 5 | */ 6 | 7 | page { 8 | line-height: 1.6; 9 | font-family: -apple-system-font, Helvetica Neue, sans-serif; 10 | } 11 | 12 | icon { 13 | vertical-align: middle; 14 | } 15 | 16 | .weui-cells { 17 | position: relative; 18 | margin-top: 1.17647059em; 19 | background-color: #fff; 20 | line-height: 1.41176471; 21 | font-size: 17px; 22 | } 23 | 24 | .weui-cells:before { 25 | top: 0; 26 | border-top: 1rpx solid #d9d9d9; 27 | } 28 | 29 | .weui-cells:after, 30 | .weui-cells:before { 31 | content: " "; 32 | position: absolute; 33 | left: 0; 34 | right: 0; 35 | height: 1px; 36 | color: #d9d9d9; 37 | } 38 | 39 | .weui-cells:after { 40 | bottom: 0; 41 | border-bottom: 1rpx solid #d9d9d9; 42 | } 43 | 44 | .weui-cells__title { 45 | margin-top: 0.77em; 46 | margin-bottom: 0.3em; 47 | padding-left: 15px; 48 | padding-right: 15px; 49 | color: #999; 50 | font-size: 14px; 51 | } 52 | 53 | .weui-cells_after-title { 54 | margin-top: 0; 55 | } 56 | 57 | .weui-cells__tips { 58 | margin-top: 0.3em; 59 | color: #999; 60 | padding-left: 15px; 61 | padding-right: 15px; 62 | font-size: 14px; 63 | } 64 | 65 | .weui-cell { 66 | padding: 10px 15px; 67 | position: relative; 68 | display: -webkit-box; 69 | display: -webkit-flex; 70 | display: flex; 71 | -webkit-box-align: center; 72 | -webkit-align-items: center; 73 | align-items: center; 74 | } 75 | 76 | .weui-cell:before { 77 | content: " "; 78 | position: absolute; 79 | left: 0; 80 | top: 0; 81 | right: 0; 82 | height: 1px; 83 | border-top: 1rpx solid #d9d9d9; 84 | color: #d9d9d9; 85 | left: 15px; 86 | } 87 | 88 | .weui-cell:first-child:before { 89 | display: none; 90 | } 91 | 92 | .weui-cell_active { 93 | background-color: #ececec; 94 | } 95 | 96 | .weui-cell_primary { 97 | -webkit-box-align: start; 98 | -webkit-align-items: flex-start; 99 | align-items: flex-start; 100 | } 101 | 102 | .weui-cell__bd { 103 | -webkit-box-flex: 1; 104 | -webkit-flex: 1; 105 | flex: 1; 106 | } 107 | 108 | .weui-cell__ft { 109 | text-align: right; 110 | color: #999; 111 | } 112 | 113 | .weui-cell_access { 114 | color: inherit; 115 | } 116 | 117 | .weui-cell__ft_in-access { 118 | padding-right: 13px; 119 | position: relative; 120 | } 121 | 122 | .weui-cell__ft_in-access:after { 123 | content: " "; 124 | display: inline-block; 125 | height: 6px; 126 | width: 6px; 127 | border-width: 2px 2px 0 0; 128 | border-color: #c8c8cd; 129 | border-style: solid; 130 | -webkit-transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0); 131 | transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0); 132 | position: relative; 133 | top: -2px; 134 | position: absolute; 135 | top: 50%; 136 | margin-top: -4px; 137 | right: 2px; 138 | } 139 | 140 | .weui-cell_link { 141 | color: #586c94; 142 | font-size: 14px; 143 | } 144 | 145 | .weui-cell_link:active { 146 | background-color: #ececec; 147 | } 148 | 149 | .weui-cell_link:first-child:before { 150 | display: block; 151 | } 152 | 153 | .weui-icon-radio { 154 | margin-left: 3.2px; 155 | margin-right: 3.2px; 156 | } 157 | 158 | .weui-icon-checkbox_circle, 159 | .weui-icon-checkbox_success { 160 | margin-left: 4.6px; 161 | margin-right: 4.6px; 162 | } 163 | 164 | .weui-check__label:active { 165 | background-color: #ececec; 166 | } 167 | 168 | .weui-check { 169 | position: absolute; 170 | left: -9999px; 171 | } 172 | 173 | .weui-check__hd_in-checkbox { 174 | padding-right: 0.35em; 175 | } 176 | 177 | .weui-cell__ft_in-radio { 178 | padding-left: 0.35em; 179 | } 180 | 181 | .weui-cell_input { 182 | padding-top: 0; 183 | padding-bottom: 0; 184 | } 185 | 186 | .weui-label { 187 | width: 105px; 188 | word-wrap: break-word; 189 | word-break: break-all; 190 | } 191 | 192 | .weui-input { 193 | height: 2.58823529em; 194 | min-height: 2.58823529em; 195 | line-height: 2.58823529em; 196 | } 197 | 198 | .weui-toptips { 199 | position: fixed; 200 | -webkit-transform: translateZ(0); 201 | transform: translateZ(0); 202 | top: 0; 203 | left: 0; 204 | right: 0; 205 | padding: 5px; 206 | font-size: 14px; 207 | text-align: center; 208 | color: #fff; 209 | z-index: 5000; 210 | word-wrap: break-word; 211 | word-break: break-all; 212 | } 213 | 214 | .weui-toptips_warn { 215 | background-color: #e64340; 216 | } 217 | 218 | .weui-textarea { 219 | display: block; 220 | width: 100%; 221 | } 222 | 223 | .weui-textarea-counter { 224 | color: #b2b2b2; 225 | text-align: right; 226 | } 227 | 228 | .weui-cell_warn, 229 | .weui-textarea-counter_warn { 230 | color: #e64340; 231 | } 232 | 233 | .weui-form-preview { 234 | position: relative; 235 | background-color: #fff; 236 | } 237 | 238 | .weui-form-preview:before { 239 | top: 0; 240 | border-top: 1rpx solid #d9d9d9; 241 | } 242 | 243 | .weui-form-preview:after, 244 | .weui-form-preview:before { 245 | content: " "; 246 | position: absolute; 247 | left: 0; 248 | right: 0; 249 | height: 1px; 250 | color: #d9d9d9; 251 | } 252 | 253 | .weui-form-preview:after { 254 | bottom: 0; 255 | border-bottom: 1rpx solid #d9d9d9; 256 | } 257 | 258 | .weui-form-preview__value { 259 | font-size: 14px; 260 | } 261 | 262 | .weui-form-preview__value_in-hd { 263 | font-size: 26px; 264 | } 265 | 266 | .weui-form-preview__hd { 267 | position: relative; 268 | padding: 10px 15px; 269 | text-align: right; 270 | line-height: 2.5em; 271 | } 272 | 273 | .weui-form-preview__hd:after { 274 | content: " "; 275 | position: absolute; 276 | left: 0; 277 | bottom: 0; 278 | right: 0; 279 | height: 1px; 280 | border-bottom: 1rpx solid #d9d9d9; 281 | color: #d9d9d9; 282 | left: 15px; 283 | } 284 | 285 | .weui-form-preview__bd { 286 | padding: 10px 15px; 287 | font-size: 0.9em; 288 | text-align: right; 289 | color: #999; 290 | line-height: 2; 291 | } 292 | 293 | .weui-form-preview__ft { 294 | position: relative; 295 | line-height: 50px; 296 | display: -webkit-box; 297 | display: -webkit-flex; 298 | display: flex; 299 | } 300 | 301 | .weui-form-preview__ft:after { 302 | content: " "; 303 | position: absolute; 304 | left: 0; 305 | top: 0; 306 | right: 0; 307 | height: 1px; 308 | border-top: 1rpx solid #d5d5d6; 309 | color: #d5d5d6; 310 | } 311 | 312 | .weui-form-preview__item { 313 | overflow: hidden; 314 | } 315 | 316 | .weui-form-preview__label { 317 | float: left; 318 | margin-right: 1em; 319 | min-width: 4em; 320 | color: #999; 321 | text-align: justify; 322 | text-align-last: justify; 323 | } 324 | 325 | .weui-form-preview__value { 326 | display: block; 327 | overflow: hidden; 328 | word-break: normal; 329 | word-wrap: break-word; 330 | } 331 | 332 | .weui-form-preview__btn { 333 | position: relative; 334 | display: block; 335 | -webkit-box-flex: 1; 336 | -webkit-flex: 1; 337 | flex: 1; 338 | color: #3cc51f; 339 | text-align: center; 340 | } 341 | 342 | .weui-form-preview__btn:after { 343 | content: " "; 344 | position: absolute; 345 | left: 0; 346 | top: 0; 347 | width: 1px; 348 | bottom: 0; 349 | border-left: 1rpx solid #d5d5d6; 350 | color: #d5d5d6; 351 | } 352 | 353 | .weui-form-preview__btn:first-child:after { 354 | display: none; 355 | } 356 | 357 | .weui-form-preview__btn_active { 358 | background-color: #eee; 359 | } 360 | 361 | .weui-form-preview__btn_default { 362 | color: #999; 363 | } 364 | 365 | .weui-form-preview__btn_primary { 366 | color: #0bb20c; 367 | } 368 | 369 | .weui-cell_select { 370 | padding: 0; 371 | } 372 | 373 | .weui-select { 374 | position: relative; 375 | padding-left: 15px; 376 | padding-right: 30px; 377 | height: 2.58823529em; 378 | min-height: 2.58823529em; 379 | line-height: 2.58823529em; 380 | border-right: 1rpx solid #d9d9d9; 381 | } 382 | 383 | .weui-select:before { 384 | content: " "; 385 | display: inline-block; 386 | height: 6px; 387 | width: 6px; 388 | border-width: 2px 2px 0 0; 389 | border-color: #c8c8cd; 390 | border-style: solid; 391 | -webkit-transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0); 392 | transform: matrix(0.71, 0.71, -.71, 0.71, 0, 0); 393 | position: relative; 394 | top: -2px; 395 | position: absolute; 396 | top: 50%; 397 | right: 15px; 398 | margin-top: -4px; 399 | } 400 | 401 | .weui-select_in-select-after { 402 | padding-left: 0; 403 | } 404 | 405 | .weui-cell__bd_in-select-before, 406 | .weui-cell__hd_in-select-after { 407 | padding-left: 15px; 408 | } 409 | 410 | .weui-cell_vcode { 411 | padding-right: 0; 412 | } 413 | 414 | .weui-vcode-btn, 415 | .weui-vcode-img { 416 | margin-left: 5px; 417 | height: 2.58823529em; 418 | vertical-align: middle; 419 | } 420 | 421 | .weui-vcode-btn { 422 | display: inline-block; 423 | padding: 0 0.6em 0 0.7em; 424 | border-left: 1px solid #e5e5e5; 425 | line-height: 2.58823529em; 426 | font-size: 17px; 427 | color: #3cc51f; 428 | white-space: nowrap; 429 | } 430 | 431 | .weui-vcode-btn:active { 432 | color: #52a341; 433 | } 434 | 435 | .weui-cell_switch { 436 | padding-top: 6px; 437 | padding-bottom: 6px; 438 | } 439 | 440 | .weui-uploader__hd { 441 | display: -webkit-box; 442 | display: -webkit-flex; 443 | display: flex; 444 | padding-bottom: 10px; 445 | -webkit-box-align: center; 446 | -webkit-align-items: center; 447 | align-items: center; 448 | } 449 | 450 | .weui-uploader__title { 451 | -webkit-box-flex: 1; 452 | -webkit-flex: 1; 453 | flex: 1; 454 | } 455 | 456 | .weui-uploader__info { 457 | color: #b2b2b2; 458 | } 459 | 460 | .weui-uploader__bd { 461 | margin-bottom: -4px; 462 | margin-right: -9px; 463 | overflow: hidden; 464 | } 465 | 466 | .weui-uploader__file { 467 | float: left; 468 | margin-right: 9px; 469 | margin-bottom: 9px; 470 | } 471 | 472 | .weui-uploader__img { 473 | display: block; 474 | width: 79px; 475 | height: 79px; 476 | } 477 | 478 | .weui-uploader__file_status { 479 | position: relative; 480 | } 481 | 482 | .weui-uploader__file_status:before { 483 | content: " "; 484 | position: absolute; 485 | top: 0; 486 | right: 0; 487 | bottom: 0; 488 | left: 0; 489 | background-color: rgba(0, 0, 0, 0.5); 490 | } 491 | 492 | .weui-uploader__file-content { 493 | position: absolute; 494 | top: 50%; 495 | left: 50%; 496 | -webkit-transform: translate(-50%, -50%); 497 | transform: translate(-50%, -50%); 498 | color: #fff; 499 | } 500 | 501 | .weui-uploader__input-box { 502 | float: left; 503 | position: relative; 504 | margin-right: 9px; 505 | margin-bottom: 9px; 506 | width: 77px; 507 | height: 77px; 508 | border: 1px solid #d9d9d9; 509 | } 510 | 511 | .weui-uploader__input-box:after, 512 | .weui-uploader__input-box:before { 513 | content: " "; 514 | position: absolute; 515 | top: 50%; 516 | left: 50%; 517 | -webkit-transform: translate(-50%, -50%); 518 | transform: translate(-50%, -50%); 519 | background-color: #d9d9d9; 520 | } 521 | 522 | .weui-uploader__input-box:before { 523 | width: 2px; 524 | height: 39.5px; 525 | } 526 | 527 | .weui-uploader__input-box:after { 528 | width: 39.5px; 529 | height: 2px; 530 | } 531 | 532 | .weui-uploader__input-box:active { 533 | border-color: #999; 534 | } 535 | 536 | .weui-uploader__input-box:active:after, 537 | .weui-uploader__input-box:active:before { 538 | background-color: #999; 539 | } 540 | 541 | .weui-uploader__input { 542 | position: absolute; 543 | z-index: 1; 544 | top: 0; 545 | left: 0; 546 | width: 100%; 547 | height: 100%; 548 | opacity: 0; 549 | } 550 | 551 | .weui-article { 552 | padding: 20px 15px; 553 | font-size: 15px; 554 | } 555 | 556 | .weui-article__section { 557 | margin-bottom: 1.5em; 558 | } 559 | 560 | .weui-article__h1 { 561 | font-size: 18px; 562 | font-weight: 400; 563 | margin-bottom: 0.9em; 564 | } 565 | 566 | .weui-article__h2 { 567 | font-size: 16px; 568 | font-weight: 400; 569 | margin-bottom: 0.34em; 570 | } 571 | 572 | .weui-article__h3 { 573 | font-weight: 400; 574 | font-size: 15px; 575 | margin-bottom: 0.34em; 576 | } 577 | 578 | .weui-article__p { 579 | margin: 0 0 0.8em; 580 | } 581 | 582 | .weui-msg { 583 | padding-top: 36px; 584 | text-align: center; 585 | } 586 | 587 | .weui-msg__link { 588 | display: inline; 589 | color: #586c94; 590 | } 591 | 592 | .weui-msg__icon-area { 593 | margin-bottom: 30px; 594 | } 595 | 596 | .weui-msg__text-area { 597 | margin-bottom: 25px; 598 | padding: 0 20px; 599 | } 600 | 601 | .weui-msg__title { 602 | margin-bottom: 5px; 603 | font-weight: 400; 604 | font-size: 20px; 605 | } 606 | 607 | .weui-msg__desc { 608 | font-size: 14px; 609 | color: #999; 610 | } 611 | 612 | .weui-msg__opr-area { 613 | margin-bottom: 25px; 614 | } 615 | 616 | .weui-msg__extra-area { 617 | margin-bottom: 15px; 618 | font-size: 14px; 619 | color: #999; 620 | } 621 | 622 | @media screen and (min-height:438px) { 623 | .weui-msg__extra-area { 624 | position: fixed; 625 | left: 0; 626 | bottom: 0; 627 | width: 100%; 628 | text-align: center; 629 | } 630 | } 631 | 632 | .weui-flex { 633 | display: -webkit-box; 634 | display: -webkit-flex; 635 | display: flex; 636 | } 637 | 638 | .weui-flex__item { 639 | -webkit-box-flex: 1; 640 | -webkit-flex: 1; 641 | flex: 1; 642 | } 643 | 644 | .weui-btn { 645 | margin-top: 15px; 646 | } 647 | 648 | .weui-btn:first-child { 649 | margin-top: 0; 650 | } 651 | 652 | .weui-btn-area { 653 | margin: 1.17647059em 15px 0.3em; 654 | } 655 | 656 | .weui-agree { 657 | display: block; 658 | padding: 0.5em 15px; 659 | font-size: 13px; 660 | } 661 | 662 | .weui-agree__text { 663 | color: #999; 664 | } 665 | 666 | .weui-agree__link { 667 | display: inline; 668 | color: #586c94; 669 | } 670 | 671 | .weui-agree__checkbox { 672 | position: absolute; 673 | left: -9999px; 674 | } 675 | 676 | .weui-agree__checkbox-icon { 677 | position: relative; 678 | top: 2px; 679 | display: inline-block; 680 | border: 1px solid #d1d1d1; 681 | background-color: #fff; 682 | border-radius: 3px; 683 | width: 11px; 684 | height: 11px; 685 | } 686 | 687 | .weui-agree__checkbox-icon-check { 688 | position: absolute; 689 | top: 1px; 690 | left: 1px; 691 | } 692 | 693 | .weui-footer { 694 | color: #999; 695 | font-size: 14px; 696 | text-align: center; 697 | } 698 | 699 | .weui-footer_fixed-bottom { 700 | position: fixed; 701 | bottom: 0.52em; 702 | left: 0; 703 | right: 0; 704 | } 705 | 706 | .weui-footer__links { 707 | font-size: 0; 708 | } 709 | 710 | .weui-footer__link { 711 | display: inline-block; 712 | vertical-align: top; 713 | margin: 0 0.62em; 714 | position: relative; 715 | font-size: 14px; 716 | color: #586c94; 717 | } 718 | 719 | .weui-footer__link:before { 720 | content: " "; 721 | position: absolute; 722 | left: 0; 723 | top: 0; 724 | width: 1px; 725 | bottom: 0; 726 | border-left: 1rpx solid #c7c7c7; 727 | color: #c7c7c7; 728 | left: -.65em; 729 | top: 0.36em; 730 | bottom: 0.36em; 731 | } 732 | 733 | .weui-footer__link:first-child:before { 734 | display: none; 735 | } 736 | 737 | .weui-footer__text { 738 | padding: 0 0.34em; 739 | font-size: 12px; 740 | } 741 | 742 | .weui-grids { 743 | border-top: 1rpx solid #d9d9d9; 744 | border-left: 1rpx solid #d9d9d9; 745 | overflow: hidden; 746 | } 747 | 748 | .weui-grid { 749 | position: relative; 750 | float: left; 751 | padding: 20px 10px; 752 | width: 33.33333333%; 753 | box-sizing: border-box; 754 | border-right: 1rpx solid #d9d9d9; 755 | border-bottom: 1rpx solid #d9d9d9; 756 | } 757 | 758 | .weui-grid_active { 759 | background-color: #ececec; 760 | } 761 | 762 | .weui-grid__icon { 763 | display: block; 764 | width: 28px; 765 | height: 28px; 766 | margin: 0 auto; 767 | } 768 | 769 | .weui-grid__label { 770 | margin-top: 5px; 771 | display: block; 772 | text-align: center; 773 | color: #000; 774 | font-size: 14px; 775 | white-space: nowrap; 776 | text-overflow: ellipsis; 777 | overflow: hidden; 778 | } 779 | 780 | .weui-loading { 781 | margin: 0 5px; 782 | width: 20px; 783 | height: 20px; 784 | display: inline-block; 785 | vertical-align: middle; 786 | -webkit-animation: a 1s steps(12) infinite; 787 | animation: a 1s steps(12) infinite; 788 | background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat; 789 | background-size: 100%; 790 | } 791 | 792 | .weui-loading.weui-loading_transparent { 793 | background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 100 100'%3E%3Cpath fill='none' d='M0 0h100v100H0z'/%3E%3Crect xmlns='http://www.w3.org/2000/svg' width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.56)' rx='5' ry='5' transform='translate(0 -30)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.5)' rx='5' ry='5' transform='rotate(30 105.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.43)' rx='5' ry='5' transform='rotate(60 75.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.38)' rx='5' ry='5' transform='rotate(90 65 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.32)' rx='5' ry='5' transform='rotate(120 58.66 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.28)' rx='5' ry='5' transform='rotate(150 54.02 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.25)' rx='5' ry='5' transform='rotate(180 50 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.2)' rx='5' ry='5' transform='rotate(-150 45.98 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.17)' rx='5' ry='5' transform='rotate(-120 41.34 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.14)' rx='5' ry='5' transform='rotate(-90 35 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.1)' rx='5' ry='5' transform='rotate(-60 24.02 65)'/%3E%3Crect width='7' height='20' x='46.5' y='40' fill='rgba(255,255,255,.03)' rx='5' ry='5' transform='rotate(-30 -5.98 65)'/%3E%3C/svg%3E"); 794 | } 795 | 796 | @-webkit-keyframes a { 797 | 0% { 798 | -webkit-transform: rotate(0deg); 799 | transform: rotate(0deg); 800 | } 801 | to { 802 | -webkit-transform: rotate(1turn); 803 | transform: rotate(1turn); 804 | } 805 | } 806 | 807 | @keyframes a { 808 | 0% { 809 | -webkit-transform: rotate(0deg); 810 | transform: rotate(0deg); 811 | } 812 | to { 813 | -webkit-transform: rotate(1turn); 814 | transform: rotate(1turn); 815 | } 816 | } 817 | 818 | .weui-badge { 819 | display: inline-block; 820 | padding: 0.15em 0.4em; 821 | min-width: 8px; 822 | border-radius: 18px; 823 | background-color: #e64340; 824 | color: #fff; 825 | line-height: 1.2; 826 | text-align: center; 827 | font-size: 12px; 828 | vertical-align: middle; 829 | } 830 | 831 | .weui-badge_dot { 832 | padding: 0.4em; 833 | min-width: 0; 834 | } 835 | 836 | .weui-loadmore { 837 | width: 65%; 838 | margin: 1.5em auto; 839 | line-height: 1.6em; 840 | font-size: 14px; 841 | text-align: center; 842 | } 843 | 844 | .weui-loadmore__tips { 845 | display: inline-block; 846 | vertical-align: middle; 847 | } 848 | 849 | .weui-loadmore_line { 850 | border-top: 1px solid #e5e5e5; 851 | margin-top: 2.4em; 852 | } 853 | 854 | .weui-loadmore__tips_in-line { 855 | position: relative; 856 | top: -.9em; 857 | padding: 0 0.55em; 858 | background-color: #fff; 859 | color: #999; 860 | } 861 | 862 | .weui-loadmore__tips_in-dot { 863 | position: relative; 864 | padding: 0 0.16em; 865 | width: 4px; 866 | height: 1.6em; 867 | } 868 | 869 | .weui-loadmore__tips_in-dot:before { 870 | content: " "; 871 | position: absolute; 872 | top: 50%; 873 | left: 50%; 874 | margin-top: -1px; 875 | margin-left: -2px; 876 | width: 4px; 877 | height: 4px; 878 | border-radius: 50%; 879 | background-color: #e5e5e5; 880 | } 881 | 882 | .weui-panel { 883 | background-color: #fff; 884 | margin-top: 10px; 885 | position: relative; 886 | overflow: hidden; 887 | } 888 | 889 | .weui-panel:first-child { 890 | margin-top: 0; 891 | } 892 | 893 | .weui-panel:before { 894 | top: 0; 895 | border-top: 1rpx solid #e5e5e5; 896 | } 897 | 898 | .weui-panel:after, 899 | .weui-panel:before { 900 | content: " "; 901 | position: absolute; 902 | left: 0; 903 | right: 0; 904 | height: 1px; 905 | color: #e5e5e5; 906 | } 907 | 908 | .weui-panel:after { 909 | bottom: 0; 910 | border-bottom: 1rpx solid #e5e5e5; 911 | } 912 | 913 | .weui-panel__hd { 914 | padding: 14px 15px 10px; 915 | color: #999; 916 | font-size: 13px; 917 | position: relative; 918 | } 919 | 920 | .weui-panel__hd:after { 921 | content: " "; 922 | position: absolute; 923 | left: 0; 924 | bottom: 0; 925 | right: 0; 926 | height: 1px; 927 | border-bottom: 1rpx solid #e5e5e5; 928 | color: #e5e5e5; 929 | left: 15px; 930 | } 931 | 932 | .weui-media-box { 933 | padding: 15px; 934 | position: relative; 935 | } 936 | 937 | .weui-media-box:before { 938 | content: " "; 939 | position: absolute; 940 | left: 0; 941 | top: 0; 942 | right: 0; 943 | height: 1px; 944 | border-top: 1rpx solid #e5e5e5; 945 | color: #e5e5e5; 946 | left: 15px; 947 | } 948 | 949 | .weui-media-box:first-child:before { 950 | display: none; 951 | } 952 | 953 | .weui-media-box__title { 954 | font-weight: 400; 955 | font-size: 17px; 956 | width: auto; 957 | overflow: hidden; 958 | text-overflow: ellipsis; 959 | white-space: nowrap; 960 | word-wrap: normal; 961 | word-wrap: break-word; 962 | word-break: break-all; 963 | } 964 | 965 | .weui-media-box__desc { 966 | color: #999; 967 | font-size: 13px; 968 | line-height: 1.2; 969 | overflow: hidden; 970 | text-overflow: ellipsis; 971 | display: -webkit-box; 972 | -webkit-box-orient: vertical; 973 | -webkit-line-clamp: 2; 974 | } 975 | 976 | .weui-media-box__info { 977 | margin-top: 15px; 978 | padding-bottom: 5px; 979 | font-size: 13px; 980 | color: #cecece; 981 | line-height: 1em; 982 | list-style: none; 983 | overflow: hidden; 984 | } 985 | 986 | .weui-media-box__info__meta { 987 | float: left; 988 | padding-right: 1em; 989 | } 990 | 991 | .weui-media-box__info__meta_extra { 992 | padding-left: 1em; 993 | border-left: 1px solid #cecece; 994 | } 995 | 996 | .weui-media-box__title_in-text { 997 | margin-bottom: 8px; 998 | } 999 | 1000 | .weui-media-box_appmsg { 1001 | display: -webkit-box; 1002 | display: -webkit-flex; 1003 | display: flex; 1004 | -webkit-box-align: center; 1005 | -webkit-align-items: center; 1006 | align-items: center; 1007 | } 1008 | 1009 | .weui-media-box__thumb { 1010 | width: 100%; 1011 | height: 100%; 1012 | vertical-align: top; 1013 | } 1014 | 1015 | .weui-media-box__hd_in-appmsg { 1016 | margin-right: 0.8em; 1017 | width: 60px; 1018 | height: 60px; 1019 | line-height: 60px; 1020 | text-align: center; 1021 | } 1022 | 1023 | .weui-media-box__bd_in-appmsg { 1024 | -webkit-box-flex: 1; 1025 | -webkit-flex: 1; 1026 | flex: 1; 1027 | min-width: 0; 1028 | } 1029 | 1030 | .weui-media-box_small-appmsg { 1031 | padding: 0; 1032 | } 1033 | 1034 | .weui-cells_in-small-appmsg { 1035 | margin-top: 0; 1036 | } 1037 | 1038 | .weui-cells_in-small-appmsg:before { 1039 | display: none; 1040 | } 1041 | 1042 | .weui-progress { 1043 | display: -webkit-box; 1044 | display: -webkit-flex; 1045 | display: flex; 1046 | -webkit-box-align: center; 1047 | -webkit-align-items: center; 1048 | align-items: center; 1049 | } 1050 | 1051 | .weui-progress__bar { 1052 | -webkit-box-flex: 1; 1053 | -webkit-flex: 1; 1054 | flex: 1; 1055 | } 1056 | 1057 | .weui-progress__opr { 1058 | margin-left: 15px; 1059 | font-size: 0; 1060 | } 1061 | 1062 | .weui-navbar { 1063 | display: -webkit-box; 1064 | display: -webkit-flex; 1065 | display: flex; 1066 | position: absolute; 1067 | z-index: 500; 1068 | top: 0; 1069 | width: 100%; 1070 | border-bottom: 1rpx solid #ccc; 1071 | } 1072 | 1073 | .weui-navbar__item { 1074 | position: relative; 1075 | display: block; 1076 | -webkit-box-flex: 1; 1077 | -webkit-flex: 1; 1078 | flex: 1; 1079 | padding: 13px 0; 1080 | text-align: center; 1081 | font-size: 0; 1082 | } 1083 | 1084 | .weui-navbar__item.weui-bar__item_on { 1085 | color: #1aad19; 1086 | } 1087 | 1088 | .weui-navbar__slider { 1089 | position: absolute; 1090 | content: " "; 1091 | left: 0; 1092 | bottom: 0; 1093 | width: 6em; 1094 | height: 3px; 1095 | background-color: #1aad19; 1096 | -webkit-transition: -webkit-transform 0.3s; 1097 | transition: -webkit-transform 0.3s; 1098 | transition: transform 0.3s; 1099 | transition: transform 0.3s, -webkit-transform 0.3s; 1100 | } 1101 | 1102 | .weui-navbar__title { 1103 | display: inline-block; 1104 | font-size: 15px; 1105 | max-width: 8em; 1106 | width: auto; 1107 | overflow: hidden; 1108 | text-overflow: ellipsis; 1109 | white-space: nowrap; 1110 | word-wrap: normal; 1111 | } 1112 | 1113 | .weui-tab { 1114 | position: relative; 1115 | height: 100%; 1116 | } 1117 | 1118 | .weui-tab__panel { 1119 | box-sizing: border-box; 1120 | height: 100%; 1121 | padding-top: 50px; 1122 | overflow: auto; 1123 | -webkit-overflow-scrolling: touch; 1124 | } 1125 | 1126 | .weui-search-bar { 1127 | position: relative; 1128 | padding: 8px 10px; 1129 | display: -webkit-box; 1130 | display: -webkit-flex; 1131 | display: flex; 1132 | box-sizing: border-box; 1133 | background-color: #efeff4; 1134 | border-top: 1rpx solid #d7d6dc; 1135 | border-bottom: 1rpx solid #d7d6dc; 1136 | } 1137 | 1138 | .weui-icon-search { 1139 | margin-right: 8px; 1140 | font-size: inherit; 1141 | } 1142 | 1143 | .weui-icon-search_in-box { 1144 | position: absolute; 1145 | left: 10px; 1146 | top: 7px; 1147 | } 1148 | 1149 | .weui-search-bar__text { 1150 | display: inline-block; 1151 | font-size: 14px; 1152 | vertical-align: middle; 1153 | } 1154 | 1155 | .weui-search-bar__form { 1156 | position: relative; 1157 | -webkit-box-flex: 1; 1158 | -webkit-flex: auto; 1159 | flex: auto; 1160 | border-radius: 5px; 1161 | background: #fff; 1162 | border: 1rpx solid #e6e6ea; 1163 | } 1164 | 1165 | .weui-search-bar__box { 1166 | position: relative; 1167 | padding-left: 30px; 1168 | padding-right: 30px; 1169 | width: 100%; 1170 | box-sizing: border-box; 1171 | z-index: 1; 1172 | } 1173 | 1174 | .weui-search-bar__input { 1175 | height: 28px; 1176 | line-height: 28px; 1177 | font-size: 14px; 1178 | } 1179 | 1180 | .weui-icon-clear { 1181 | position: absolute; 1182 | top: 0; 1183 | right: 0; 1184 | padding: 7px 8px; 1185 | font-size: 0; 1186 | } 1187 | 1188 | .weui-search-bar__label { 1189 | position: absolute; 1190 | top: 0; 1191 | right: 0; 1192 | bottom: 0; 1193 | left: 0; 1194 | z-index: 2; 1195 | border-radius: 3px; 1196 | text-align: center; 1197 | color: #9b9b9b; 1198 | background: #fff; 1199 | line-height: 28px; 1200 | } 1201 | 1202 | .weui-search-bar__cancel-btn { 1203 | margin-left: 10px; 1204 | line-height: 28px; 1205 | color: #09bb07; 1206 | white-space: nowrap; 1207 | } 1208 | 1209 | /* add by KuangPF V1.0.0*/ 1210 | 1211 | a { 1212 | text-decoration: none; 1213 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 1214 | } 1215 | 1216 | body { 1217 | -webkit-tap-highlight-color: transparent; 1218 | } 1219 | --------------------------------------------------------------------------------