init

.babelrc

+{
+  "presets":["@babel/preset-env"],
+  "plugins": ["@babel/plugin-proposal-class-properties"]
+}
\ No newline at end of file

.eslintignore

+/webpack.*.js
+/server.js
+/src/assets/js/*.js
+/src/pages/**/anysignWebInterface.js
+/src/pages/anysignpage/**/
\ No newline at end of file

.eslintrc.js

+module.exports = {
+    "parser": "babel-eslint",
+    "extends": "airbnb-base",
+    "env": {
+        "browser": true,
+        "commonjs": true,
+        "es6": true,
+        jquery: true
+    },
+    "rules": {
+        "no-tabs": 0,
+        "indent": [2, "tab"],
+        "quotes": [
+            "error",
+            "single"
+        ],
+        "semi": [
+            "error",
+            "always"
+        ],
+        "no-underscore-dangle": ["off", "always"]
+    }
+};
\ No newline at end of file

.postcssrc.js

+// https://github.com/michael-ciniawsky/postcss-load-config
+
+module.exports = {
+  "plugins": {
+    "postcss-import": {},
+    "postcss-url": {},
+    "postcss-aspect-ratio-mini": {}, 
+    autoprefixer: {},
+    "postcss-aspect-ratio-mini": {},
+    "postcss-write-svg": {
+      utf8: false
+    },
+    "postcss-px-to-viewport": {
+      viewportWidth: 750,
+      viewportHeight: 1334,
+      unitPrecision: 1,
+      viewportUnit: 'vw',
+      selectorBlackList: [".ignore", ".hairlines"],
+      minPixelValue: 1,
+      mediaQuery: false,
+      exclude: [/node_modules/, /dialog.css/]
+    },
+    "postcss-viewport-units":{
+      silence: true
+    }
+  }
+}

README.md

