Compare commits

..

8 Commits

Author SHA1 Message Date
彭翩 c4507ec428 fix: 更新配置 9 months ago
彭翩 e36c8c2d4a fix: 尝试压缩img 9 months ago
彭翩 410d3672c6 fix: 压缩js 9 months ago
彭翩 a4a2f725a4 fix: babel 9 months ago
彭翩 566e51ea4f fix: 样式生成 9 months ago
彭翩 6898e09102 fix: 添加 9 months ago
彭翩 a0695ad20f fix: 添加img 9 months ago
彭翩 c275ff032b fix: 更新 9 months ago

@ -9,6 +9,11 @@ npm install
npm run dev npm run dev
npm run build npm run build
``` ```
## 分支2024
一个H5静态网页demo
## 分支common ## 分支common
普通静态页面 普通静态页面

@ -5,6 +5,7 @@ var minifyHtml = require("gulp-minify-html"); //压缩html
var rename = require("gulp-rename"); //重命名 var rename = require("gulp-rename"); //重命名
var minifyCss = require("gulp-minify-css"); //压缩CSS var minifyCss = require("gulp-minify-css"); //压缩CSS
var uglify = require('gulp-uglify');//压缩js
var autoprefixer = require("gulp-autoprefixer"); var autoprefixer = require("gulp-autoprefixer");
var scssToCss = require("gulp-sass")(require('sass')); //scss to css var scssToCss = require("gulp-sass")(require('sass')); //scss to css
@ -14,9 +15,7 @@ var fileinclude = require("gulp-file-include");
var babel = require('gulp-babel'); var babel = require('gulp-babel');
var webpack = require('webpack-stream');
var sourceMap = require('gulp-sourcemaps');
var webpackConfig = require ("./webpack/webpack.config.js");
// 创建 // 创建
gulp.task("connect", function () { gulp.task("connect", function () {
connect.server({ connect.server({
@ -26,6 +25,8 @@ gulp.task("connect", function () {
}); });
}); });
gulp.task("fileinclude", function () { gulp.task("fileinclude", function () {
// 适配page中所有文件夹下的所有html排除src下的tpl文件夹中html // 适配page中所有文件夹下的所有html排除src下的tpl文件夹中html
gulp gulp
@ -79,31 +80,37 @@ gulp.task("watchs", function () {
}); });
// 定义JavaScript转译任务
gulp.task('script', () => { gulp.task('script', () => {
return gulp.src('src/static/js/*.js') return gulp.src('src/static/js/**/*.js') // 指定要转译的JavaScript文件夹
.pipe( sourceMap.init() )
.pipe(babel({ .pipe(babel({
presets: ['@babel/preset-env'] presets: ['@babel/env'] // 使用Babel预设来转译ES6到ES5
})) }))
.pipe(webpack(webpackConfig)) .pipe(uglify())
.pipe(sourceMap.write()) .pipe(gulp.dest('dist/static/js/')); // 输出转译后的文件到dist/static/js/文件夹
.pipe(gulp.dest('dist/static/js/'))
.pipe(connect.reload()); //更新;
}); });
gulp.task("lib", function () { gulp.task("lib", function () {
return gulp return gulp
.src("src/static/lib/*.js") .src("src/static/lib/*.js")
.pipe(gulp.dest("dist/static/lib/")) .pipe(gulp.dest("dist/static/lib/"))
.pipe(connect.reload()); //更新; .pipe(connect.reload()); //更新;
}); });
gulp.task("img", function () {
return gulp
.src('src/static/img/*.{jpg,png}')
.pipe(gulp.dest("dist/static/img/"))
.pipe(connect.reload()); //更新;
});
gulp.task( gulp.task(
"default", "default",
gulp.series( gulp.series(
"clean", "clean",
"scss", "scss",
gulp.parallel("html","lib","script", "css"), gulp.parallel("html","lib","script","img", "css"),
gulp.parallel("connect", "watchs") gulp.parallel("connect", "watchs")
) )
); );
@ -113,6 +120,6 @@ gulp.task(
gulp.series( gulp.series(
"clean", "clean",
"scss", "scss",
gulp.parallel("html","lib","script", "css") gulp.parallel("html","lib","script","img", "css")
) )
); );

140
package-lock.json generated

@ -12,6 +12,7 @@
"gulp-cli": "^2.3.0", "gulp-cli": "^2.3.0",
"gulp-sass": "^5.1.0", "gulp-sass": "^5.1.0",
"gulp-sourcemaps": "^3.0.0", "gulp-sourcemaps": "^3.0.0",
"gulp-uglify": "^3.0.2",
"sass": "^1.51.0" "sass": "^1.51.0"
}, },
"devDependencies": { "devDependencies": {
@ -4996,6 +4997,57 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/gulp-uglify": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/gulp-uglify/-/gulp-uglify-3.0.2.tgz",
"integrity": "sha512-gk1dhB74AkV2kzqPMQBLA3jPoIAPd/nlNzP2XMDSG8XZrqnlCiDGAqC+rZOumzFvB5zOphlFh6yr3lgcAb/OOg==",
"dependencies": {
"array-each": "^1.0.1",
"extend-shallow": "^3.0.2",
"gulplog": "^1.0.0",
"has-gulplog": "^0.1.0",
"isobject": "^3.0.1",
"make-error-cause": "^1.1.1",
"safe-buffer": "^5.1.2",
"through2": "^2.0.0",
"uglify-js": "^3.0.5",
"vinyl-sourcemaps-apply": "^0.2.0"
}
},
"node_modules/gulp-uglify/node_modules/extend-shallow": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
"integrity": "sha512-BwY5b5Ql4+qZoefgMj2NUmx+tehVTH/Kf4k1ZEtOHNFcm2wSxMRo992l6X3TIgni2eZVTZ85xMOjF31fwZAj6Q==",
"dependencies": {
"assign-symbols": "^1.0.0",
"is-extendable": "^1.0.1"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/gulp-uglify/node_modules/is-extendable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
"integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
"dependencies": {
"is-plain-object": "^2.0.4"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/gulp-uglify/node_modules/is-plain-object": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
"integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
"dependencies": {
"isobject": "^3.0.1"
},
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/gulp-util": { "node_modules/gulp-util": {
"version": "3.0.8", "version": "3.0.8",
"resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz", "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
@ -5120,7 +5172,6 @@
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz", "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
"integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=", "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
"dev": true,
"dependencies": { "dependencies": {
"sparkles": "^1.0.0" "sparkles": "^1.0.0"
}, },
@ -5908,6 +5959,19 @@
"es5-ext": "~0.10.2" "es5-ext": "~0.10.2"
} }
}, },
"node_modules/make-error": {
"version": "1.3.6",
"resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
"integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
},
"node_modules/make-error-cause": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/make-error-cause/-/make-error-cause-1.2.2.tgz",
"integrity": "sha512-4TO2Y3HkBnis4c0dxhAgD/jprySYLACf7nwN6V0HAHDx59g12WlRpUmFy1bRHamjGUEEBrEvCq6SUpsEE2lhUg==",
"dependencies": {
"make-error": "^1.2.0"
}
},
"node_modules/make-iterator": { "node_modules/make-iterator": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/make-iterator/-/make-iterator-1.0.1.tgz", "resolved": "https://registry.npmjs.org/make-iterator/-/make-iterator-1.0.1.tgz",
@ -8566,6 +8630,17 @@
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=" "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
}, },
"node_modules/uglify-js": {
"version": "3.17.4",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz",
"integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g==",
"bin": {
"uglifyjs": "bin/uglifyjs"
},
"engines": {
"node": ">=0.8.0"
}
},
"node_modules/unc-path-regex": { "node_modules/unc-path-regex": {
"version": "0.1.2", "version": "0.1.2",
"resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz", "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
@ -13078,6 +13153,50 @@
} }
} }
}, },
"gulp-uglify": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/gulp-uglify/-/gulp-uglify-3.0.2.tgz",
"integrity": "sha512-gk1dhB74AkV2kzqPMQBLA3jPoIAPd/nlNzP2XMDSG8XZrqnlCiDGAqC+rZOumzFvB5zOphlFh6yr3lgcAb/OOg==",
"requires": {
"array-each": "^1.0.1",
"extend-shallow": "^3.0.2",
"gulplog": "^1.0.0",
"has-gulplog": "^0.1.0",
"isobject": "^3.0.1",
"make-error-cause": "^1.1.1",
"safe-buffer": "^5.1.2",
"through2": "^2.0.0",
"uglify-js": "^3.0.5",
"vinyl-sourcemaps-apply": "^0.2.0"
},
"dependencies": {
"extend-shallow": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/extend-shallow/-/extend-shallow-3.0.2.tgz",
"integrity": "sha512-BwY5b5Ql4+qZoefgMj2NUmx+tehVTH/Kf4k1ZEtOHNFcm2wSxMRo992l6X3TIgni2eZVTZ85xMOjF31fwZAj6Q==",
"requires": {
"assign-symbols": "^1.0.0",
"is-extendable": "^1.0.1"
}
},
"is-extendable": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-extendable/-/is-extendable-1.0.1.tgz",
"integrity": "sha512-arnXMxT1hhoKo9k1LZdmlNyJdDDfy2v0fXjFlmok4+i8ul/6WlbVge9bhM74OpNPQPMGUToDtz+KXa1PneJxOA==",
"requires": {
"is-plain-object": "^2.0.4"
}
},
"is-plain-object": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-2.0.4.tgz",
"integrity": "sha512-h5PpgXkWitc38BBMYawTYMWJHFZJVnBquFE57xFpjB8pJFiF6gZ+bU+WyI/yqXiFR5mdLsgYNaPe8uao6Uv9Og==",
"requires": {
"isobject": "^3.0.1"
}
}
}
},
"gulp-util": { "gulp-util": {
"version": "3.0.8", "version": "3.0.8",
"resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz", "resolved": "https://registry.npmjs.org/gulp-util/-/gulp-util-3.0.8.tgz",
@ -13176,7 +13295,6 @@
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz", "resolved": "https://registry.npmjs.org/has-gulplog/-/has-gulplog-0.1.0.tgz",
"integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=", "integrity": "sha1-ZBTIKRNpfaUVkDl9r7EvIpZ4Ec4=",
"dev": true,
"requires": { "requires": {
"sparkles": "^1.0.0" "sparkles": "^1.0.0"
} }
@ -13833,6 +13951,19 @@
"es5-ext": "~0.10.2" "es5-ext": "~0.10.2"
} }
}, },
"make-error": {
"version": "1.3.6",
"resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
"integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw=="
},
"make-error-cause": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/make-error-cause/-/make-error-cause-1.2.2.tgz",
"integrity": "sha512-4TO2Y3HkBnis4c0dxhAgD/jprySYLACf7nwN6V0HAHDx59g12WlRpUmFy1bRHamjGUEEBrEvCq6SUpsEE2lhUg==",
"requires": {
"make-error": "^1.2.0"
}
},
"make-iterator": { "make-iterator": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npmjs.org/make-iterator/-/make-iterator-1.0.1.tgz", "resolved": "https://registry.npmjs.org/make-iterator/-/make-iterator-1.0.1.tgz",
@ -15933,6 +16064,11 @@
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz", "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=" "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
}, },
"uglify-js": {
"version": "3.17.4",
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.17.4.tgz",
"integrity": "sha512-T9q82TJI9e/C1TAxYvfb16xO120tMVFZrGA3f9/P4424DNu6ypK103y0GPFVa17yotwSyZW5iYXgjYHkGrJW/g=="
},
"unc-path-regex": { "unc-path-regex": {
"version": "0.1.2", "version": "0.1.2",
"resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz", "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",

@ -5,7 +5,7 @@
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {
"script": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js script", "script": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js script",
"serve": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js", "dev": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js",
"build": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js build" "build": "node --max_old_space_size=8096 node_modules/gulp-cli/bin/gulp.js build"
}, },
"repository": { "repository": {
@ -38,6 +38,7 @@
"gulp-cli": "^2.3.0", "gulp-cli": "^2.3.0",
"gulp-sass": "^5.1.0", "gulp-sass": "^5.1.0",
"gulp-sourcemaps": "^3.0.0", "gulp-sourcemaps": "^3.0.0",
"gulp-uglify": "^3.0.2",
"sass": "^1.51.0" "sass": "^1.51.0"
} }
} }

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang=en>
<head>
@@include('./tpl/header.html')
<title>加盟</title>
<style>
body {
background-image: url('./static/img/bg6.jpg');
/* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.footer-box{
left: 0;
right: 0;
margin: 0 auto;
}
</style>
</head>
<body>
@@include('./tpl/logo2.html')
<div class="footer-box">
<img src="./static/img/tishi.png" class="footer-ti-shi" />
<div class="footer-title">您的信息已熟知,随后将由专业人员与您联系!</div>
</div>
</div>
</body>
<script type=text/javascript charset=UTF-8 src="./static/js/end.js"></script>
</html>

@ -1,23 +1,23 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="zh"> <html lang=en>
<head> <head>
@@include('./tpl/header.html') @@include('./tpl/header.html')
<script src="./static/lib/d3@6.js"></script> <title>首页</title>
<script src="./static/lib/markmap-view.js"></script>
<script src="./static/js/main.js"></script>
<style> <style>
.markmap-svg{
width: calc(100vw - 40px); body {
height: calc(100vh - 66px); background-image: url('./static/img/bg1.jpg'); /* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
} }
</style> </style>
</head> </head>
<body> <body>
@@include('./tpl/nav.html') @@include('./tpl/logo1.html')
<section> <div class="btn-box" id="btn">点击加盟</div>
<svg id="markmap" class="markmap-svg"></svg> </div>
</section>
@@include('./tpl/footer.html')
</body> </body>
<script type=text/javascript charset=UTF-8 src="./static/js/index.js"></script>
</html> </html>

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang=en>
<head>
@@include('./tpl/header.html')
<title>加盟</title>
<style>
body {
background-image: url('./static/img/bg2.jpg'); /* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</head>
<body>
@@include('./tpl/logo2.html')
<div class="content">
<div class="title">加盟区域</div>
<div class="form-box">
<span class="form-item" id="city">请选择</span>
<span class="form-item" id="qu">请选择</span></div>
</div>
<div class="xia-btn-box" id="btn">下一页</div>
<div class="model" id="model" style="display: none;">
<div class="model-box">
<div class="model-title"></div>
<div class="model-content" id="content">
<div class="model-item" value="长沙">长沙</div>
</div>
</div>
</div>
<div class="model" id="qu-model" style="display: none;">
<div class="model-box">
<div class="model-title"></div>
<div class="model-content" id="qu-content">
<div class="model-item" value="长沙">长沙</div>
</div>
</div>
</div>
</div>
</body>
<script type=text/javascript charset=UTF-8 src="./static/js/jiaMeng1.js"></script>
</html>

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html lang=en>
<head>
@@include('./tpl/header.html')
<title>加盟</title>
<style>
body {
background-image: url('./static/img/bg3.jpg'); /* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</head>
<body>
@@include('./tpl/logo2.html')
<div class="content">
<div class="my-form-box">
<div class="item-box">
<div class="item-title">行业类别</div>
<span class="item-form-item" id="hang-ye">请选择</span></div>
<div class="item-box">
<div class="item-title">租赁资历</div>
<span class="item-form-item" id="zi-li">请选择</span></div>
</div>
</div>
<div class="xia-btn-box" id="btn">下一页</div>
<div class="model" id="hang-ye-model" style="display: none;">
<div class="model-box">
<div class="model-title"></div>
<div class="model-content" id="hang-ye-content">
<div class="model-item" value="请选择">请选择</div>
</div>
</div>
</div>
<div class=model id=zi-li-model style="display: none;">
<div class=model-box>
<div class="model-title"></div>
<div class="model-content" id=zi-li-content>
<div class="model-item" value="请选择">请选择</div>
</div>
</div>
</div>
</div>
</body>
<script type=text/javascript charset=UTF-8 src="./static/js/jiaMeng2.js"></script>
</html>

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html lang=en>
<head>
@@include('./tpl/header.html')
<title>加盟</title>
<style>
body {
background-image: url('./static/img/bg4.jpg'); /* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</head>
<body>
@@include('./tpl/logo2.html')
<div class="content">
<div class="my-form-box">
<div class="item-box">
<div class="item-title">门店情况</div>
<span class="item-form-item" id="men-dian">请选择</span></div>
<div class=item-box>
<div class=item-title>场地情况</div>
<span class="item-form-item" id="chan-di">请选择</span></div>
</div>
</div>
<div class="xia-btn-box" id="btn">下一页</div>
<div class="model" id="men-dian-model" style="display: none;">
<div class="model-box">
<div class="model-title"></div>
<div class="model-content" id="men-dian-content">
<div class="model-item" value="请选择">请选择</div>
</div>
</div>
</div>
<div class="model" id="chan-di-model" style="display: none;">
<div class="model-box">
<div class="model-title"></div>
<div class="model-content" id="chan-di-content">
<div class="model-item" value="请选择">请选择</div>
</div>
</div>
</div>
</div>
</body>
<script type=text/javascript charset=UTF-8 src="./static/js/jiaMeng3.js"></script>
</html>

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html lang=en>
<head>
@@include('./tpl/header.html')
<title>加盟</title>
<style>
body {
background-image: url('./static/img/bg5.jpg');
/* 替换为你的图片路径 */
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>
</head>
<body>
@@include('./tpl/logo2.html')
<div class="content">
<div class="my-form-box">
<div class="item-box">
<div class="item-title">加盟人姓名</div>
<span class="input-form-item"><input type="text" id="name" placeholder="请输入加盟人姓名"></span></div>
<div class="item-box">
<div class="item-title">加盟人电话</div>
<span class="input-form-item"><input type="text" id="phone" placeholder="请输入加盟人电话"></span></div>
</div>
</div>
<div class="xia-btn-box" id="btn">提交</div>
</body>
<script type=text/javascript charset=UTF-8 src="./static/js/jiaMeng4.js"></script>
</html>

@ -65,32 +65,3 @@ a:link, a:visited, a:hover, a:active {
font-size: 16px; font-size: 16px;
margin-right: 10px; margin-right: 10px;
} }
/* 内容 */
/* 弹层 */
.mark-box {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
}
.mark-box .dialog-box {
width: 30%;
height: 400px;
background-color: #fff;
border: 1px solid #f9f9fc;
border-radius: 10px;
}
.show-dialog {
display: flex;
justify-content: center;
align-items: center;
}
.hide-dialog {
display: none;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 156 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 177 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 170 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 179 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 162 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

@ -1 +1,6 @@
window.onload = function () {
document.getElementById('btn').addEventListener('click', function() {
window.open('./jiaMeng1.html','_self');
});
};

File diff suppressed because it is too large Load Diff

@ -0,0 +1,94 @@
var hangYe = '';
var ziLi = '';
window.onload = function () {
initData();
document.getElementById('btn').addEventListener('click', function() {
if(hangYe==""||ziLi==""){
alert('请先选择行业类别和租赁资历');
}else{
window.sessionStorage.setItem('hangYe',hangYe);
window.sessionStorage.setItem('ziLi',ziLi);
window.open('./jiaMeng3.html','_self');
}
});
document.getElementById('hang-ye').addEventListener('click', function() {
openHangYeModel();
setHangYeOption();
});
document.getElementById('zi-li').addEventListener('click', function() {
openZiLiModel();
setZiLiOption();
});
};
function initData(){
hangYe = '行业内人士';
document.getElementById('hang-ye').innerHTML = '行业内人士';
ziLi = '有相关租赁经验';
document.getElementById('zi-li').innerHTML = '有相关租赁经验';
}
function resetQu(){
document.getElementById('qu').innerHTML ='<div class="model-item" data-value="0">请选择</div>';
}
function openHangYeModel(){
document.getElementById('hang-ye-model').style = 'display: flex;';
}
function closeHangYeModel(){
document.getElementById('hang-ye-model').style = 'display: none;';
}
function setHangYeOption(){
let listHtml = '';
for (let index = 0; index < hangYeList.length; index++) {
const element = hangYeList[index];
listHtml += `<div class="model-item" data-value="`+element.name+`">`+element.name+`</div>`
}
if(listHtml==""){
listHtml = ` <div class="model-item" data-value="0">请选择</div>`
}
document.getElementById('hang-ye-content').innerHTML = listHtml;
document.getElementById('hang-ye-content').addEventListener('click', function(e) {
hangye = e.target.dataset.value;
document.getElementById('hang-ye').innerHTML = e.target.dataset.value;
closeHangYeModel();
});
}
function openZiLiModel(){
document.getElementById('zi-li-model').style = 'display: flex;';
}
function closeZiLiModel(){
document.getElementById('zi-li-model').style = 'display: none;';
}
function setZiLiOption(){
let listHtml = '';
for (let index = 0; index < ziLiList.length; index++) {
const element = ziLiList[index];
listHtml += `<div class="model-item" data-value="`+element.name+`">`+element.name+`</div>`
}
if(listHtml==""){
listHtml = ` <div class="model-item" data-value="0">请选择</div>`
}
document.getElementById('zi-li-content').innerHTML = listHtml;
document.getElementById('zi-li-content').addEventListener('click', function(e) {
ziLi = e.target.dataset.value;
document.getElementById('zi-li').innerHTML = e.target.dataset.value;
closeZiLiModel();
});
}
var hangYeList = [
{
name:'行业内人士'
},
{
name:'非行业内人士'
},
];
var ziLiList = [
{
name:'有相关租赁经验'
},
{
name:'无相关租赁经验'
},
];

@ -0,0 +1,97 @@
var menDian = '';
var changDi = '';
window.onload = function () {
initData();
document.getElementById('btn').addEventListener('click', function() {
if(menDian==""||changDi==""){
alert('请先选择门店情况和场地情况');
}else{
window.sessionStorage.setItem('menDian',menDian);
window.sessionStorage.setItem('changDi',changDi);
window.open('./jiaMeng4.html','_self');
}
});
document.getElementById('men-dian').addEventListener('click', function() {
openMenDianModel();
setMenDianOption();
});
document.getElementById('chan-di').addEventListener('click', function() {
openChanDiModel();
setChanDiOption();
});
};
function initData(){
menDian = '已有自购门店';
document.getElementById('men-dian').innerHTML = '已有自购门店';
changDi = '可满足20台以上设备停留场地';
document.getElementById('chan-di').innerHTML = '可满足20台以上设备停留场地';
}
function resetQu(){
document.getElementById('qu').innerHTML ='<div class="model-item" data-value="0">请选择</div>';
}
function openMenDianModel(){
document.getElementById('men-dian-model').style = 'display: flex;';
}
function closeMenDianModel(){
document.getElementById('men-dian-model').style = 'display: none;';
}
function setMenDianOption(){
let listHtml = '';
for (let index = 0; index < menDianList.length; index++) {
const element = menDianList[index];
listHtml += `<div class="model-item" data-value="`+element.name+`">`+element.name+`</div>`
}
if(listHtml==""){
listHtml = ` <div class="model-item" data-value="0">请选择</div>`
}
document.getElementById('men-dian-content').innerHTML = listHtml;
document.getElementById('men-dian-content').addEventListener('click', function(e) {
menDian = e.target.dataset.value;
document.getElementById('men-dian').innerHTML = e.target.dataset.value;
closeMenDianModel();
});
}
function openChanDiModel(){
document.getElementById('chan-di-model').style = 'display: flex;';
}
function closeChanDiModel(){
document.getElementById('chan-di-model').style = 'display: none;';
}
function setChanDiOption(){
let listHtml = '';
for (let index = 0; index < chanDiList.length; index++) {
const element = chanDiList[index];
listHtml += `<div class="model-item" data-value="`+element.name+`">`+element.name+`</div>`
}
if(listHtml==""){
listHtml = ` <div class="model-item" data-value="0">请选择</div>`
}
document.getElementById('chan-di-content').innerHTML = listHtml;
document.getElementById('chan-di-content').addEventListener('click', function(e) {
changDi = e.target.dataset.value;
document.getElementById('chan-di').innerHTML = e.target.dataset.value;
closeChanDiModel();
});
}
var menDianList = [
{
name:'已有自购门店'
},
{
name:'已有租用门店'
},
{
name:'门店待租用'
},
];
var chanDiList = [
{
name:'可满足20台以上设备停留场地'
},
{
name:'可满足10台以上设备停留场地'
},
];

@ -0,0 +1,54 @@
var userName = '';
var phone = '';
async function clickHandler() {
userName = document.getElementById('name').value;
phone = document.getElementById('phone').value;
if (userName == "" || phone == "") {
alert('请先填写加盟人姓名和加盟人电话');
} else {
window.sessionStorage.setItem('name', userName);
window.sessionStorage.setItem('phone', phone);
await postData();
// 发送成功后 跳转 // window.open('./end.html','_self');
}
}
window.onload = function () {
document.getElementById('btn').addEventListener('click', clickHandler);
};
async function postData() {
const formData = {
name: window.sessionStorage.getItem("name"),
phone: window.sessionStorage.getItem("phone"),
menDian: window.sessionStorage.getItem("menDian"),
changDi: window.sessionStorage.getItem("changDi"),
hangYe: window.sessionStorage.getItem("hangYe"),
ziLi: window.sessionStorage.getItem("ziLi"),
city: window.sessionStorage.getItem("city"),
qu: window.sessionStorage.getItem("qu"),
};
// console.log('data: ', data);
try {
const responseStream = await fetch("/record", {
body: JSON.stringify(formData),
method: "POST",
headers: {
"Content-Type": "application/json",
},
});
const {data} = await responseStream.json();
if (data) {
// document.getElementById('btn').innerText = '已申请'
// document.getElementById('btn').removeEventListener("click", clickHandler)
// alert("提交成功");
window.open('./end.html','_self');
}
} catch (e) {
console.error("从服务器获取数据出错,请联系管理员!", e);
}
}

@ -1,5 +1,4 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>gulp-static-html-demo</title>
<link rel="stylesheet" type="text/css" href="./static/css/common.css" /> <link rel="stylesheet" type="text/css" href="./static/css/common.css" />

@ -0,0 +1,3 @@
<div class="logo-box">
<img src="./static/img/logo.png"/>
</div>

@ -0,0 +1,3 @@
<div class="logo-box">
<img src="./static/img/logo2.png" />
</div>

@ -1,10 +0,0 @@
<header class="header">
<div class="box">
<div class="logo item"><a href="/">MARKMAP</a></div>
<div class="opr-box">
<div class="item open-new-dialog" type="new">新建目录</div>
</div>
</div>
</header>
Loading…
Cancel
Save