+# 多页面 客户通用于单个页面比如落地页面、活动页面
+
+## 介绍
+支持es6，全局以引入jquery。用于单个页面独立页面开发。比如落地页面，活动页面。
+
+### ui组建 通用类
+[swiper 幻灯片轮播图](https://github.com/nolimits4web/Swiper)
+
+[dialog 弹框-alert，confirm、loading..](https://github.com/sufangyu/dialog2)
+
+## Project setup
+```
+yarn install
+```
+
+### Compiles and hot-reloads for development
+```
+yarn run serve
+```
+
+### Compiles and minifies for production
+```
+yarn run build
+```
+
+### 手机适配方案
+[再聊移动端页面的适配](https://www.w3cplus.com/css/vw-for-layout.html)
+[如何在Vue项目中使用vw实现移动端适配](https://www.w3cplus.com/mobile/vw-layout-in-vue.html)
+

package.json

+{
+  "name": "activity-2020",
+  "version": "1.0.0",
+  "description": "tpt activity",
+  "private": true,
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "serve": "node server.js",
+    "build": "webpack --config webpack.prod.js"
+  },
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@babel/core": "^7.5.5",
+    "@babel/preset-env": "^7.5.5",
+    "autoprefixer": "^9.6.1",
+    "babel-loader": "^8.0.6",
+    "clean-webpack-plugin": "^3.0.0",
+    "copy-webpack-plugin": "^5.1.1",
+    "css-loader": "^3.2.0",
+    "csv-loader": "^3.0.2",
+    "eslint": "^6.1.0",
+    "eslint-loader": "^3.0.2",
+    "express": "^4.17.1",
+    "express-http-proxy": "^1.5.1",
+    "file-loader": "^4.2.0",
+    "html-loader": "^0.5.5",
+    "html-webpack-plugin": "^3.2.0",
+    "jquery": "^3.4.1",
+    "md5": "^2.2.1",
+    "mescroll.js": "^1.4.1",
+    "mini-css-extract-plugin": "^0.8.0",
+    "mobile-select": "^1.1.2",
+    "node-sass": "^4.12.0",
+    "postcss-aspect-ratio-mini": "^1.0.1",
+    "postcss-import": "^12.0.1",
+    "postcss-loader": "^3.0.0",
+    "postcss-px-to-viewport": "^1.1.1",
+    "postcss-url": "^8.0.0",
+    "postcss-viewport-units": "^0.1.6",
+    "postcss-write-svg": "^3.0.1",
+    "prettier": "^1.18.2",
+    "sass-loader": "^7.2.0",
+    "style-loader": "^1.0.0",
+    "swiper": "3.4.2",
+    "terser-webpack-plugin": "^2.3.5",
+    "tpt-js-sdk": "^1.1.6",
+    "url-loader": "^2.1.0",
+    "webpack": "^4.39.1",
+    "webpack-cli": "^3.3.6",
+    "webpack-dev-middleware": "^3.7.0",
+    "webpack-hot-middleware": "^2.25.0",
+    "webpack-merge": "^4.2.1",
+    "xml-loader": "^1.2.1"
+  },
+  "devDependencies": {
+    "@babel/plugin-proposal-class-properties": "^7.8.3",
+    "babel-eslint": "^10.0.3",
+    "eslint-config-airbnb-base": "^14.0.0",
+    "eslint-plugin-import": "^2.18.2",
+    "glob": "^7.1.6"
+  }
+}

server.js

+const express = require('express');
+const webpack = require('webpack');
+const webpackDevMiddleware = require('webpack-dev-middleware');
+const webpackHotMiddleware = require('webpack-hot-middleware');
+const proxy = require('express-http-proxy'); 
+
+const app = express();
+const config = require('./webpack.dev.js');
+const compiler = webpack(config);
+
+// 告诉 express 使用 webpack-dev-middleware，
+// 以及将 webpack.config.js 配置文件作为基础配置
+app.use(webpackDevMiddleware(compiler, {
+	publicPath: config.output.publicPath
+}));
+
+app.use('/sit', proxy('ecustomer.tp95589.com', {
+	https: true,
+	proxyReqPathResolver: function(req) {
+		console.log(`请求的路径：${req.url}`);     //请求的路径：
+		return `/sit${req.url}`;        //转发请求路径： 
+	},
+}));
+
+app.use(webpackHotMiddleware(compiler ,{
+	log: console.log,
+	heartbeat: 2000,
+}));
+
+// 将文件 serve 到 port 3000。
+app.listen(3000, function () {
+	console.log('Example app listening on port 3000!\n');
+});
\ No newline at end of file

src/assets/iconfont/iconfont.scss

+@font-face {
+  font-family: 'kht';
+  src: url('./iconfont.ttf') format('truetype');
+}
+
+.kht {
+  font-family: "kht" !important;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.kht-weixin:before {
+  content: "\e63d";
+}
+
+.kht-Alipay:before {
+  content: "\e6ec";
+}
+
+.kht-arrow:before {
+  content: "\e632";
+}
+
+.kht-calendar-o:before {
+  content: "\e633";
+}
+
+.kht-WeChat:before {
+  content: "\e635";
+}
+
+.kht-no-checked:before {
+  content: "\e634";
+}
+
+.kht-checked:before {
+  content: "\e636";
+}
+
+.kht-add-o:before {
+  content: "\e637";
+}
+
+.kht-delete-o:before {
+  content: "\e638";
+}
+
+.kht-top-o:before {
+  content: "\e604";
+}
+
+.kht-down-o:before {
+  content: "\e646";
+}
+
+.kht-close-o:before {
+  content: "\e647";
+}
+
+.kht-counter-o:before {
+  content: "\e648";
+}
+
+.kht-question:before {
+  content: "\e649";
+}
+
+.kht-answer:before {
+  content: "\e64a";
+}
+
+.kht-down-origin:before {
+  content: "\e64b";
+}
\ No newline at end of file

src/assets/js/shence.js

+import config  from '../../config/config'
+(function(para) {
+  var p = para.sdk_url, n = para.name, w = window, d = document, s = 'script',x = null,y = null;
+  if(typeof(w['sensorsDataAnalytic201505']) !== 'undefined') {
+      return false;
+  }
+  w['sensorsDataAnalytic201505'] = n;
+  w[n] = w[n] || function(a) {return function() {(w[n]._q = w[n]._q || []).push([a, arguments]);}};
+  var ifs = ['track','quick','register','registerPage','registerOnce','trackSignup', 'trackAbtest', 'setProfile','setOnceProfile','appendProfile', 'incrementProfile', 'deleteProfile', 'unsetProfile', 'identify','login','logout','trackLink','clearAllRegister','getAppStatus'];
+  for (var i = 0; i < ifs.length; i++) {
+    w[n][ifs[i]] = w[n].call(null, ifs[i]);
+  }
+  if (!w[n]._t) {
+    x = d.createElement(s), y = d.getElementsByTagName(s)[0];
+    x.async = 1;
+    x.src = p;
+    x.setAttribute('charset','UTF-8');
+    w[n].para = para;
+    y.parentNode.insertBefore(x, y);
+  }
+})({
+  sdk_url: 'https://ecustomer.cntaiping.com/static/npm/sa-sdk-javascript/sensorsdata.min.js',
+  heatmap_url: 'https://ecustomer.cntaiping.com/static/npm/sa-sdk-javascript/heatmap.min.js',
+  name: 'sensors',
+  use_app_track: true,
+  server_url: `${config.shenceUrl[config.ENV]}`,
+  heatmap:{}
+});
+sensors.quick('autoTrack');
+sensors.quick('isReady',function(){
+  sessionStorage.setItem('anonymousId', sensors.quick('getAnonymousID'));
+});
\ No newline at end of file

src/config/config.js

+const ENV = 'SIT';
+// const ENV = 'UAT';
+// const ENV = 'PRO';
+
+const urlList = {
+	SIT: 'https://ecustomer.tp95589.com/sit',
+	UAT: 'https://ecustomer.tp95589.com',
+	// SIT: 'http://localhost:3000/sit',
+	PRO: 'https://ecustomer.cntaiping.com',
+};
+
+const fileUrl = {
+	SIT: 'https://ecustomer.tp95589.com',
+	UAT: 'https://ecustomer.tp95589.com',
+	// SIT: 'http://localhost:8080',
+	// UAT: 'http://localhost:8080',
+	PRO: 'https://ecustomer.cntaiping.com',
+};
+
+const shenceUrl = {
+	SIT: 'https://yhxwtz_test.ft.cntaiping.com:8111/sa?project=tpt_test',
+	PRO: 'https://cd.life.cntaiping.com:8106/sa?project=chinataiping',
+};
+
+const baseUrl = urlList[ENV];
+
+const responseCode = {
+	businessError: ['9794', '9894', '9896', '9797', '9796', '9795', '9793'],
+	networkError: '网络不稳定，请稍后再试',
+	systemError: '系统繁忙，请稍后再试',
+};
+
+const uXZ = navigator.userAgent;
+const isAndroidXZ = uXZ.indexOf('Android') > -1 || uXZ.indexOf('Linux') > -1; // android终端或者uc浏览器
+const isiOSXZ = !!uXZ.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
+const isKhtAPP = uXZ.indexOf('kehutong') > -1;
+const uaXZ = window.navigator.userAgent.toLowerCase();
+const isWeixin = uaXZ.indexOf('micromessenger') !== -1;
+
+export default {
+	responseCode,
+	baseUrl,
+	fileUrl,
+	ENV,
+	isAndroidXZ,
+	isiOSXZ,
+	isWeixin,
+	shenceUrl,
+	isKhtAPP,
+};

src/config/fetch.js

+import * as TPTJS from 'tpt-js-sdk';
+import config from './config';
+import { Toast } from './toast';
+import '../assets/js/dialog.min';
+
+const loadingGif = require('../assets/images/loading.gif');
+
+class Fetch {
+	constructor() {
+		this.loading = undefined;
+		this.loadingNumber = 0;
+	}
+
+	loading
+
+	loadingNumber
+
+	cleanLoading = () => {
+		this.loading.close();
+		this.loadingNumber = 0;
+		this.loading = undefined;
+	}
+
+	handleResponse = (params, res, resolve) => {
+		if (config.responseCode.businessError.indexOf(res.code) !== -1) {
+			if (this.loadingNumber > 0 && !params.noLoading) {
+				this.cleanLoading();
+			}
+			TPTJS.khtAppRouteRequest('0', '', '0', 'native', 'LogIn');
+		} else if (res.code !== '0000') {
+			if (!params.notToast) {
+				Toast(res.desc, 3000);
+			}
+			if (this.loadingNumber > 0 && !params.noLoading) {
+				this.cleanLoading();
+			}
+			if (params.errorFuc) {
+				params.errorFuc();
+			}
+		} else {
+			if (!params.keepLoading && this.loadingNumber > 0 && !params.noLoading) {
+				this.cleanLoading();
+			}
+			resolve(res.data);
+		}
+	}
+
+	commonErrorHandle = (params, err, reject) => {
+		if (this.loadingNumber > 0) {
+			this.cleanLoading();
+		}
+		reject(err);
+		if (params.errorFuc) {
+			params.errorFuc();
+		}
+	}
+
+	post = (params) => new Promise((resolve, reject) => {
+		const that = this;
+		if (that.loadingNumber < 1 && !params.noLoading) {
+			that.loadingNumber += 1;
+			that.loading = $(document).dialog({
+				type: 'toast',
+				infoIcon: loadingGif,
+				infoText: '正在加载中',
+			});
+		}
+		$.ajax({
+			url: `${params.baseUrl ? params.baseUrl : config.baseUrl}${params.url ? params.url : 'url'}`,
+			contentType: 'application/json',
+			method: 'POST',
+			headers: {
+				'Content-Type': 'application/json;charset=UTF-8',
+				anonymousId: sessionStorage.getItem('anonymousId'),
+				'x-ac-token-ticket': sessionStorage.getItem('token') || '',
+			},
+			data: JSON.stringify(params.data),
+			success(res) {
+				that.handleResponse(params, res, resolve);
+			},
+			error(err) {
+				that.commonErrorHandle(params, err, reject);
+			},
+		});
+	});
+
+	get = (params) => new Promise((resolve, reject) => {
+		const that = this;
+		if (that.loadingNumber < 1 && !params.noLoading) {
+			that.loadingNumber += 1;
+			that.loading = $(document).dialog({
+				type: 'toast',
+				infoIcon: loadingGif,
+				infoText: '正在加载中',
+			});
+		}
+		$.ajax({
+			url: `${config.baseUrl}${params.url ? params.url : 'url'}`,
+			contentType: 'application/json',
+			method: 'GET',
+			headers: {
+				'Content-Type': 'application/json;charset=UTF-8',
+				anonymousId: sessionStorage.getItem('anonymousId'),
+				'x-ac-token-ticket': sessionStorage.getItem('token') || '',
+			},
+			success(res) {
+				that.handleResponse(params, res, resolve);
+			},
+			error(err) {
+				that.commonErrorHandle(params, err, reject);
+			},
+		});
+	});
+}
+
+const fetch = new Fetch();
+export default fetch;

src/config/personSecretContent.js

+import '../pages/style/personSecret.scss';
+
+(function () {
+	$('body').append(`<div id="ysxyContent" class="sign-up-content">
+  <div class="dialog-overlay"></div>
+  <div class="dialog-content">
+    <div class="modal-content">
+      <div class="row modal-header">
+        <h3 class="modal-title">《太平集团用户隐私条款》</h3>
+        <span class="kht kht-close-o"></span>
+      </div>
+      <div class="modal-body">
+        <div class="indent" style="font-weight:bold">本平台采取严格的隐私政策，尊重并保护用户隐私，请会员仔细阅读并了解。
+        </div>
+        <div class="indent" style="font-weight:bold">1、收集个人信息的目的及其使用
+        </div>
+        <div class="indent" style="font-weight:bold">本平台可能将用户所提供的个人信息用于以下一项或多项目的：
+        </div>
+        <div class="indent" style="font-weight:bold">1) 帮助您完成注册；
+        </div>
+        <div class="indent" style="font-weight:bold">2) 向您提供商品或服务；
+        </div>
+        <div class="indent" style="font-weight:bold">3) 向您推送商品及服务相关的消息；
+        </div>
+        <div class="indent" style="font-weight:bold">4) 更准确的身份确认；
+        </div>
+        <div class="indent" style="font-weight:bold">5) 为您提供安全保障；
+        </div>
+        <div class="indent" style="font-weight:bold">6) 改进我们的服务。
+        </div>
+        <div class="indent" style="font-weight:bold">2、本平台对个人信息安全的承诺
+        </div>
+        <div class="indent" style="font-weight:bold">
+            为保持数据的准确性，防止擅自入侵及确保个人信息的正确使用，本平台采取了适当的硬件、电子及管理措施以保障本平台收集个人资料的保密性。通过内部安全管理规范、技术手段、加密处理等各种措施保证信息安全并承诺不对个人信息进行非法处理。
+        </div>
+        <div class="indent" style="font-weight:bold">3、本平台所收集的信息
+        </div>
+        <div class="indent" style="font-weight:bold">个人信息包括但不限于：
+        </div>
+        <div class="indent" style="font-weight:bold">1) 您提供的信息
+        </div>
+        <div class="indent" style="font-weight:bold">（1）您在注册账户或使用我们的服务时，向我们提供的相关个人信息，例如姓名、证件类型和证件号码、电话号码、电子邮件、联系地址、职业等。
+        </div>
+        <div class="indent" style="font-weight:bold">（2）您通过我们的服务向其他方提供的共享信息，以及您使用我们的服务时所储存的信息。
+        </div>
+        <div class="indent" style="font-weight:bold">2) 我们获取的您的信息
+        </div>
+        <div class="indent" style="font-weight:bold">
+            为使本平台服务更加贴合用户的需求，了解产品的适配性、识别账号的异常状态等，我们会收集、汇总、记录的信息，例如日志信息、设备信息、位置信息等。
+        </div>
+        <div class="indent" style="font-weight:bold">4、如何查询或修改用户的个人信息
+        </div>
+        <div class="indent" style="font-weight:bold">用户可在“我的”或用户中心项下的“个人信息”中查询并修改个人信息。每当用户的个人信息有所变化时，应当及时更新。
+        </div>
+        <div class="indent" style="font-weight:bold">5、保护用户的隐私权
+        </div>
+        <div class="indent" style="font-weight:bold">
+            本平台完全遵守相关法律条例的要求，确保用户隐私。本平台会将个人信息的收集和使用限制在必须范围之内，以便管理业务、为用户提供最高质量的服务以及提供各项优惠信息。用户知悉并不可撤销地授权以下事宜：本平台所属太平集团（官网：http://www.cntaiping.com/）及其关联公司，可以收集、整理、分析、使用及保存您的个人信息，并可在太平集团及其关联公司内部相互提供、分析和使用，还可基于为您提供服务而与第三方合作，将您的个人信息提供给第三方使用，例如将您的个人信息提供给第三方进行身份认证。为确保用户信息的安全，太平集团及其关联公司对上述信息负有保密义务，并采取合理措施保证信息安全。如果用户不希望收到第三方推送的信息，不希望用户个人信息被除太平集团及其关联公司外的其他第三方使用，可以在提供个人信息时或其他任何时候向本平台明示告知，本平台将不会将明示的客户信息交给任何第三方，但若因此导致用户无法使用本平台的所有或部分服务，本平台不承担任何责任。如涉及个人信息隐私投诉，可致电中国太平官方热线95589。
+        </div>
+        <div class="indent" style="font-weight:bold">6、隐私政策的更改
+        </div>
+        <div class="indent" style="font-weight:bold">
+            一旦本平台更改了隐私申明，将采用在网站、APP公告或站内消息等方式通知用户修改、增加或删减的内容，不承担事先单独通知义务。一经本平台通过上述方式通知，即视为上述内容已经通知到用户。若用户在本协议及各类规则变更后继续使用本平台服务的，视为用户已仔细认真阅读、充分理解并同意接受修改后的隐私声明。
+        </div>
+      </div>
+    </div>
+  </div>
+</div>`);
+	$('#ysxyContent').on('click', 'span.kht-close-o', () => {
+		$('body').css('overflow', '');
+		$('body').css('position', '');
+		$('body').css('top', '');
+		$('body').css('bottom', '');
+		$('body').css('left', '');
+		$('body').css('right', '');
+		$('#ysxyContent').hide();
+	});
+}());

src/config/shareInwx.js

+/* eslint-disable func-names */
+import fetch from './fetch';
+import config from './config';
+
+// 微信分享
+export default function shareInwx(wxCommonShareInfo) {
+	const params = {
+		url: '/commonms/weixin/sign',
+		data: {
+			url: window.location.href.split('#')[0],
+		},
+		noLoading: true,
+	};
+	fetch.post(params).then((res) => {
+		if (res) {
+			const { noncestr, signature, timestamp } = res;
+			const { wx } = window;
+
+			wx.config({
+				appId: config.ENV === 'SIT' ? 'wx23545612bdc40140' : 'wx2766839a4991bd6b',
+				timestamp, // 必填，生成签名的时间戳
+				nonceStr: noncestr, // 必填，生成签名的随机串
+				signature, // 必填，签名
+				jsApiList: ['updateAppMessageShareData', 'updateTimelineShareData'], // 必填，需要使用的JS接口列表
+			});
+
+			// eslint-disable-next-line prefer-arrow-callback
+			wx.ready(function () {
+				wx.updateAppMessageShareData({ // 分享好友
+					title: wxCommonShareInfo.title,
+					desc: wxCommonShareInfo.content,
+					link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+					imgUrl: wxCommonShareInfo.imgUrl, // 分享图标
+					success() {
+						// 用户点击了分享后执行的回调函数
+					},
+				});
+				wx.updateTimelineShareData({ // 分享朋友圈
+					title: wxCommonShareInfo.title,
+					link: window.location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+					imgUrl: wxCommonShareInfo.imgUrl, // 分享图标
+					success() {
+						// 用户点击了分享后执行的回调函数
+					},
+				});
+			});
+
+			// eslint-disable-next-line prefer-arrow-callback
+			wx.error(function (errMsg) {
+				// eslint-disable-next-line no-console
+				console.log(errMsg);
+			});
+		}
+	});
+}

src/config/toast.js

+export function Toast(msg, duration) {
+	// eslint-disable-next-line no-restricted-globals
+	const durationLocal = isNaN(duration) ? 3000 : duration;
+	const m = document.createElement('div');
+	m.id = 'Toast';
+	m.innerHTML = msg;
+	m.style.cssText = 'opacity: 0.7;padding: 7px 10px; -webkit-transform: translateX(-50%);transform: translateX(-50%);color: rgb(255, 255, 255);line-height: 20px;text-align: center;border-radius: 5px;position: fixed;top: 40%;left:50%;z-index: 999999;background: rgb(0, 0, 0);font-size: 12px;';
+	document.body.appendChild(m);
+	setTimeout(() => {
+		const d = 0.5;
+		m.style.webkitTransition = `-webkit-transform ${d}s ease-in, opacity ${d}s ease-in`;
+		m.style.opacity = '0';
+		setTimeout(() => {
+			if ($('#Toast').length > 0) {
+				$('#Toast').remove();
+			}
+		}, d * 1000);
+	}, durationLocal);
+}
+
+export function ToastHide() {
+	if ($('#Toast').length > 0) {
+		$('#Toast').remove();
+	}
+}

src/config/utils.js

+import config from './config';
+
+// 获取token
+export function getToken() {
+	if (config.isAndroidXZ) {
+		// eslint-disable-next-line no-undef
+		kht.getTokenAndUserId();
+	} else if (config.isiOSXZ) {
+		window.webkit.messageHandlers.getIssureToken.postMessage({});
+	}
+}
+
+/**
+ * 原生路由跳转
+ * @param authorization number 1: 需要实名认证
+ * @param detail string
+ * @param loginStatus number 1: 登录 0: 不用登录
+ * @param pageType string  RN HTML native
+ * @param tagUrl string
+ */
+export function khtAppRouteRequest(authorization, detail,
+	loginStatus, pageType, tagUrl) {
+	if (config.isAndroidXZ) {
+		// eslint-disable-next-line no-undef
+		kht.khtAppRouteRequest(
+			authorization,
+			detail,
+			loginStatus,
+			pageType,
+			tagUrl,
+		);
+	} else if (config.isiOSXZ) {
+		window.webkit.messageHandlers.khtAppRouteRequest.postMessage({
+			authorization,
+			detail,
+			loginStatus,
+			pageType,
+			tagUrl,
+		});
+	}
+}
+
+/**
+ * 原生唤起是否登录
+ */
+export function login() {
+	if (config.isAndroidXZ) {
+		// eslint-disable-next-line no-undef
+		khtAppRouteRequest(0, '', 0, 'native', 'LogIn');
+	} else if (config.isiOSXZ) {
+		khtAppRouteRequest(0, '', 0, 'native', 'LogIn');
+	}
+}
+
+/**
+ * 获取数组对应值
+ * @param arr
+ * @param value
+ */
+export function choiceArr(arr, value, valueName = 'value') {
+	return arr.findIndex((element) => (element[valueName] === value));
+}
+
+/**
+ * 转base64
+ * @param {*} img
+ * @param {*} width
+ * @param {*} height
+ */
+export function getBase64Image(img) {
+	const canvas = document.createElement('canvas');
+	canvas.width = img.width;
+	canvas.height = img.height;
+	const ctx = canvas.getContext('2d');
+	ctx.drawImage(img, 0, 0, img.width, img.height);
+	const dataURL = canvas.toDataURL('image/png');
+	return dataURL;
+}

src/pages/inlineshow/index.html

+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
+	<title>直播：经济学家邵宇上线太平通，看全球疫情下的经济走向</title>
+	<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
+</head>
+<body>
+	<div class="inline-show">
+		<img src="../../assets/images/qr_inline_1.png"  class="bg-img"/>
+		<button id="btnInline" class="btn-inline"></button>
+	</div>
+</body>
+</html>
\ No newline at end of file

src/pages/inlineshow/index.js

+import './index.scss';
+import config from '../../config/config';
+import fetch from '../../config/fetch';
+import shareInwx from '../../config/shareInwx';
+
+require('../../config/shareDownLoad.js');
+require('../../assets/js/shence.js');
+
+const img = new Image();
+// eslint-disable-next-line import/no-unresolved
+img.src = require('../../assets/images/bg_inline-show_1.png');
+
+img.onload = () => {
+	$('.inline-show').css('backgroundImage', `url(${img.src})`);
+};
+
+$('#btnInline').on('click', () => {
+	window.location.href = 'https://m.zaojiu.com/V2/action/channel/contentTplife.html';
+});
+
+// 分享
+const commonShareInfo = {
+	title: '直播：经济学家邵宇上线太平通，看全球疫情下的经济走向',
+	imgUrl: 'https://ecustomer.cntaiping.com/static/rn/src/img/pic_weixin_share_three.png',
+	content: '看直播，更有一波福利赶来',
+};
+
+// 微信分享
+if (config.isWeixin) {
+	shareInwx(commonShareInfo);
+}
+
+// 计算参与活动人数
+function getNewsDetail(newsId) {
+	const params = {
+		url: '/campaignsms/essay/queryEssayDetail',
+		data: {
+			essayId: newsId,
+		},
+	};
+	return fetch.post(params);
+}
+getNewsDetail(293);

src/pages/inlineshow/index.scss

+@import '../style/index.scss';
+.inline-show {
+  background-color: #fff;
+  background-image: url('../../assets/images/bg_inline-show_1_compressed.png');
+  background-repeat: no-repeat;
+  background-size: 100%;
+  padding-top: 376.94%;
+  overflow-x: hidden;
+  position: relative;
+  .btn-inline {
+    z-index: 2;
+    outline: none;
+    position: absolute;
+    top: 1936px;
+    left: 50%;
+    transform: translateX(-50%);
+    border: 0;
+    width: 360px;
+    height: 90px;
+    background-color: transparent;
+  }
+  .bg-img {
+    opacity: 0;
+    position: absolute;
+    height: 100%;
+    width: auto;
+    bottom: 0;
+  }
+}

src/pages/style/downloadInwx.scss

+@import './index.scss';
+.share-download-wx {
+  .row {
+    display: flex;
+    flex-direction: row;
+  }
+  .col {
+    display: flex;
+    flex-direction: column;
+  }
+  .centerX {
+    justify-content: center;
+  }
+  .centerY {
+    align-items: center;
+  }
+  .btn {
+    padding: 9px 20px;
+    border-radius: 8px;
+    border: 0;
+    &:disabled {
+      opacity: 0.6;
+    }
+    &:focus {
+      outline: 0;
+    }
+    &:active {
+      opacity: 0.6;
+    }
+    &.full {
+      width: 100%;
+      padding: 34px 0;
+    }
+  }
+  .bg-color-blue {
+    background-color: #0E6DCF;
+  }
+  .nav {
+    align-items: center;
+    justify-content: space-between;
+    background-color: #000;
+    opacity:0.7;
+    padding: 8px 40px 8px 45px;
+    position: fixed;
+    left: 0;
+    right: 0;
+    visibility: hidden;
+    z-index: 2;
+    &.di {
+      transform: translateY(-56px);
+      opacity: 0;
+    }
+    &.down-top {
+      top: 0;
+      transition: transform .6s;
+    }
+    &.down-bottom {
+      bottom: 0;
+      transform: translateY(100px);
+      transition: transform .6s;
+    }
+    .nav-left {
+      height: 64px;
+      align-items: center;
+      flex: 1;
+      .logo-small {
+        height: 100%;
+        margin-right: 20px;
+      }
+    }
+    &.show {
+      transform: translateY(0);
+      opacity: 0.7;
+    }
+  }
+  .sign-up-content {
+    position: fixed;
+    height: 100vh;
+    width: 100%;
+    top: 0;
+    z-index: 999;
+    .dialog-overlay {
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: 10002;
+      width: 100%;
+      height: 100%;
+      background-color: rgba(0, 0, 0, 0.5);
+    }
+    .dialog-content {
+      position: absolute;
+      overflow: scroll;
+      max-height: 100%;
+      top: 50%;
+      left: 50%;
+      z-index: 10003;
+      transform: translate(-50%, -50%);
+      border-radius: 24px;
+      width: 690px;
+      background: #fff;
+    }
+  }
+  .sign-up {
+    padding: 30px;
+    .sign-up-header {
+      justify-content: flex-end;
+      &>span {
+        font-size: 48px;
+      }
+    }
+    .sign-up-logo {
+      img {
+        width: 254px;
+        height: 74px;
+      }
+      .logo-dec {
+        margin-left: 90px;
+        width: 200px;
+        p {
+          color:#0E6DCF;
+          font-size: 30px;
+          &:last-child {
+            text-align: right;
+          }
+        }
+      }
+    }
+    input {
+      outline: none;
+    }
+    .input-check {
+      margin-right: 10px;
+      &+label {
+        position: absolute;
+        &::before{
+          display: block;
+          content: "\e634";
+          font-size: 32px;
+          color: #0E6DCF;
+        }
+      }
+      &:checked {
+        &+label {
+          &::before{
+            display: block;
+            content: "\e636";
+            font-size: 32px;
+            color: #0E6DCF;
+          }
+        }
+      }
+    }
+    .sign-up-welcome {
+      margin: 46px 0 60px 0;
+    }
+    .sign-up-input {
+      .line {
+        justify-content: space-between;
+        border-bottom: 2px solid #E4E8F4;
+        padding-bottom: 20px;
+        margin-bottom: 20px;
+        .outline-select {
+          outline: none;
+          font-size: 32px;
+          color: #333333;
+          background: transparent;
+        }
+        .outline-input {
+          flex: 1;
+          border: 0px;
+          background: transparent;
+          font-size: 32px;
+          color: #B7B7B7;
+        }
+        .btn {
+          font-size: 28px;
+        }
+      }
+      
+    }
+    .sign-up-xy {
+      align-items: center;
+      margin-bottom: 60px;
+      input[type="checkbox"] {
+        visibility: hidden;
+      }
+      &>p {
+        font-size: 24px;
+        color: #666666;
+        &>span {
+          font-size: 24px;
+          color: #0E6DCF;
+          &:active {
+            opacity: 0.6;
+          }
+        }
+      }
+    }
+  }
+  #dialogSignIn {
+    display: none;
+  }
+}
+#xyContent {
+  display: none;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  z-index: 1004;
+  top: 0;
+  .row {
+    display: flex;
+    flex-direction: row;
+  }
+  .modal-content {
+    background-color: #fff;
+    overflow-y: scroll;
+    height: 100%;
+  }
+  .modal-header {
+    justify-content: space-between;
+    border-bottom: 2px solid #e9ecef;
+    padding: 32px;
+  }
+  .modal-body {
+    padding: 30px;
+  }
+  .indent {
+    font-size: 24px;
+    text-indent: 48px;
+  }
+}
+#ysxyContent {
+  display: none;
+  .dialog-content {
+    border-radius: 10px;
+  }
+  .modal-header {
+    justify-content: space-between;
+    border-bottom: 2px solid #e9ecef;
+    padding: 32px;
+  }
+  .modal-body {
+    padding: 30px;
+  }
+  .indent {
+    font-size: 24px;
+    text-indent: 48px;
+  }
+}
\ No newline at end of file

src/pages/style/index.scss

+@import '../../assets/iconfont/iconfont.scss';
+@import './dialog.css';
+body {
+  margin: 0;
+}
+* {
+  box-sizing: border-box;
+}
+ul,li {
+  padding:0;
+  margin:0;
+  list-style:none;
+}
+img {
+  content: normal !important;
+}
+p, h3 {
+  margin: 0;
+}
+a {
+  text-decoration: none;
+}
+.dialog-content-bd {
+  color: #030303;
+}
+.dialog-content * {
+  font-size: 34px;
+}
+
+.font-size-{
+  &16 {
+    font-size: 16px;
+  }
+  &20 {
+    font-size: 20px;
+  }
+  &24 {
+    font-size: 24px;
+  }
+  &26 {
+    font-size: 26px;
+  }
+  &28 {
+    font-size: 28px;
+  }
+  &32 {
+    font-size: 32px;
+  }
+  &36 {
+    font-size: 36px;
+  }
+  &40 {
+    font-size: 40px;
+  }
+  &48 {
+    font-size: 48px;
+  }
+}
+
+.font-color-{
+  &333 {
+    color: #333333;
+  }
+  &ccc {
+    color: #ccc;
+  }
+  &999 {
+    color: #999;
+  }
+  &9B9 {
+    color: #9b9b9b
+  }
+  &D120 {
+    color: #D1202A;
+  }
+  &grey {
+    color: #666666;
+  }
+  &drepGrey {
+    color: #20253C;
+  }
+  &white {
+    color: #fff;
+  }
+  &E75 {
+    color: #E75123;
+  }
+  &FF9 {
+    color: #FF9C0F;
+  }
+  &47C {
+    color: #47C172;
+  }
+}

src/pages/style/personSecret.scss

+@import './index.scss';
+.sign-up-content {
+  position: fixed;
+  height: 100vh;
+  width: 100%;
+  top: 0;
+  z-index: 999;
+  .row {
+    display: flex;
+    flex-direction: row;
+  }
+  .dialog-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    z-index: 10002;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, 0.5);
+  }
+  .dialog-content {
+    position: absolute;
+    overflow: scroll;
+    max-height: 100%;
+    top: 50%;
+    left: 50%;
+    z-index: 10003;
+    transform: translate(-50%, -50%);
+    border-radius: 24px;
+    width: 690px;
+    background: #fff;
+  }
+}
+#ysxyContent {
+  display: none;
+  .dialog-content {
+    border-radius: 10px;
+  }
+  .modal-header {
+    justify-content: space-between;
+    border-bottom: 2px solid #e9ecef;
+    padding: 32px;
+  }
+  .modal-body {
+    padding: 30px;
+  }
+  .indent {
+    font-size: 24px;
+    text-indent: 48px;
+  }
+}
\ No newline at end of file

webpack.common.js

+const path = require('path');
+const glob = require('glob');
+const webpack = require('webpack');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const CopyWebpackPlugin=require('copy-webpack-plugin');
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+
+const setMPA = () => {
+	const entry = {};
+	const htmlWebpackPlugins = [];
+	const entryFiles = glob.sync(path.join(__dirname, './src/pages/*/index.js'));
+	Object.keys(entryFiles).map((index) => {
+		const entryFile = entryFiles[index];
+		const match = entryFile.match(/src\/pages\/(.*)\/index\.js/);
+		const pageName = match && match[1];
+		entry[pageName] = entryFile;
+		htmlWebpackPlugins.push(
+			new HtmlWebpackPlugin({
+				template: path.join(__dirname, `src/pages/${pageName}/index.html`),
+				filename: `./pages/${pageName}/index.html`,
+				chunks: ['commons', pageName, 'jquery'],
+				inject: true,
+				minify: false,
+			})
+		);
+		if (pageName === 'anysignpage') {
+			htmlWebpackPlugins.push(
+				new CopyWebpackPlugin([
+					{
+							from: path.join(__dirname, 'src/pages/anysignpage/libs'),
+							to: path.join(__dirname, 'dist/pages/anysignpage/libs'),
+					},
+					{
+						from: path.join(__dirname, 'src/pages/anysignpage/css'),
+						to: path.join(__dirname, 'dist/pages/anysignpage/css'),
+					},
+					{
+						from: path.join(__dirname, 'src/pages/anysignpage/anysignWebInterface.js'),
+						to: path.join(__dirname, 'dist/pages/anysignpage/anysignWebInterface.js'),
+					}
+				])
+			)
+		}
+	});
+	return {
+		entry,
+		htmlWebpackPlugins
+	};
+};
+
+// 入口管理
+
+const { entry, htmlWebpackPlugins } = setMPA();
+
+module.exports = {
+	entry,
+	plugins: [
+		new CleanWebpackPlugin(),
+		new webpack.ProvidePlugin({ //加载jq
+			$: 'jquery',
+			jQuery: 'jquery',
+			'window.jQuery': 'jquery'
+		})
+	].concat(htmlWebpackPlugins),
+	module: {
+		rules: [
+			{
+				test: /\.(png|svg|jpg|gif)$/,
+				use: [
+					{
+						loader: 'url-loader',
+						options: {
+							limit: 8192,
+							outputPath: 'image/',
+							name: '[hash].[ext]'
+						}
+					}
+				]
+			},
+			{
+				test: /\.(woff|woff2|eot|ttf|otf)$/,
+				use: [
+					'file-loader'
+				]
+			},
+			{
+				test: /\.(csv|tsv)$/,
+				use: [
+					'csv-loader'
+				]
+			},
+			{
+				test: /\.xml$/,
+				use: [
+					'xml-loader'
+				]
+			},
+			{
+				test: /\.(html)$/,
+				use: {
+					loader: 'html-loader',
+					options: {
+						attrs: ['img:src', 'img:data-src', 'audio:src'],
+						minimize: true
+					}
+				}
+			},
+			{
+				test:/\.js$/,
+				exclude:/node_modules/,
+				use: [
+					'babel-loader',
+					'eslint-loader'
+				]
+			}
+		]
+	},
+	optimization: {
+		splitChunks: {
+			minSize: 0,
+			cacheGroups: {
+				commons: {
+					name: 'commons',
+					chunks: 'all',
+					minChunks: 2
+				}
+			}
+		}
+	},
+};
\ No newline at end of file

webpack.dev.js

+const path = require('path');
+const webpack = require('webpack');
+const merge = require('webpack-merge');
+const common = require('./webpack.common.js');
+
+const commonEntry = common.entry;
+const entry = {};
+Object.keys(commonEntry)
+.forEach((pageName, index) => {
+	entry[pageName] = [commonEntry[pageName], 'webpack-hot-middleware/client?noInfo=true&reload=true']
+})
+
+module.exports = merge(common, {
+	entry,
+	mode: 'development',
+	devtool: 'source-map',
+	plugins: [
+    new webpack.HotModuleReplacementPlugin(),
+  ],
+	output: {
+		filename: 'js/[name].bundle.js',
+		path: path.resolve(__dirname, 'dist/'),
+		publicPath: '/'
+	},
+	module: {
+		rules: [
+			{
+				test: /\.(sa|sc|c)ss$/,
+				use: [
+					'style-loader',
+					'css-loader',
+					'sass-loader',
+					'postcss-loader'
+				]
+			},
+		]
+	},
+});

webpack.prod.js

+const path = require('path');
+const merge = require('webpack-merge');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const common = require('./webpack.common.js');
+
+module.exports = merge(common, {
+	mode: 'production',
+	optimization: {
+		minimize: true,
+    minimizer: [
+			new TerserPlugin({
+				terserOptions: {
+					mangle: {
+							safari10: true,
+					},
+				},
+			})
+		],
+  },
+	module: {
+		rules: [
+			{
+				test: /\.(sa|sc|c)ss$/,
+				use: [
+					MiniCssExtractPlugin.loader,
+					'css-loader',
+					'sass-loader',
+					'postcss-loader'
+				]
+			}
+		]
+	},
+	plugins: [
+		new MiniCssExtractPlugin({
+			filename: 'pages/[name]/[name][contenthash:8].css'                  // 提取出来的css文件路径以及命名
+		}),
+	],
+	output: {
+		filename: 'pages/[name]/[name][chunkhash:8].bundle.js',
+		path: path.resolve(__dirname, 'dist/'),
+		publicPath: '/static/activity/'
+	},
+});