├── README.md ├── 倒计时 ├── index.js └── readme.md ├── 小程序 商城 ├── app.js ├── app.json ├── app.wxss ├── components │ └── header │ │ ├── header.js │ │ ├── header.json │ │ ├── header.wxml │ │ └── header.wxss ├── module │ └── common.wxs ├── pages │ ├── article │ │ ├── article.js │ │ ├── article.json │ │ ├── article.wxml │ │ └── article.wxss │ ├── cart │ │ ├── cart.js │ │ ├── cart.json │ │ ├── cart.wxml │ │ └── cart.wxss │ ├── class │ │ ├── class.js │ │ ├── class.json │ │ ├── class.wxml │ │ └── class.wxss │ ├── good │ │ ├── good.js │ │ ├── good.json │ │ ├── good.wxml │ │ └── good.wxss │ ├── index │ │ ├── index.js │ │ ├── index.json │ │ ├── index.wxml │ │ └── index.wxss │ ├── kill │ │ ├── kill.js │ │ ├── kill.json │ │ ├── kill.wxml │ │ └── kill.wxss │ ├── list │ │ ├── list.js │ │ ├── list.json │ │ ├── list.wxml │ │ └── list.wxss │ ├── mem │ │ ├── mem.js │ │ ├── mem.json │ │ ├── mem.wxml │ │ └── mem.wxss │ ├── member │ │ ├── agent │ │ │ ├── agent.js │ │ │ ├── agent.json │ │ │ ├── agent.wxml │ │ │ └── agent.wxss │ │ ├── busi │ │ │ ├── busi.js │ │ │ ├── busi.json │ │ │ ├── busi.wxml │ │ │ └── busi.wxss │ │ ├── coup │ │ │ ├── coup.js │ │ │ ├── coup.json │ │ │ ├── coup.wxml │ │ │ └── coup.wxss │ │ ├── credit │ │ │ ├── credit.js │ │ │ ├── credit.json │ │ │ ├── credit.wxml │ │ │ └── credit.wxss │ │ ├── favo │ │ │ ├── favo.js │ │ │ ├── favo.json │ │ │ ├── favo.wxml │ │ │ └── favo.wxss │ │ ├── integral │ │ │ ├── integral.js │ │ │ ├── integral.json │ │ │ ├── integral.wxml │ │ │ └── integral.wxss │ │ ├── message │ │ │ ├── message.js │ │ │ ├── message.json │ │ │ ├── message.wxml │ │ │ └── message.wxss │ │ ├── money │ │ │ ├── money.js │ │ │ ├── money.json │ │ │ ├── money.wxml │ │ │ └── money.wxss │ │ ├── morder │ │ │ ├── morder.js │ │ │ ├── morder.json │ │ │ ├── morder.wxml │ │ │ └── morder.wxss │ │ ├── morderinfo │ │ │ ├── morderinfo.js │ │ │ ├── morderinfo.json │ │ │ ├── morderinfo.wxml │ │ │ └── morderinfo.wxss │ │ ├── notice │ │ │ ├── notice.js │ │ │ ├── notice.json │ │ │ ├── notice.wxml │ │ │ └── notice.wxss │ │ └── recomer │ │ │ ├── recomer.js │ │ │ ├── recomer.json │ │ │ ├── recomer.wxml │ │ │ └── recomer.wxss │ ├── order │ │ ├── order.js │ │ ├── order.json │ │ ├── order.wxml │ │ └── order.wxss │ └── recom │ │ ├── recom.js │ │ ├── recom.json │ │ ├── recom.wxml │ │ └── recom.wxss ├── project.config.json ├── sitemap.json ├── static │ ├── agent.jpg │ ├── cart.png │ ├── carto.png │ ├── class.png │ ├── class │ │ ├── c0.png │ │ ├── c1.png │ │ ├── c2.png │ │ ├── c3.png │ │ ├── c4.png │ │ ├── c5.png │ │ ├── c6.png │ │ ├── c7.png │ │ ├── c8.png │ │ └── c9.png │ ├── classo.png │ ├── cooper.png │ ├── customer.png │ ├── favo.png │ ├── gift.png │ ├── ic_mea.png │ ├── ic_meb.png │ ├── ic_mec.png │ ├── ic_med.png │ ├── ic_mee.png │ ├── icon.wxss │ ├── icon_news.png │ ├── icon_pay.png │ ├── inb.jpg │ ├── index.png │ ├── indexo.png │ ├── main.wxss │ ├── mar.png │ ├── mem.png │ ├── memo.png │ ├── mess.png │ ├── product │ │ ├── 1.png │ │ ├── 10.png │ │ ├── 2.png │ │ ├── 3.png │ │ ├── 4.png │ │ ├── 5.png │ │ ├── 6.png │ │ ├── 7.png │ │ ├── 8.png │ │ └── 9.png │ ├── reco.png │ ├── recom.png │ ├── recomo.png │ └── swaper │ │ ├── s0.jpg │ │ └── s1.jpg └── utils │ ├── core.js │ ├── http.js │ ├── pro.js │ ├── util.js │ └── wxcharts.js ├── 常用正则匹配 └── util 3.js └── 表单验证 ├── common └── validate.js └── readme.md /README.md: -------------------------------------------------------------------------------- 1 | # vue_projects 2 | vue_projects 3 | -------------------------------------------------------------------------------- /倒计时/index.js: -------------------------------------------------------------------------------- 1 | // 记录定时器 2 | let workerTime = null; 3 | 4 | // 一天的时间 5 | const onDay = 60 * 60 * 24; 6 | 7 | // 监听主进程发来的事件 8 | worker.onMessage(function(res) { 9 | startCalc(res); 10 | }) 11 | 12 | // 返回展示 13 | const showType = { 14 | day:'天', 15 | hour:'时', 16 | minute:'分', 17 | second:'秒' 18 | } 19 | 20 | // 根据主进程事件值做操作 21 | /** 22 | * @param {Object} res 根据主进程事件值做操作 23 | */ 24 | function startCalc(res) { 25 | /* 类型 剩余时间 返回展示 自定义数据 数组时时间字段 结束时展示内容 */ 26 | let { type, number, timeType,customValue,overTips = 0 } = res; 27 | // 开始 28 | if (type === 'start') { 29 | /* 如果存在 自定义字段则 */ 30 | if(customValue){ 31 | if(typeof number !== 'object'){ 32 | console.error('内容错误 填写自定义字段时请传入数组'); 33 | return false; 34 | } 35 | backArrMessage(res); 36 | 37 | const newTime = () => { 38 | return res.number.map((item,key)=>{ 39 | if(item[customValue] === undefined){ 40 | console.error(key + '--字段错误 该字段不存在' + customValue + '请检查数组'); 41 | return false; 42 | } 43 | (item[customValue] > 0) ? item[customValue]-- : item[customValue] = 0; 44 | return item; 45 | }) 46 | } 47 | workerTime = setInterval(() => { 48 | res.number = newTime(); 49 | backArrMessage(res); 50 | }, 1000 * 1); 51 | return false; 52 | } 53 | 54 | /* 没传入自定义字段 传入数组 */ 55 | if(typeof number === 'object'){ 56 | /* 进来就执行一次 */ 57 | backArrMessage(res); 58 | 59 | const newTime = ()=> { 60 | return res.number.map((item,key)=>{ 61 | (item > 0) ? item-- : item = 0; 62 | return item; 63 | }) 64 | } 65 | 66 | workerTime = setInterval(() => { 67 | res.number = newTime(); 68 | backArrMessage(res); 69 | }, 1000 * 1); 70 | 71 | return false; 72 | } 73 | 74 | // 单个值-计算时间 75 | // 进来直接先进行一次 76 | backMessage(number, timeType); 77 | // 计时器是1秒后才开始执行任务 78 | workerTime = setInterval(() => { 79 | let downNum = number--; 80 | backMessage(downNum, timeType); 81 | }, 1000 * 1); 82 | 83 | } 84 | // 结束 85 | if (type === 'end') { 86 | clearTimeout(workerTime); 87 | } 88 | } 89 | 90 | 91 | /** 92 | * check_one 0的时候是否阻止继续 93 | */ 94 | function backTips(number, timeType, check_one = false){ 95 | 96 | // 多少天 97 | const days = Math.floor(number / onDay); 98 | 99 | // 剩余天数的-秒数 100 | const lastDay = days * onDay; 101 | 102 | // 剩余多少小时 103 | const hours = Math.floor((number - lastDay) / 3600); 104 | 105 | // 剩余分钟的秒数 106 | const lastMinute = (lastDay + (hours * 3600)); 107 | 108 | // 剩余多少分钟 109 | const minute = Math.floor((number - lastMinute) / 60); 110 | 111 | // 剩余多少秒钟 112 | const second = Math.floor((number - lastMinute) % 60); 113 | 114 | // 返回的展示数据 115 | let postInfo = ''; 116 | 117 | // 展示的字段-传入与默认 118 | let tipsStr = timeType || showType; 119 | // 显示 120 | const showTips = (type) => tipsStr[type] || ':'; 121 | 122 | // 开始 123 | if (check_one && days < 0) { 124 | // 任务完成时间活动已经开始 125 | worker.postMessage({ 126 | error: 1 127 | }) 128 | clearTimeout(workerTime); 129 | return false; 130 | } 131 | 132 | // 判断天大于0显示 133 | days > 0 && (postInfo = `${days}${showTips('day')}`) 134 | 135 | // 小时 136 | number >= (onDay / 60) && (postInfo += `${hours}${showTips('hour')}`) 137 | 138 | // 分钟 139 | number >= 60 && (postInfo += `${minute}${showTips('minute')}`) 140 | 141 | // 秒钟 142 | postInfo += `${second}${showTips('second')}` 143 | 144 | return postInfo; 145 | } 146 | 147 | 148 | // 向主进程反馈值 ----- 传入需要计算的值是数组 149 | function backArrMessage({number, timeType,customValue,overTips}){ 150 | let overNum = 0; 151 | let backData = []; 152 | if(customValue){ 153 | for (let item of number) { 154 | 155 | const tipsBack = (item[customValue] <= 0 && overTips) || backTips(item[customValue],timeType) 156 | 157 | backData.push({ 158 | [customValue]:tipsBack 159 | }) 160 | 161 | if(item[customValue] <= 0){ 162 | overNum++; 163 | } 164 | } 165 | } 166 | else{ 167 | let overNum = 0; 168 | backData = number.map((item)=>{ 169 | return backTips(item,timeType) 170 | if(item <= 0){ 171 | overNum++; 172 | } 173 | }) 174 | } 175 | 176 | /* 已经全局结束 */ 177 | if(overNum === number.length){ 178 | worker.postMessage({ 179 | error: 1 180 | }) 181 | clearTimeout(workerTime); 182 | return false; 183 | } 184 | worker.postMessage({ 185 | showTime: backData 186 | }) 187 | } 188 | 189 | // 向主进程反馈值 ----- 传入需要计算的值是单个 190 | function backMessage(number, timeType) { 191 | // 反馈给主进程 192 | backTips(number, timeType,true) && worker.postMessage({ 193 | showTime: backTips(number, timeType,true) 194 | }) 195 | } 196 | -------------------------------------------------------------------------------- /倒计时/readme.md: -------------------------------------------------------------------------------- 1 | # 倒计时 2 | 3 | 4 | ** 使用worker子进程进行倒计时 ** 5 | 可用于秒杀，倒计时等活动时间 6 | 不占用主进程-减少阻塞问题 7 | 8 | **使用方法** 9 | 10 | 小程序ps: 11 | 1、需要在app.json里面添加workers字段而且需要找到workers代码的目录 12 | 2、把workers代码放到static/workers目录下则需要吧static/workers填写为workers的值 13 | 14 | uniapp ps: 15 | 1、需要在manifest.json找到mp-weixin节点下面添加workers 而且需要找到workers代码的目录 16 | 2、把workers代码放到static/workers目录下则需要吧static/workers填写为workers的值 17 | 18 | 19 | #worker启动时可用参数 20 | | 属性名 | 类型 | 默认值 | 是否必填 | 说明 | 21 | | -------- | -----: | :----: | :----: | :----: | 22 | | type | string | 无 | 是 | 开始结束的条件字段 start:启动计算服务 end:结束并清除定时器 23 | | number | Number/Array | 无 | 是 | 需要计算的时间倒计时（秒钟 24 | | customValue | string | 无 | 否 | 倒计时的时间是数组则填写的字段 25 | | overTips | string | 无 | 否 | 倒计时结束显示的字段默认0秒 26 | | timeType | Object | : | 否 | 时间显示间隔 27 | ``` 28 | timeType = { //自定义展示的 天 时 分 秒 29 | day:'天', 30 | hour:'时', 31 | minute:'分', 32 | second:'秒' 33 | } 34 | ``` 35 | 36 | ** 在uniapp使用方法 ** 37 | ``` 38 | //当前页面定义全局worker整个页面都可使用worker 39 | let worker = null; 40 | export default { 41 | data() {}, 42 | onReady() { 43 | //创建worker连接 44 | worker= uni.createWorker('/static/workers/index.js'); 45 | //发送开始指令 46 | worker.postMessage({ 47 | type:'start', //开始结束的条件字段 48 | // number:['10','5',], //倒计时的时间 --秒钟 49 | // number:10, //倒计时的时间 --秒钟 50 | number:[{time:10},{time:5}], //倒计时的时间 --秒钟 51 | 52 | customValue: 'time', //倒计时的时间是数组---如果没有则吧数组里面的值当成值[] 53 | // overTips:'倒计时结束', //倒计时结束展示什么 54 | 55 | timeType: { //自定义展示的 天 时 分 秒 56 | day:'天', 57 | hour:'时', 58 | minute:'分', 59 | second:'秒' 60 | } 61 | }) 62 | 63 | //worker计算返回结果 --计算结束会返回error字段 64 | worker.onMessage((res)=>{ 65 | console.log(res); 66 | }) 67 | } 68 | } 69 | ``` 70 | -------------------------------------------------------------------------------- /小程序 商城/app.js: -------------------------------------------------------------------------------- 1 | const http = require('./utils/http') 2 | 3 | App({ 4 | onLaunch: function () { 5 | 6 | //系统信息 7 | http.getSystem(this) 8 | 9 | //版本更新 10 | const updateManager = wx.getUpdateManager() 11 | updateManager.onUpdateReady(() => { 12 | wx.showModal({ 13 | title: '更新提示', 14 | content: '新版本已经准备好，是否重启应用？', 15 | success(res) { 16 | if (res.confirm) { 17 | updateManager.applyUpdate() 18 | } 19 | } 20 | }) 21 | }) 22 | 23 | this.singIn() 24 | }, 25 | 26 | //获取用户信息 27 | userInfo: function () { 28 | wx.getSetting({ 29 | success: res => { 30 | const that = this 31 | if (res.authSetting['scope.userInfo']) { 32 | wx.getUserInfo({ 33 | lang: 'zh_CN', 34 | success: res => { 35 | that.local.userInfo = res.userInfo 36 | 37 | if (that.userInfoReadyCallback) { 38 | that.userInfoReadyCallback(res) 39 | } 40 | } 41 | }) 42 | } 43 | } 44 | }) 45 | }, 46 | 47 | //微信授权 48 | singIn: function () { 49 | wx.login({ 50 | success: res => { 51 | console.log(res.code) 52 | wx.setStorageSync('code', res.code) 53 | } 54 | }) 55 | }, 56 | 57 | local: { 58 | userInfo: null, 59 | StatusBar: '', 60 | CustomBar: '', 61 | winHeight: '', 62 | winWidth: '' 63 | } 64 | 65 | }) -------------------------------------------------------------------------------- /小程序 商城/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "pages": [ 3 | "pages/index/index", 4 | "pages/class/class", 5 | "pages/recom/recom", 6 | "pages/cart/cart", 7 | "pages/mem/mem", 8 | 9 | "pages/good/good", 10 | 11 | "pages/list/list", 12 | "pages/kill/kill", 13 | 14 | "pages/order/order", 15 | 16 | "pages/member/morder/morder", 17 | "pages/member/morderinfo/morderinfo", 18 | 19 | "pages/member/money/money", 20 | "pages/member/coup/coup", 21 | "pages/member/favo/favo", 22 | "pages/member/credit/credit", 23 | 24 | "pages/member/agent/agent", 25 | "pages/member/busi/busi", 26 | "pages/member/notice/notice", 27 | "pages/member/message/message", 28 | "pages/member/integral/integral", 29 | 30 | "pages/article/article" 31 | ], 32 | "window": { 33 | "backgroundTextStyle": "dark", 34 | "navigationBarBackgroundColor": "#fff", 35 | "navigationBarTitleText": "码农优选", 36 | "navigationBarTextStyle": "black", 37 | "navigationStyle": "custom" 38 | }, 39 | "networkTimeout": { 40 | "request": 10000, 41 | "connectSocket": 10000, 42 | "uploadFile": 600000, 43 | "downloadFile": 600000 44 | }, 45 | "tabBar": { 46 | "color": "#c6c7c8", 47 | "selectedColor": "#ff586d", 48 | "backgroundColor": "#fff", 49 | "borderStyle": "white", 50 | "list": [ 51 | { 52 | "pagePath": "pages/index/index", 53 | "text": "首页", 54 | "iconPath": "./static/index.png", 55 | "selectedIconPath": "./static/indexo.png" 56 | }, 57 | { 58 | "pagePath": "pages/class/class", 59 | "text": "分类", 60 | "iconPath": "./static/class.png", 61 | "selectedIconPath": "./static/classo.png" 62 | }, 63 | { 64 | "pagePath": "pages/recom/recom", 65 | "text": "值得买", 66 | "iconPath": "./static/recom.png", 67 | "selectedIconPath": "./static/recomo.png" 68 | }, 69 | { 70 | "pagePath": "pages/cart/cart", 71 | "text": "购物车", 72 | "iconPath": "./static/cart.png", 73 | "selectedIconPath": "./static/carto.png" 74 | }, 75 | { 76 | "pagePath": "pages/mem/mem", 77 | "text": "我的", 78 | "iconPath": "./static/mem.png", 79 | "selectedIconPath": "./static/memo.png" 80 | } 81 | ] 82 | }, 83 | "usingComponents": { 84 | "header": "/components/header/header" 85 | }, 86 | "style": "v2", 87 | "sitemapLocation": "sitemap.json" 88 | } -------------------------------------------------------------------------------- /小程序 商城/components/header/header.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | Component({ 4 | 5 | /* 6 | 组件的一些选项 7 | */ 8 | options: { 9 | addGlobalClass: true, 10 | multipleSlots: true 11 | }, 12 | 13 | /* 14 | 组件的对外属性 15 | */ 16 | properties: { 17 | bgColor: { 18 | type: String, 19 | default: '' 20 | }, 21 | isBack: { 22 | type: [Boolean, false], 23 | default: false 24 | }, 25 | bgImage: { 26 | type: String, 27 | default: '' 28 | } 29 | }, 30 | 31 | /* 32 | 组件初始数据 33 | */ 34 | data: { 35 | StatusBar: app.local.StatusBar, 36 | CustomBar: app.local.CustomBar 37 | }, 38 | 39 | /* 40 | 组件方法 41 | */ 42 | methods: { 43 | goBack() { 44 | wx.navigateBack({ 45 | delta: 1 46 | }) 47 | } 48 | } 49 | 50 | }) -------------------------------------------------------------------------------- /小程序 商城/components/header/header.json: -------------------------------------------------------------------------------- 1 | { 2 | "component": true, 3 | "usingComponents": {} 4 | } -------------------------------------------------------------------------------- /小程序 商城/components/header/header.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /小程序 商城/components/header/header.wxss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/components/header/header.wxss -------------------------------------------------------------------------------- /小程序 商城/module/common.wxs: -------------------------------------------------------------------------------- 1 | var split = function(str) { 2 | if(!str) { 3 | return 4 | } 5 | return str.split(',') 6 | } 7 | 8 | module.exports = { 9 | split: split 10 | } -------------------------------------------------------------------------------- /小程序 商城/pages/article/article.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/article/article.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/article/article.wxml: -------------------------------------------------------------------------------- 1 |
2 | 详情 3 |
4 | 5 | 6 | IOS四个隐藏技巧，知道2个更轻松 7 | 8 | 2020年06月12日发布 9 | 10 | 11 | 10.0k 12 | 13 | 14 | 15 | 16 | 17 | 文章内容 18 | 19 | 20 | 当季 21 | 技巧 22 | 23 | 24 | 25 | 26 | 27 | 100 28 | 人点赞 29 | 30 | 31 | 32 | 33 | 本内容来自作者，不代表平台立场 34 | 35 | 36 | 这些很不错哦 37 | 38 | 39 | 40 | 41 | 42 | 夏季女士长裙 43 | 122 人付款 44 | 45 | 46 | 47 | ¥ 48 | 24.00 49 | 50 | 立即前往 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 夏季女士长裙 60 | 122 人付款 61 | 62 | 63 | 64 | ¥ 65 | 24.00 66 | 67 | 立即前往 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 大家都在看 76 | 77 | 78 | 79 | 秋季新款水饮冲调爆品热卖 80 | 81 | 82 | 83 | 好物鉴赏 84 | 85 | 86 | 100 阅读 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 秋季新款水饮冲调爆品热卖 96 | 97 | 98 | 99 | 好物鉴赏 100 | 101 | 102 | 100 阅读 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 海报 116 | 117 | 118 | 119 | 收藏 120 | 121 | 122 | 立即拥有 123 | -------------------------------------------------------------------------------- /小程序 商城/pages/article/article.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #fff; 3 | padding-bottom: 100rpx; 4 | } 5 | 6 | .top { 7 | display: flex; 8 | flex-direction: column; 9 | padding: 30rpx; 10 | border-top: 1rpx solid #f7f8fb; 11 | } 12 | 13 | .tit { 14 | font-size: var(--big); 15 | font-weight: bold; 16 | margin-bottom: 20rpx; 17 | } 18 | 19 | .statis { 20 | display: flex; 21 | justify-content: space-between; 22 | } 23 | 24 | .statis-view { 25 | font-family: din; 26 | } 27 | 28 | .con { 29 | position: relative; 30 | overflow: hidden; 31 | padding: 30rpx; 32 | } 33 | 34 | .con image { 35 | max-width: 100%; 36 | pointer-events: none; 37 | display: block; 38 | } 39 | 40 | .labels { 41 | display: flex; 42 | flex-wrap: wrap; 43 | margin: 100rpx 0 30rpx; 44 | } 45 | 46 | .labels-item { 47 | margin: 10rpx; 48 | font-size: 28rpx; 49 | padding: 5rpx 20rpx 3rpx; 50 | background-color: #f7f8fb; 51 | } 52 | 53 | .dos { 54 | display: flex; 55 | flex-direction: column; 56 | align-items: center; 57 | justify-content: center; 58 | margin: 100rpx 0 30rpx; 59 | } 60 | 61 | .dos-tip { 62 | font-size: 28rpx; 63 | } 64 | 65 | .dos-icon { 66 | font-size: var(--bigera); 67 | } 68 | 69 | .hot { 70 | border-top: 10rpx solid #f7f8fb; 71 | border-bottom: 10rpx solid #f7f8fb; 72 | 73 | } 74 | 75 | .hot-tit { 76 | color: #666; 77 | padding: 30rpx 30rpx 10rpx; 78 | } 79 | 80 | .tip { 81 | display: flex; 82 | justify-content: center; 83 | padding: 50rpx 0; 84 | margin-top: 20rpx; 85 | border-top: 1rpx solid #f7f8fb; 86 | } 87 | 88 | .good { 89 | display: flex; 90 | margin: 50rpx 10rpx; 91 | } 92 | 93 | .good-img { 94 | max-width: 230rpx; 95 | max-height: 180rpx; 96 | margin: 0 20rpx; 97 | } 98 | 99 | .good-info { 100 | flex: 1; 101 | display: flex; 102 | flex-direction: column; 103 | justify-content: space-between; 104 | margin-right: 30rpx; 105 | } 106 | 107 | .good-tit { 108 | font-weight: bold; 109 | font-size: var(--big); 110 | } 111 | 112 | .good-sale { 113 | font-size: var(--mini); 114 | margin-top: 5rpx; 115 | } 116 | 117 | .good-bot { 118 | display: flex; 119 | align-items: center; 120 | justify-content: space-between; 121 | } 122 | 123 | .good-go { 124 | color: #ff586d; 125 | font-size: var(--mini); 126 | padding: 10rpx 30rpx; 127 | background-color: rgba(255, 88, 109, .3); 128 | } 129 | 130 | .good-mon { 131 | font-family: din; 132 | font-size: var(--big); 133 | } 134 | 135 | .art { 136 | display: flex; 137 | margin: 50rpx 10rpx; 138 | } 139 | 140 | .art-tit { 141 | font-size: var(--big); 142 | font-weight: bold; 143 | margin: 0 20rpx; 144 | } 145 | 146 | .art-info { 147 | display: flex; 148 | align-items: center; 149 | justify-content: space-between; 150 | padding: 10rpx 20rpx 0; 151 | } 152 | 153 | .art-min { 154 | font-size: var(--mini); 155 | } 156 | 157 | .art-user { 158 | display: flex; 159 | align-items: center; 160 | } 161 | 162 | .art-user image { 163 | width: 40rpx; 164 | height: 40rpx; 165 | overflow: hidden; 166 | margin-right: 10rpx; 167 | } 168 | 169 | .art-user text { 170 | font-size: var(--mini); 171 | } 172 | 173 | .art-con { 174 | flex: 1; 175 | display: flex; 176 | flex-direction: column; 177 | justify-content: space-between; 178 | } 179 | 180 | .art-img { 181 | max-width: 230rpx; 182 | max-height: 180rpx; 183 | margin: 0 20rpx; 184 | } 185 | 186 | 187 | .footer { 188 | position: fixed; 189 | bottom: 0; 190 | left: 0; 191 | right: 0; 192 | height: 96rpx; 193 | z-index: 980; 194 | display: flex; 195 | align-items: center; 196 | justify-content: space-between; 197 | padding: 0 30rpx; 198 | background-color: rgba(255, 255, 255, .97); 199 | } 200 | 201 | 202 | .footer-dos { 203 | width: 250rpx; 204 | display: flex; 205 | } 206 | 207 | .footer-item { 208 | display: flex; 209 | flex-direction: column; 210 | align-items: center; 211 | justify-content: center; 212 | background-color: transparent; 213 | white-space: nowrap; 214 | padding: 10rpx; 215 | margin-right: 30rpx; 216 | } 217 | 218 | .footer-item.act { 219 | color: #ff586d; 220 | } 221 | 222 | .footer-item image { 223 | width: 40rpx; 224 | height: 40rpx; 225 | } 226 | 227 | .footer-item text { 228 | height: 36rpx; 229 | font-size: var(--bigers); 230 | } 231 | 232 | .footer-item view { 233 | color: #999; 234 | font-size: var(--minie); 235 | font-weight: lighter; 236 | margin-top: 10rpx; 237 | } 238 | 239 | .footer-get { 240 | color: #fff; 241 | height: 60rpx; 242 | line-height: 60rpx; 243 | padding: 0 30rpx; 244 | background-color: rgba(255, 88, 109, .8); 245 | border-radius: 60rpx; 246 | } -------------------------------------------------------------------------------- /小程序 商城/pages/cart/cart.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const goods = require('../../utils/pro') 3 | 4 | let that 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | StatusBar: app.local.StatusBar, 12 | CustomBar: app.local.CustomBar, 13 | recom: [] 14 | }, 15 | 16 | /** 17 | * 生命周期函数--监听页面加载 18 | */ 19 | onLoad: function (options) { 20 | this.setData({ 21 | recom: goods.list 22 | }) 23 | }, 24 | 25 | /** 26 | * 生命周期函数--监听页面初次渲染完成 27 | */ 28 | onReady: function () { 29 | 30 | }, 31 | 32 | /** 33 | * 生命周期函数--监听页面显示 34 | */ 35 | onShow: function () { 36 | 37 | }, 38 | 39 | /** 40 | * 生命周期函数--监听页面隐藏 41 | */ 42 | onHide: function () { 43 | 44 | }, 45 | 46 | /** 47 | * 生命周期函数--监听页面卸载 48 | */ 49 | onUnload: function () { 50 | 51 | }, 52 | 53 | /** 54 | * 页面相关事件处理函数--监听用户下拉动作 55 | */ 56 | onPullDownRefresh: function () { 57 | 58 | }, 59 | 60 | /** 61 | * 页面上拉触底事件的处理函数 62 | */ 63 | onReachBottom: function () { 64 | 65 | }, 66 | 67 | /** 68 | * 用户点击右上角分享 69 | */ 70 | onShareAppMessage: function () { 71 | 72 | } 73 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/cart/cart.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/cart/cart.wxml: -------------------------------------------------------------------------------- 1 | 2 | 购物车 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 水果刀 15 | 16 | 10 斤 大颗 17 | 18 | 19 | 20 | 21 | 22 | ¥100.00 23 | 24 | 25 | - 26 | 1 27 | + 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 水果刀 41 | 42 | 10 斤 大颗 43 | 44 | 45 | 46 | 47 | 48 | ¥100.00 49 | 50 | 51 | - 52 | 1 53 | + 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | 为 62 | / 63 | 您 64 | / 65 | 推 66 | / 67 | 荐 68 | 69 | RECOMMENDED FRO YOU 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | {{item.title}} 79 | {{item.buyNum}} 人付款 80 | 81 | 82 | ¥ 83 | {{item.price}} 84 | 85 | ¥{{item.market}} 86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 全选 97 | 98 | 99 | 100 | 合计：¥ 129.00 101 | 102 | 去结算 103 | 104 | -------------------------------------------------------------------------------- /小程序 商城/pages/cart/cart.wxss: -------------------------------------------------------------------------------- 1 | .head { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | display: flex; 7 | align-items: center; 8 | padding-left: 20rpx; 9 | background-color: #fff; 10 | z-index: 99999; 11 | } 12 | 13 | .footer { 14 | position: fixed; 15 | bottom: 0; 16 | left: 0; 17 | right: 0; 18 | padding: 0; 19 | min-height: 98rpx; 20 | display: flex; 21 | align-items: center; 22 | justify-content: space-between; 23 | background-color: #fff; 24 | padding: 0 20rpx; 25 | border-bottom: 1rpx solid #f2f5f7; 26 | z-index: 99999; 27 | } 28 | 29 | .scroll { 30 | position: absolute; 31 | top: 0; 32 | bottom: 98rpx; 33 | left: 0; 34 | width: 100%; 35 | } 36 | 37 | .good { 38 | display: flex; 39 | align-items: center; 40 | margin: 20rpx 20rpx; 41 | padding: 15rpx; 42 | background-color: #fff; 43 | } 44 | 45 | .good-info { 46 | min-height: 180rpx; 47 | flex: 1; 48 | display: flex; 49 | flex-direction: column; 50 | justify-content: space-between; 51 | } 52 | 53 | .good-img { 54 | width: 180rpx; 55 | height: 180rpx; 56 | margin: 0 25rpx 0 5rpx; 57 | } 58 | 59 | .good-img image { 60 | width: 100%; 61 | height: 100%; 62 | } 63 | 64 | .good-top { 65 | flex: 1; 66 | } 67 | 68 | .good-name { 69 | font-size: var(--big); 70 | line-height: 40rpx; 71 | height: 80rpx; 72 | margin-bottom: 5rpx; 73 | overflow: hidden; 74 | } 75 | 76 | .good-bot { 77 | flex: 1; 78 | display: flex; 79 | align-items: center; 80 | justify-content: space-between; 81 | margin-top: 15rpx; 82 | } 83 | 84 | .good-dos { 85 | display: flex; 86 | align-items: center; 87 | } 88 | 89 | .good-plus { 90 | width: 60rpx; 91 | height: 50rpx; 92 | line-height: 50rpx; 93 | text-align: center; 94 | border: 1rpx solid #f6f7f8; 95 | } 96 | 97 | .good-nums { 98 | width: 70rpx; 99 | height: 50rpx; 100 | line-height: 50rpx; 101 | text-align: center; 102 | border: 1rpx solid #f6f7f8; 103 | border-right: 0; 104 | border-left: 0; 105 | } 106 | 107 | .good-price { 108 | color: #f78c2d; 109 | font-family: din; 110 | } 111 | 112 | .good-price text { 113 | font-size: var(--biger); 114 | } 115 | 116 | .go-info { 117 | display: flex; 118 | align-items: center; 119 | } 120 | 121 | .go-buy { 122 | width: 200rpx; 123 | height: 68rpx; 124 | line-height: 68rpx; 125 | text-align: center; 126 | color: #fff; 127 | margin-left: 20rpx; 128 | background-color: #ff586d; 129 | } 130 | 131 | .go-price { 132 | color: #ff586d; 133 | font-family: din; 134 | font-size: var(--biger); 135 | } 136 | 137 | .go-check { 138 | display: flex; 139 | align-items: center; 140 | } 141 | 142 | .go-check text { 143 | font-size: var(--mini); 144 | } 145 | 146 | radio { 147 | transform: scale(0.8) 148 | } 149 | 150 | 151 | .tit { 152 | display: flex; 153 | flex-direction: column; 154 | align-items: center; 155 | justify-content: center; 156 | margin: 50rpx 0 30rpx; 157 | } 158 | 159 | .tit-name { 160 | letter-spacing: 10rpx; 161 | font-weight: bold; 162 | } 163 | 164 | .tit-line { 165 | font-weight: lighter; 166 | margin: 0 5rpx; 167 | } 168 | 169 | .tit-tip { 170 | margin-top: 10rpx; 171 | font-size: var(--minier); 172 | } 173 | 174 | 175 | .hot { 176 | display: flex; 177 | flex-wrap: wrap; 178 | justify-content: space-between; 179 | margin: 0 20rpx; 180 | } 181 | 182 | .hot-box { 183 | width: 48.5%; 184 | padding-bottom: 20rpx; 185 | margin-bottom: 20rpx; 186 | overflow: hidden; 187 | background-color: rgba(255, 255, 255, .98); 188 | } 189 | 190 | .hot-box-img { 191 | height: 350rpx; 192 | overflow: hidden; 193 | } 194 | 195 | .hot-box-img image { 196 | max-height: 100%; 197 | } 198 | 199 | .hot-pd { 200 | padding: 0 20rpx; 201 | } 202 | 203 | 204 | .kill-good-name { 205 | font-weight: bold; 206 | white-space: nowrap; 207 | text-overflow: ellipsis; 208 | overflow: hidden; 209 | margin-top: 10rpx; 210 | } 211 | 212 | .kill-good-soal { 213 | font-size: var(--minier); 214 | } 215 | 216 | .kill-good-price { 217 | display: flex; 218 | margin-top: 13rpx; 219 | } 220 | 221 | .kill-good-now { 222 | color: #f78c2d; 223 | } 224 | 225 | .kill-good-symbol { 226 | font-weight: bold; 227 | font-size: var(--minier); 228 | } 229 | 230 | .kill-good-money { 231 | font-size: var(--biger); 232 | font-family: 'din'; 233 | font-weight: bold; 234 | } 235 | 236 | .kill-good-old { 237 | margin: 13rpx 0 0 5rpx; 238 | font-family: 'din'; 239 | font-size: var(--mini); 240 | text-decoration: line-through; 241 | } -------------------------------------------------------------------------------- /小程序 商城/pages/class/class.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const http = require('../../utils/http') 3 | 4 | let that, cid = '' 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | StatusBar: app.local.StatusBar, 12 | CustomBar: app.local.CustomBar, 13 | classList: [], 14 | childList: [], 15 | current: 0 16 | }, 17 | 18 | /** 19 | * 生命周期函数--监听页面加载 20 | */ 21 | onLoad: function (options) { 22 | that = this 23 | 24 | this.getClass() 25 | }, 26 | 27 | getClass: function() { 28 | http.post('v1/category/childlist', { 29 | basecode: 'CategoryManage' 30 | }).then(res => { 31 | console.log(res) 32 | if(res.data.code === 0) { 33 | that.setData({ 34 | classList: res.data.data 35 | }) 36 | 37 | cid = res.data.data[that.data.current].id 38 | that.getChild() 39 | } 40 | }) 41 | }, 42 | 43 | getChild: function() { 44 | http.post('v1/category/secondchild', { 45 | parentid: that.data.classList[that.data.current].id 46 | }).then(res => { 47 | console.log(res) 48 | if(res.data.code === 0) { 49 | that.setData({ 50 | childList: res.data.data 51 | }) 52 | } 53 | }) 54 | }, 55 | 56 | //切换分类 57 | switchTab: function(e) { 58 | const evt = e.currentTarget.dataset 59 | cid = evt.cid 60 | 61 | this.setData({ 62 | current: evt.ind 63 | }) 64 | this.getChild() 65 | } 66 | 67 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/class/class.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/class/class.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 码农优选 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 精选推荐 20 | 居家生活 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 当季 30 | 31 | 32 | 女装 33 | 34 | 35 | 36 | 羽绒 37 | 38 | 39 | 40 | 内衣 41 | 42 | 43 | 44 | 45 | 46 | -------------------------------------------------------------------------------- /小程序 商城/pages/class/class.wxss: -------------------------------------------------------------------------------- 1 | .top { 2 | position: relative; 3 | z-index: 99999; 4 | } 5 | 6 | .head { 7 | position: fixed; 8 | top: 0; 9 | left: 0; 10 | right: 0; 11 | display: flex; 12 | align-items: center; 13 | padding: 0 200rpx 0 20rpx; 14 | z-index: 99999; 15 | background-color: #fff; 16 | } 17 | 18 | .search { 19 | flex: 1; 20 | height: 35px; 21 | display: flex; 22 | align-items: center; 23 | justify-content: space-between; 24 | background-color: rgba(0, 0, 0, .03); 25 | padding: 0 20rpx 0 10rpx; 26 | margin-right: 20rpx; 27 | } 28 | 29 | .search-box { 30 | flex: 1; 31 | } 32 | 33 | .search-icon { 34 | font-size: var(--big); 35 | } 36 | 37 | .search-recom { 38 | margin-left: 10rpx; 39 | } 40 | 41 | .box { 42 | position: absolute; 43 | top: 0; 44 | left: 0; 45 | right: 0; 46 | bottom: 0; 47 | display: flex; 48 | width: 100%; 49 | } 50 | 51 | .nav { 52 | flex-shrink: 0; 53 | width: 200rpx; 54 | display: flex; 55 | flex-direction: column; 56 | } 57 | 58 | .nav-item { 59 | flex: 1; 60 | height: 92rpx; 61 | display: flex; 62 | align-items: center; 63 | justify-content: center; 64 | } 65 | 66 | .nav-item.act { 67 | color: #373737; 68 | font-weight: bold; 69 | background-color: #fff; 70 | } 71 | 72 | .con { 73 | flex: 1; 74 | background-color: #fff; 75 | display: flex; 76 | flex-wrap: wrap; 77 | } 78 | 79 | .con-adv { 80 | height: 160rpx; 81 | margin: 20rpx 20rpx 10rpx; 82 | overflow: hidden; 83 | } 84 | 85 | .con-adv image { 86 | width: 100%; 87 | height: 160rpx; 88 | } 89 | 90 | .con-box { 91 | display: flex; 92 | flex-wrap: wrap; 93 | margin: 20rpx 20rpx 0; 94 | box-shadow: 1rpx 2rpx 3rpx rgba(100, 100, 100, 0.07); 95 | } 96 | 97 | .con-tit { 98 | width: 100%; 99 | font-weight: bold; 100 | padding: 15rpx 30rpx 10rpx 10rpx; 101 | background-color: #fcfcfc; 102 | } 103 | 104 | .con-item { 105 | width: 31%; 106 | display: flex; 107 | flex-direction: column; 108 | justify-content: center; 109 | align-items: center; 110 | margin: 10rpx 0; 111 | } 112 | 113 | .con-item image { 114 | width: 100rpx; 115 | height: 100rpx; 116 | margin-bottom: 5rpx; 117 | } -------------------------------------------------------------------------------- /小程序 商城/pages/good/good.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const http = require('../../utils/http') 3 | 4 | let that, did = '' 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | StatusBar: app.local.StatusBar, 12 | CustomBar: app.local.CustomBar, 13 | alpha: 0, 14 | info: null, 15 | speci: [] 16 | }, 17 | 18 | /** 19 | * 生命周期函数--监听页面加载 20 | */ 21 | onLoad: function (options) { 22 | that = this 23 | did = options.did 24 | console.log(did) 25 | this.getInfo() 26 | }, 27 | 28 | getInfo: function() { 29 | wx.showLoading({ 30 | title: '飞速加载中...', 31 | mask: true 32 | }) 33 | http.post('v1/productinfo/detailkey', { 34 | baseid: did 35 | }).then(res => { 36 | console.log(res) 37 | if(res.data.code === 0) { 38 | let imgStr = '' 39 | res.data.data.descript.replace(/]*src=['"]([^'"]+)[^>]*>/gi, function (match, capture) { 40 | imgStr += '' 41 | }) 42 | res.data.data.descript = imgStr 43 | that.setData({ 44 | info: res.data.data 45 | }) 46 | 47 | that.getSpeci() 48 | } else { 49 | wx.showToast({ 50 | title: res.data.msg, 51 | icon: 'none' 52 | }) 53 | 54 | setTimeout(function() { 55 | wx.navigateBack({ 56 | delta: 1 57 | }) 58 | }, 800) 59 | } 60 | }) 61 | }, 62 | 63 | //获取规格 64 | getSpeci: function() { 65 | http.post('v1/productinfo/specinfo', { 66 | baseid: did 67 | }).then(res => { 68 | console.log(res) 69 | if(res.data.code === 0) { 70 | that.setData({ 71 | speci: res.data.data 72 | }) 73 | } 74 | wx.hideLoading() 75 | }) 76 | 77 | this.getSku() 78 | }, 79 | 80 | //商品sku 81 | getSku: function() { 82 | http.post('v1/productinfo/skuinfo', { 83 | baseid: did 84 | }).then(res => { 85 | console.log(res) 86 | if(res.data.code === 0) { 87 | 88 | } 89 | }) 90 | }, 91 | 92 | buy: function() { 93 | wx.navigateTo({ 94 | url: '../order/order' 95 | }) 96 | }, 97 | 98 | /** 99 | * 生命周期函数--监听页面初次渲染完成 100 | */ 101 | onReady: function () { 102 | http.getSystem(app) 103 | }, 104 | 105 | /** 106 | * 生命周期函数--监听页面显示 107 | */ 108 | onShow: function () { 109 | 110 | }, 111 | 112 | /** 113 | * 生命周期函数--监听页面隐藏 114 | */ 115 | onHide: function () { 116 | 117 | }, 118 | 119 | /** 120 | * 生命周期函数--监听页面卸载 121 | */ 122 | onUnload: function () { 123 | 124 | }, 125 | 126 | onPageScroll: function(e) { 127 | const alpha = e.scrollTop/100 128 | this.setData({ 129 | alpha: alpha 130 | }) 131 | }, 132 | 133 | goBack: function() { 134 | wx.navigateBack({ 135 | delta: 1 136 | }) 137 | }, 138 | 139 | /** 140 | * 页面相关事件处理函数--监听用户下拉动作 141 | */ 142 | onPullDownRefresh: function () { 143 | 144 | }, 145 | 146 | /** 147 | * 页面上拉触底事件的处理函数 148 | */ 149 | onReachBottom: function () { 150 | 151 | }, 152 | 153 | /** 154 | * 用户点击右上角分享 155 | */ 156 | onShareAppMessage: function () { 157 | 158 | } 159 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/good/good.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/good/good.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | Hi~，木子菇凉 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | ¥ 21 | {{info.price}} 22 | 23 | 24 | 25 | 100 26 | 27 | 28 | {{info.productname}} 29 | {{info.des}} 30 | 31 | 32 | 33 | 34 | 35 | 运费 36 | 满99元免邮费 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 领券 45 | 46 | 每满150减18 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | ● 56 | {{item.servnm}} 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 规格参数 65 | 66 | 67 | 分类 68 | 连衣裙 69 | 70 | 71 | 分类 72 | 连衣裙 73 | 74 | 75 | 分类 76 | 连衣裙 77 | 78 | 79 | 分类 80 | 连衣裙 81 | 82 | 83 | 84 | 85 | 86 | 87 | 商品信息 88 | 89 | 90 | 91 | 92 | 93 | 94 | 95 | 96 | 97 | 101 | 105 | 106 | 加入购物车 107 | 立即购买 108 | -------------------------------------------------------------------------------- /小程序 商城/pages/good/good.wxss: -------------------------------------------------------------------------------- 1 | .head { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | display: flex; 7 | align-items: center; 8 | padding-left: 60rpx; 9 | background-color: rgba(255, 255, 255, .97); 10 | z-index: 99999; 11 | } 12 | 13 | .back { 14 | position: fixed; 15 | top: 0; 16 | left: 20rpx; 17 | display: flex; 18 | align-items: center; 19 | z-index: 999999; 20 | } 21 | 22 | .swipe { 23 | min-height: 750rpx; 24 | height: 750rpx; 25 | } 26 | 27 | .box { 28 | display: flex; 29 | flex-direction: column; 30 | background-color: #fff; 31 | margin-bottom: 15rpx; 32 | } 33 | 34 | .tit { 35 | display: flex; 36 | justify-content: space-between; 37 | align-items: flex-start; 38 | padding: 30rpx 20rpx 10rpx; 39 | } 40 | 41 | .price { 42 | color: #f78c2d; 43 | } 44 | 45 | .price-symbol { 46 | font-size: var(--mini); 47 | } 48 | 49 | .price-money { 50 | font-size: var(--biger); 51 | font-family: din; 52 | font-weight: bold; 53 | margin-left: 2rpx; 54 | } 55 | 56 | .tit-favo { 57 | display: flex; 58 | flex-direction: column; 59 | align-items: center; 60 | justify-content: center; 61 | } 62 | 63 | .favo-num { 64 | font-size: var(--mini); 65 | margin-top: 5rpx; 66 | } 67 | 68 | .favo { 69 | font-size: var(--biger); 70 | } 71 | 72 | .favod { 73 | color: #ff586d; 74 | } 75 | 76 | .good-name { 77 | font-size: var(--big); 78 | padding: 0 20rpx 10rpx; 79 | } 80 | 81 | .good-tip { 82 | padding: 0 20rpx 30rpx; 83 | } 84 | 85 | .good-attr { 86 | display: flex; 87 | align-items: center; 88 | justify-content: space-between; 89 | padding: 27rpx 20rpx; 90 | border-bottom: 1rpx solid #f7f8f9; 91 | } 92 | 93 | .good-attr-info { 94 | display: flex; 95 | align-items: center; 96 | } 97 | 98 | .good-attr-name { 99 | margin-right: 10rpx; 100 | } 101 | 102 | .good-tick { 103 | color: #ff586d; 104 | margin-right: 15rpx; 105 | } 106 | 107 | .box-alpha { 108 | opacity: .8; 109 | padding: 25rpx 20rpx; 110 | display: flex; 111 | background-color: rgba(250, 250, 247, .67); 112 | } 113 | 114 | .good-equel { 115 | margin-right: 20rpx; 116 | display: flex; 117 | align-items: center; 118 | } 119 | 120 | .good-equel-dot { 121 | color: #ff586d; 122 | margin-right: 5rpx; 123 | font-size: var(--minier); 124 | } 125 | 126 | .good-params { 127 | padding: 20rpx; 128 | flex-direction: row; 129 | flex-wrap: wrap; 130 | } 131 | 132 | .good-params-all { 133 | width: 100%; 134 | padding: 5rpx 0 15rpx; 135 | display: flex; 136 | align-items: center; 137 | font-weight: bold; 138 | } 139 | 140 | .good-params-two { 141 | padding: 5rpx 20rpx 15rpx; 142 | } 143 | 144 | .good-params-all view { 145 | width: 5rpx; 146 | height: 20rpx; 147 | margin-right: 10rpx; 148 | background-color: rgba(255, 88, 109, .37); 149 | } 150 | 151 | .good-params-item { 152 | display: flex; 153 | width: 50%; 154 | padding: 20rpx 0; 155 | } 156 | 157 | .good-params-item text { 158 | margin-right: 20rpx; 159 | } 160 | 161 | .good-info { 162 | padding-top: 20rpx; 163 | } 164 | 165 | .good-con { 166 | position: relative; 167 | width: 100%; 168 | text-align: center; 169 | overflow: hidden; 170 | margin-bottom: 70rpx; 171 | } 172 | 173 | .good-con image { 174 | width: 100%; 175 | display: block; 176 | } 177 | 178 | 179 | .footer { 180 | position: fixed; 181 | bottom: 0; 182 | left: 0; 183 | width: 100%; 184 | height: 90rpx; 185 | display: flex; 186 | align-items: center; 187 | justify-content: space-around; 188 | background-color: #fff 189 | } 190 | 191 | .footer-dos { 192 | width: 250rpx; 193 | display: flex; 194 | justify-content: space-around; 195 | margin: 0 37rpx 0 5rpx; 196 | } 197 | 198 | .footer-item { 199 | display: flex; 200 | flex-direction: column; 201 | align-items: center; 202 | justify-content: center; 203 | background-color: transparent; 204 | white-space: nowrap; 205 | padding: 10rpx; 206 | } 207 | 208 | .footer-item image { 209 | width: 40rpx; 210 | height: 40rpx; 211 | } 212 | 213 | .footer-item text { 214 | color: #ff586d; 215 | font-size: 20rpx; 216 | font-weight: lighter; 217 | } 218 | 219 | .footer-buy { 220 | flex: 1; 221 | color: #fff; 222 | height: 68rpx; 223 | display: flex; 224 | align-items: center; 225 | justify-content: center; 226 | background-color: #ff586d; 227 | margin-right: 20rpx; 228 | } 229 | 230 | .footer-cart { 231 | flex: 1.2; 232 | color: #fff; 233 | height: 68rpx; 234 | display: flex; 235 | align-items: center; 236 | justify-content: center; 237 | background-color: #ff9f5e; 238 | margin-right: 20rpx; 239 | } 240 | -------------------------------------------------------------------------------- /小程序 商城/pages/index/index.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const http = require('../../utils/http') 3 | const goods = require('../../utils/pro') 4 | 5 | let that 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | StatusBar: app.local.StatusBar, 13 | CustomBar: app.local.CustomBar, 14 | swiperTop: [], 15 | classList: [], 16 | goods: [], 17 | kill: [] 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面加载 22 | */ 23 | onLoad: function (options) { 24 | that = this 25 | let killarr = [] 26 | for(let i=0; i<3; i++) { 27 | killarr.push(goods.list[Math.floor(Math.random()*10)]) 28 | } 29 | console.log(killarr) 30 | this.setData({ 31 | goods: goods.list, 32 | kill: killarr 33 | }) 34 | 35 | this.getClass() 36 | }, 37 | 38 | getClass: function() { 39 | let classArr = [] 40 | for(let i=0; i<10; i++) { 41 | classArr.push({ 42 | imgurl: `../../static/class/c${i}.png`, 43 | categoryname: '分类'+i 44 | }) 45 | } 46 | 47 | this.setData({ 48 | classList: classArr 49 | }) 50 | }, 51 | 52 | /** 53 | * 生命周期函数--监听页面初次渲染完成 54 | */ 55 | onReady: function () { 56 | http.getSystem(app) 57 | }, 58 | 59 | /** 60 | * 生命周期函数--监听页面显示 61 | */ 62 | onShow: function () { 63 | 64 | }, 65 | 66 | /** 67 | * 生命周期函数--监听页面隐藏 68 | */ 69 | onHide: function () { 70 | 71 | }, 72 | 73 | /** 74 | * 生命周期函数--监听页面卸载 75 | */ 76 | onUnload: function () { 77 | 78 | }, 79 | 80 | /** 81 | * 页面相关事件处理函数--监听用户下拉动作 82 | */ 83 | onPullDownRefresh: function () { 84 | 85 | }, 86 | 87 | /** 88 | * 页面上拉触底事件的处理函数 89 | */ 90 | onReachBottom: function () { 91 | 92 | }, 93 | 94 | /** 95 | * 用户点击右上角分享 96 | */ 97 | onShareAppMessage: function () { 98 | 99 | } 100 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/index/index.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/index/index.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 码农优选 4 | 5 | 6 | 7 | 8 | 9 | 码农优选 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | {{item.categoryname}} 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 限时秒杀 53 | 54 | 55 | 进去狂逛 56 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | {{item.title}} 65 | 已售{{item.buyNum}} 仅剩12份 66 | 67 | 68 | ¥ 69 | {{item.price}} 70 | 71 | ¥{{item.market}} 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 猜您喜欢 81 | 82 | 83 | 84 | 特惠 85 | 86 | 87 | 88 | 运动 89 | 90 | 91 | 92 | 洗护 93 | 94 | 95 | 96 | 母婴 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | {{item.title}} 108 | {{item.buyNum}} 人付款 109 | 110 | 111 | ¥ 112 | {{item.price}} 113 | 114 | ¥{{item.market}} 115 | 116 | 117 | 118 | -------------------------------------------------------------------------------- /小程序 商城/pages/index/index.wxss: -------------------------------------------------------------------------------- 1 | .head { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | right: 0; 6 | display: flex; 7 | flex-direction: column; 8 | padding-left: 20rpx; 9 | z-index: 99999; 10 | background-color: rgba(255, 255, 255, .97); 11 | } 12 | 13 | .tit { 14 | display: flex; 15 | align-items: center; 16 | } 17 | 18 | .head-box { 19 | display: flex; 20 | align-items: center; 21 | justify-content: space-between; 22 | padding: 15px 20rpx 10px 0; 23 | } 24 | 25 | .search { 26 | flex: 1; 27 | height: 35px; 28 | display: flex; 29 | align-items: center; 30 | justify-content: space-between; 31 | background-color: rgba(0, 0, 0, .03); 32 | padding: 0 20rpx 0 10rpx; 33 | margin-right: 20rpx; 34 | } 35 | 36 | .search-box { 37 | flex: 1; 38 | } 39 | 40 | .search-icon { 41 | font-size: var(--big); 42 | } 43 | 44 | .search-recom { 45 | margin-left: 10rpx; 46 | } 47 | 48 | .gift { 49 | display: flex; 50 | align-items: center; 51 | } 52 | 53 | .gift image { 54 | width: 32px; 55 | height: 32px; 56 | } 57 | 58 | .swiper { 59 | min-height: 320rpx; 60 | margin: 0 20rpx; 61 | overflow: hidden; 62 | } 63 | 64 | .tab { 65 | display: flex; 66 | flex-wrap: wrap; 67 | margin: 20rpx; 68 | justify-content: space-between; 69 | } 70 | 71 | .tab-item { 72 | width: 20%; 73 | display: flex; 74 | flex-direction: column; 75 | justify-content: center; 76 | align-items: center; 77 | margin: 20rpx 0; 78 | } 79 | 80 | .tab-img { 81 | width: 86rpx; 82 | height: 86rpx; 83 | margin-bottom: 10rpx; 84 | background-color: rgba(0, 0, 0, .07); 85 | } 86 | 87 | .tab-txt { 88 | font-size: var(--mini); 89 | } 90 | 91 | .adver { 92 | margin: 0 20rpx; 93 | min-height: 180rpx; 94 | height: 180rpx; 95 | overflow: hidden; 96 | } 97 | 98 | .kill { 99 | display: flex; 100 | flex-direction: column; 101 | margin: 30rpx 20rpx; 102 | padding: 20rpx; 103 | background-color: rgba(255, 255, 255, .98); 104 | } 105 | 106 | .kill-tit { 107 | flex: 1; 108 | display: flex; 109 | align-items: center; 110 | justify-content: space-between; 111 | } 112 | 113 | .kill-tit-name { 114 | margin-left: 5rpx; 115 | font-size: var(--big); 116 | font-weight: bold; 117 | } 118 | 119 | .kill-more { 120 | font-size: var(--mini); 121 | } 122 | 123 | .kill-list { 124 | display: flex; 125 | justify-content: space-between; 126 | margin-top: 30rpx; 127 | } 128 | 129 | .kill-good { 130 | width: 31%; 131 | display: flex; 132 | flex-direction: column; 133 | } 134 | 135 | .kill-good-img { 136 | width: 100%; 137 | } 138 | 139 | .kill-good-name { 140 | font-weight: bold; 141 | white-space: nowrap; 142 | text-overflow: ellipsis; 143 | overflow: hidden; 144 | margin-top: 10rpx; 145 | } 146 | 147 | .kill-good-soal { 148 | font-size: var(--minier); 149 | } 150 | 151 | .kill-good-price { 152 | display: flex; 153 | margin-top: 13rpx; 154 | } 155 | 156 | .kill-good-now { 157 | color: #f78c2d; 158 | } 159 | 160 | .kill-good-symbol { 161 | font-weight: bold; 162 | font-size: var(--minier); 163 | } 164 | 165 | .kill-good-money { 166 | font-size: var(--biger); 167 | font-family: 'din'; 168 | font-weight: bold; 169 | } 170 | 171 | .kill-good-old { 172 | margin: 13rpx 0 0 5rpx; 173 | font-family: 'din'; 174 | font-size: var(--mini); 175 | text-decoration: line-through; 176 | } 177 | 178 | .scroll { 179 | width: 100%; 180 | white-space: nowrap; 181 | margin-bottom: 30rpx; 182 | } 183 | 184 | .scroll-item { 185 | width: 25%; 186 | line-height: 70rpx; 187 | color: #aaa; 188 | text-align: center; 189 | display: inline-block; 190 | } 191 | 192 | .scroll-item .line { 193 | width: 60rpx; 194 | height: 3px; 195 | line-height: 3px; 196 | margin: 0 auto; 197 | display: none; 198 | background-color: #00c452; 199 | } 200 | 201 | .scroll-act { 202 | color: #373737; 203 | font-weight: bold; 204 | } 205 | 206 | .scroll-act .line { 207 | display: block; 208 | } 209 | 210 | .hot { 211 | display: flex; 212 | flex-wrap: wrap; 213 | justify-content: space-between; 214 | margin: 0 20rpx 20rpx; 215 | } 216 | 217 | .hot-box { 218 | width: 48.5%; 219 | padding-bottom: 20rpx; 220 | margin-bottom: 20rpx; 221 | overflow: hidden; 222 | background-color: rgba(255, 255, 255, .98); 223 | } 224 | 225 | .hot-box-img { 226 | height: 350rpx; 227 | overflow: hidden; 228 | } 229 | 230 | .hot-box-img image { 231 | max-height: 100%; 232 | } 233 | 234 | .hot-pd { 235 | padding: 0 20rpx; 236 | } -------------------------------------------------------------------------------- /小程序 商城/pages/kill/kill.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/kill/kill.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/kill/kill.wxml: -------------------------------------------------------------------------------- 1 |
2 | 限时秒杀 3 |
4 | 5 | 6 | 7 | 8 | 9 | 10 | 柠檬小龙虾沙拉 11 | 12 | 13 | ¥ 14 | 12.00 15 | ¥24.00 16 | 17 | 18 | 去抢购 19 | 20 | 21 | 20% 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 柠檬小龙虾沙拉 34 | 35 | 36 | ¥ 37 | 12.00 38 | ¥24.00 39 | 40 | 41 | 去抢购 42 | 43 | 44 | 20% 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 柠檬小龙虾沙拉 57 | 58 | 59 | ¥ 60 | 12.00 61 | ¥24.00 62 | 63 | 64 | 去抢购 65 | 66 | 67 | 20% 68 | 69 | 70 | 71 | 72 | -------------------------------------------------------------------------------- /小程序 商城/pages/kill/kill.wxss: -------------------------------------------------------------------------------- 1 | .kill { 2 | display: flex; 3 | background-color: #fff; 4 | padding: 25rpx 20rpx; 5 | margin: 15rpx 20rpx; 6 | } 7 | 8 | .kill-img { 9 | width: 200rpx; 10 | height: 200rpx; 11 | overflow: hidden; 12 | margin-right: 20rpx; 13 | } 14 | 15 | .kill-img image { 16 | max-width: 100%; 17 | max-height: 100%; 18 | } 19 | 20 | .kill-info { 21 | flex: 1; 22 | display: flex; 23 | flex-direction: column; 24 | justify-content: space-between; 25 | } 26 | 27 | .kill-tit { 28 | flex: 1; 29 | font-size: var(--big); 30 | } 31 | 32 | .kill-bot { 33 | flex: 1; 34 | display: flex; 35 | align-items: flex-end; 36 | justify-content: space-between; 37 | } 38 | 39 | .kill-pri { 40 | font-size: var(--mini); 41 | } 42 | 43 | .kill-mon { 44 | font-size: var(--biger); 45 | font-family: din; 46 | font-weight: bold; 47 | } 48 | 49 | .kill-mark { 50 | color: #aaa; 51 | margin-left: 15rpx; 52 | text-decoration: line-through; 53 | } 54 | 55 | .kill-sub { 56 | flex-shrink: 0; 57 | width: 170rpx; 58 | height: 80rpx; 59 | display: flex; 60 | flex-direction: column; 61 | align-items: center; 62 | justify-content: center; 63 | color: #fff; 64 | background-image: linear-gradient(to right, #ff586d, #ed6666); 65 | } 66 | 67 | .kill-progress { 68 | display: flex; 69 | align-items: center; 70 | } 71 | 72 | .kill-progress progress { 73 | width: 100rpx; 74 | display: inline-block; 75 | } 76 | 77 | .kill-progress text { 78 | font-size: var(--minier); 79 | margin-left: 5rpx; 80 | } -------------------------------------------------------------------------------- /小程序 商城/pages/list/list.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const http = require('../../utils/http') 3 | const goods = require('../../utils/pro') 4 | 5 | let that, cid = '', page = 1 6 | Page({ 7 | 8 | /** 9 | * 页面的初始数据 10 | */ 11 | data: { 12 | scroll: 0, 13 | StatusBar: app.local.StatusBar, 14 | CustomBar: app.local.CustomBar, 15 | tit: '', 16 | list: [] 17 | }, 18 | 19 | /** 20 | * 生命周期函数--监听页面加载 21 | */ 22 | onLoad: function (options) { 23 | that = this 24 | this.setData({ 25 | tit: options.tit 26 | }) 27 | cid = options.cid 28 | 29 | this.getList() 30 | }, 31 | 32 | getList: function() { 33 | const pageSize = 10 34 | 35 | wx.showLoading({ 36 | title: '飞速加载中...', 37 | mask: true 38 | }) 39 | http.post('v1/productinfo/pagelist', { 40 | categoryids: cid, 41 | pageSize: pageSize, 42 | pageNum: page 43 | }).then(res => { 44 | console.log(res) 45 | if(res.data.code === 0) { 46 | that.setData({ 47 | list: res.data.rows 48 | }) 49 | } 50 | 51 | wx.hideLoading() 52 | }) 53 | }, 54 | 55 | onPageScroll: function(e) { 56 | this.setData({ 57 | scroll: e.scrollTop 58 | }) 59 | }, 60 | 61 | /** 62 | * 页面相关事件处理函数--监听用户下拉动作 63 | */ 64 | onPullDownRefresh: function () { 65 | 66 | }, 67 | 68 | /** 69 | * 页面上拉触底事件的处理函数 70 | */ 71 | onReachBottom: function () { 72 | 73 | } 74 | 75 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/list/list.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/list/list.wxml: -------------------------------------------------------------------------------- 1 |
2 | {{tit}} 3 |
4 | 5 | 6 | 7 | 8 | T恤 9 | 10 | 11 | 12 | 短袖 13 | 14 | 15 | 16 | 17 | 综合 18 | 销量 19 | 价格 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | {{item.productname}} 29 | {{item.buycount}} 人付款 30 | 31 | 32 | ¥ 33 | {{item.price}} 34 | 35 | ¥{{item.yprice}} 36 | 37 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /小程序 商城/pages/list/list.wxss: -------------------------------------------------------------------------------- 1 | .scroll { 2 | position: relative; 3 | height: 85px; 4 | white-space: nowrap; 5 | margin: 1rpx 0; 6 | background-color: #fff; 7 | } 8 | 9 | .scroll-item { 10 | width: 90rpx; 11 | display: inline-block; 12 | text-align: center; 13 | margin: 17rpx 15rpx 0; 14 | } 15 | 16 | .scroll-item image { 17 | width: 48px; 18 | height: 48px; 19 | border-radius: 12rpx; 20 | border: 5rpx solid #f6f7f8; 21 | } 22 | 23 | .scroll-item.act { 24 | color: #ff586d; 25 | } 26 | 27 | .scroll-item.act image { 28 | border: 5rpx solid #ff586d; 29 | } 30 | 31 | .tab { 32 | display: flex; 33 | padding: 0 30rpx; 34 | justify-content: space-between; 35 | background-color: #fff; 36 | } 37 | 38 | .tab.fix { 39 | position: fixed; 40 | top: 0; 41 | left: 0; 42 | right: 0; 43 | z-index: 200; 44 | } 45 | 46 | .tab-item { 47 | display: flex; 48 | padding: 30rpx 0; 49 | } 50 | 51 | .tab-item.act { 52 | color: #ff586d; 53 | } 54 | 55 | .hot { 56 | display: flex; 57 | flex-wrap: wrap; 58 | justify-content: space-between; 59 | margin: 20rpx; 60 | } 61 | 62 | .hot-box { 63 | width: 48.5%; 64 | padding-bottom: 20rpx; 65 | margin-bottom: 20rpx; 66 | overflow: hidden; 67 | background-color: rgba(255, 255, 255, .98); 68 | } 69 | 70 | .hot-box-img { 71 | height: 350rpx; 72 | overflow: hidden; 73 | } 74 | 75 | .hot-box-img image { 76 | max-height: 100%; 77 | } 78 | 79 | .hot-pd { 80 | padding: 0 20rpx; 81 | } 82 | 83 | .kill-good-name { 84 | font-weight: bold; 85 | white-space: nowrap; 86 | text-overflow: ellipsis; 87 | overflow: hidden; 88 | margin-top: 10rpx; 89 | } 90 | 91 | .kill-good-soal { 92 | font-size: var(--minier); 93 | } 94 | 95 | .kill-good-price { 96 | display: flex; 97 | margin-top: 13rpx; 98 | } 99 | 100 | .kill-good-now { 101 | color: #f78c2d; 102 | } 103 | 104 | .kill-good-symbol { 105 | font-weight: bold; 106 | font-size: var(--minier); 107 | } 108 | 109 | .kill-good-money { 110 | font-size: var(--biger); 111 | font-family: 'din'; 112 | font-weight: bold; 113 | } 114 | 115 | .kill-good-old { 116 | margin: 13rpx 0 0 5rpx; 117 | font-family: 'din'; 118 | font-size: var(--mini); 119 | text-decoration: line-through; 120 | } -------------------------------------------------------------------------------- /小程序 商城/pages/mem/mem.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | const goods = require('../../utils/pro') 3 | 4 | let that 5 | Page({ 6 | 7 | /** 8 | * 页面的初始数据 9 | */ 10 | data: { 11 | StatusBar: app.local.StatusBar, 12 | CustomBar: app.local.CustomBar, 13 | alpha: 0, 14 | recom: [] 15 | }, 16 | 17 | /** 18 | * 生命周期函数--监听页面加载 19 | */ 20 | onLoad: function (options) { 21 | this.setData({ 22 | recom: goods.list 23 | }) 24 | }, 25 | 26 | /** 27 | * 生命周期函数--监听页面初次渲染完成 28 | */ 29 | onReady: function () { 30 | 31 | }, 32 | 33 | /** 34 | * 生命周期函数--监听页面显示 35 | */ 36 | onShow: function () { 37 | 38 | }, 39 | 40 | /** 41 | * 生命周期函数--监听页面隐藏 42 | */ 43 | onHide: function () { 44 | 45 | }, 46 | 47 | /** 48 | * 生命周期函数--监听页面卸载 49 | */ 50 | onUnload: function () { 51 | 52 | }, 53 | 54 | onPageScroll: function(e) { 55 | const alpha = e.scrollTop/100 56 | this.setData({ 57 | alpha: alpha 58 | }) 59 | }, 60 | 61 | /** 62 | * 页面相关事件处理函数--监听用户下拉动作 63 | */ 64 | onPullDownRefresh: function () { 65 | 66 | }, 67 | 68 | /** 69 | * 页面上拉触底事件的处理函数 70 | */ 71 | onReachBottom: function () { 72 | 73 | }, 74 | 75 | /** 76 | * 用户点击右上角分享 77 | */ 78 | onShareAppMessage: function () { 79 | 80 | } 81 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/mem/mem.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/mem/mem.wxml: -------------------------------------------------------------------------------- 1 | 2 | Hi~，木子菇凉 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 19 | 20 | 每日签到 21 | 22 | 23 | 24 | 25 | 26 | 27 | 全部订单 28 | 29 | 30 | 31 | 32 | 33 | 待付款 34 | 35 | 36 | 37 | 待发货 38 | 39 | 40 | 41 | 待收货 42 | 43 | 44 | 45 | 已完成 46 | 47 | 48 | 49 | 售后 50 | 51 | 52 | 53 | 54 | 55 | 56 | 4 57 | 卡券 58 | 59 | 60 | 0 61 | 积分 62 | 63 | 64 | 0.00 65 | 余额 66 | 67 | 68 | 69 | 70 | 71 | 72 | 我的资产 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 值得买 90 | 91 | 92 | 93 | 我的收藏 94 | 95 | 96 | 97 | 商务合作 98 | 99 | 100 | 101 | 消息 102 | 103 | 104 | 105 | 106 | 107 | 108 | 为 109 | / 110 | 您 111 | / 112 | 推 113 | / 114 | 荐 115 | 116 | RECOMMENDED FRO YOU 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | {{item.title}} 126 | {{item.buyNum}} 人付款 127 | 128 | 129 | ¥ 130 | {{item.price}} 131 | 132 | ¥{{item.market}} 133 | 134 | 135 | 136 | 137 | 138 | 139 | 140 | -------------------------------------------------------------------------------- /小程序 商城/pages/mem/mem.wxss: -------------------------------------------------------------------------------- 1 | .head { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | width: 100%; 6 | display: flex; 7 | align-items: center; 8 | padding-left: 30rpx; 9 | background-color: rgba(255, 255, 255, .97); 10 | z-index: 99999; 11 | } 12 | 13 | .user { 14 | position: relative; 15 | display: flex; 16 | align-items: center; 17 | justify-content: space-between; 18 | padding: 60rpx 20rpx 50rpx; 19 | background-position: center bottom; 20 | background-size: cover; 21 | background-repeat: no-repeat; 22 | background: linear-gradient(to bottom, rgba(255, 134, 124, 1), rgba(255, 134, 124, 1) 50%, rgba(255, 108, 130, 1)) 23 | } 24 | 25 | .user-box { 26 | display: flex; 27 | align-items: center; 28 | } 29 | 30 | .user-avatar { 31 | width: 120rpx; 32 | height: 120rpx; 33 | overflow: hidden; 34 | margin-right: 30rpx; 35 | } 36 | 37 | .user-info { 38 | flex: 1; 39 | display: flex; 40 | flex-direction: column; 41 | height: 120rpx; 42 | } 43 | 44 | .user-name { 45 | color: #fafafa; 46 | font-size: var(--biger); 47 | margin-bottom: 15rpx; 48 | } 49 | 50 | .user-level { 51 | display: flex; 52 | width: 190rpx; 53 | height: 42rpx; 54 | align-items: center; 55 | background-color: rgba(255, 237, 137, .8); 56 | } 57 | 58 | .user-level-dot { 59 | width: 42rpx; 60 | height: 42rpx; 61 | line-height: 42rpx; 62 | text-align: center; 63 | margin-right: 20rpx; 64 | background-color: rgba(255, 207, 37, .6); 65 | } 66 | 67 | .user-level-name { 68 | font-size: var(--mini); 69 | display: inline-block; 70 | opacity: .8; 71 | text-shadow: 1rpx 2rpx 3rpx rgba(10, 70, 120, .1); 72 | } 73 | 74 | .user-sign { 75 | display: flex; 76 | align-items: center; 77 | justify-content: center; 78 | height: 46rpx; 79 | color: #aaa; 80 | padding: 0 20rpx; 81 | background-color: rgba(239, 228, 208, .97); 82 | } 83 | 84 | .con { 85 | background-position: center bottom; 86 | background-size: cover; 87 | background-repeat: no-repeat; 88 | background-image: linear-gradient(#f8f9fb, #f5f6f7); 89 | padding-top: 20rpx; 90 | } 91 | 92 | .box { 93 | display: flex; 94 | flex-direction: column; 95 | justify-content: space-between; 96 | margin: 0 20rpx 20rpx; 97 | background-color: #fff; 98 | } 99 | 100 | .box-all { 101 | display: flex; 102 | align-items: center; 103 | justify-content: space-between; 104 | padding: 30rpx 35rpx; 105 | font-size: var(--big); 106 | font-weight: bold; 107 | border-bottom: 1rpx solid #f8f9fb; 108 | } 109 | 110 | .box-list { 111 | display: flex; 112 | flex-wrap: wrap; 113 | padding: 30rpx 0; 114 | } 115 | 116 | .box-item { 117 | flex: 1; 118 | display: flex; 119 | flex-direction: column; 120 | align-items: center; 121 | justify-content: center; 122 | } 123 | 124 | .box-warp { 125 | flex: initial; 126 | width: 25%; 127 | margin: 20rpx 0; 128 | } 129 | 130 | .box-item image { 131 | width: 56rpx; 132 | height: 56rpx; 133 | margin-bottom: 15rpx; 134 | } 135 | 136 | .box-warp image { 137 | width: 68rpx; 138 | height: 68rpx; 139 | } 140 | 141 | .money { 142 | display: flex; 143 | justify-content: space-between; 144 | padding: 20rpx 10rpx 25rpx 0; 145 | margin: 0 20rpx 20rpx; 146 | background-color: #fff; 147 | } 148 | 149 | .money-item { 150 | flex: 1; 151 | display: flex; 152 | align-items: center; 153 | justify-content: center; 154 | flex-direction: column; 155 | } 156 | 157 | .money-nums { 158 | height: 70rpx; 159 | line-height: 70rpx; 160 | color: #ff586d; 161 | font-size: var(--bigers); 162 | font-family: din; 163 | } 164 | 165 | .money-line { 166 | position: relative; 167 | flex-shrink: 0; 168 | width: 1rpx; 169 | background-color: #f2f2f2 170 | } 171 | 172 | .money-line image { 173 | position: absolute; 174 | left: 0; 175 | top: 50%; 176 | max-width: 12rpx; 177 | width: 12rpx; 178 | height: 17rpx; 179 | transform: translate(0, -50%); 180 | z-index: 10; 181 | } 182 | 183 | .adver { 184 | min-height: 180rpx; 185 | height: 180rpx; 186 | overflow: hidden; 187 | margin: 0 20rpx 20rpx; 188 | } 189 | 190 | .grid { 191 | display: flex; 192 | flex-direction: column; 193 | background-color: #fff; 194 | margin: 0 20rpx 20rpx; 195 | } 196 | 197 | .tit { 198 | display: flex; 199 | flex-direction: column; 200 | align-items: center; 201 | justify-content: center; 202 | margin: 50rpx 0 30rpx; 203 | } 204 | 205 | .tit-name { 206 | letter-spacing: 10rpx; 207 | font-weight: bold; 208 | } 209 | 210 | .tit-line { 211 | font-weight: lighter; 212 | margin: 0 5rpx; 213 | } 214 | 215 | .tit-tip { 216 | margin-top: 10rpx; 217 | font-size: var(--minier); 218 | } 219 | 220 | 221 | .hot { 222 | display: flex; 223 | flex-wrap: wrap; 224 | justify-content: space-between; 225 | margin: 0 20rpx; 226 | } 227 | 228 | .hot-box { 229 | width: 48.5%; 230 | padding-bottom: 20rpx; 231 | margin-bottom: 20rpx; 232 | overflow: hidden; 233 | background-color: rgba(255, 255, 255, .98); 234 | } 235 | 236 | .hot-box-img { 237 | height: 350rpx; 238 | overflow: hidden; 239 | } 240 | 241 | .hot-box-img image { 242 | max-height: 100%; 243 | } 244 | 245 | .hot-pd { 246 | padding: 0 20rpx; 247 | } 248 | 249 | 250 | .kill-good-name { 251 | font-weight: bold; 252 | white-space: nowrap; 253 | text-overflow: ellipsis; 254 | overflow: hidden; 255 | margin-top: 10rpx; 256 | } 257 | 258 | .kill-good-soal { 259 | font-size: var(--minier); 260 | } 261 | 262 | .kill-good-price { 263 | display: flex; 264 | margin-top: 13rpx; 265 | } 266 | 267 | .kill-good-now { 268 | color: #f78c2d; 269 | } 270 | 271 | .kill-good-symbol { 272 | font-weight: bold; 273 | font-size: var(--minier); 274 | } 275 | 276 | .kill-good-money { 277 | font-size: var(--biger); 278 | font-family: 'din'; 279 | font-weight: bold; 280 | } 281 | 282 | .kill-good-old { 283 | margin: 13rpx 0 0 5rpx; 284 | font-family: 'din'; 285 | font-size: var(--mini); 286 | text-decoration: line-through; 287 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/agent/agent.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | StatusBar: app.local.StatusBar, 11 | CustomBar: app.local.CustomBar, 12 | alpha: 0 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | 20 | }, 21 | 22 | /** 23 | * 生命周期函数--监听页面初次渲染完成 24 | */ 25 | onReady: function () { 26 | 27 | }, 28 | 29 | /** 30 | * 生命周期函数--监听页面显示 31 | */ 32 | onShow: function () { 33 | 34 | }, 35 | 36 | onPageScroll: function(e) { 37 | const alpha = e.scrollTop/100 38 | this.setData({ 39 | alpha: alpha 40 | }) 41 | }, 42 | 43 | goBack: function() { 44 | wx.navigateBack({ 45 | delta: 1 46 | }) 47 | }, 48 | 49 | /** 50 | * 生命周期函数--监听页面隐藏 51 | */ 52 | onHide: function () { 53 | 54 | }, 55 | 56 | /** 57 | * 生命周期函数--监听页面卸载 58 | */ 59 | onUnload: function () { 60 | 61 | }, 62 | 63 | /** 64 | * 页面相关事件处理函数--监听用户下拉动作 65 | */ 66 | onPullDownRefresh: function () { 67 | 68 | }, 69 | 70 | /** 71 | * 页面上拉触底事件的处理函数 72 | */ 73 | onReachBottom: function () { 74 | 75 | }, 76 | 77 | /** 78 | * 用户点击右上角分享 79 | */ 80 | onShareAppMessage: function () { 81 | 82 | } 83 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/agent/agent.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/agent/agent.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 邀请有礼 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/agent/agent.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #f2ecde; 3 | } 4 | 5 | .rela { 6 | position: relative; 7 | } 8 | 9 | .head { 10 | position: fixed; 11 | top: 0; 12 | left: 0; 13 | width: 100%; 14 | display: flex; 15 | align-items: center; 16 | padding: 0 100rpx 0 20rpx; 17 | background-color: rgba(255, 255, 255, 0); 18 | } 19 | 20 | .head-back { 21 | width: 80rpx; 22 | } 23 | 24 | .head-tit { 25 | flex: 1; 26 | text-align: center; 27 | } 28 | 29 | .poster { 30 | display: flex; 31 | justify-content: center; 32 | margin-bottom: 30rpx; 33 | } 34 | 35 | .box { 36 | display: flex; 37 | margin: 30rpx 20rpx; 38 | padding: 30rpx; 39 | background-color: #3c373e; 40 | } 41 | 42 | .white { 43 | background-color: #fff; 44 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/busi/busi.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/busi/busi.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/busi/busi.wxml: -------------------------------------------------------------------------------- 1 |
2 | 商务合作 3 |
4 | 5 | 6 | 商务合作文章详情 7 | 8 | 9 | 10 | 14 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/busi/busi.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #fff; 3 | padding-bottom: 89rpx; 4 | } 5 | 6 | .foot { 7 | position: fixed; 8 | bottom: 0; 9 | left: 0; 10 | height: 89rpx; 11 | width: 100%; 12 | z-index: 999; 13 | display: flex; 14 | align-items: center; 15 | justify-content: space-between; 16 | padding: 10rpx 20rpx; 17 | overflow: hidden; 18 | background-color: rgba(170, 170, 170, .1); 19 | } 20 | 21 | .foot-btn { 22 | flex: 1; 23 | font-size: var(--mini); 24 | font-weight: normal; 25 | background-color: transparent; 26 | } 27 | 28 | .foot-btn text { 29 | font-size: var(--biger); 30 | } 31 | 32 | .foot-btn.line { 33 | border-right: 1rpx solid #eee; 34 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/coup/coup.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/coup/coup.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/coup/coup.wxml: -------------------------------------------------------------------------------- 1 |
2 | 卡券 3 |
4 | 5 | 6 | 7 | ¥ 8 | 20 9 | 10 | 11 | 12 | 全场100元通用券 13 | 优惠券全场可用 14 | 15 | 有效期：2019.11.10 - 2020-01-01 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | ¥ 24 | 20 25 | 26 | 27 | 28 | 全场100元通用券 29 | 优惠券全场可用 30 | 31 | 有效期：2019.11.10 - 2020-01-01 32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/coup/coup.wxss: -------------------------------------------------------------------------------- 1 | .coup { 2 | position: relative; 3 | height: 200rpx; 4 | margin: 15rpx 20rpx; 5 | display: flex; 6 | overflow: hidden; 7 | } 8 | 9 | .coup-left { 10 | flex-shrink: 0; 11 | width: 200rpx; 12 | display: flex; 13 | align-items: center; 14 | justify-content: center; 15 | border-right: 1rpx dashed #ddd; 16 | } 17 | 18 | .coup-mtit { 19 | font-size: 32rpx; 20 | line-height: 72rpx; 21 | margin: 17rpx 10rpx 0 0; 22 | } 23 | 24 | .coup-mnum { 25 | font-size: 62rpx; 26 | line-height: 76rpx; 27 | font-weight: bold; 28 | font-family: din; 29 | } 30 | 31 | .coup-right { 32 | flex: 1; 33 | display: flex; 34 | flex-direction: column; 35 | justify-content: space-between; 36 | padding: 20rpx 30rpx; 37 | } 38 | 39 | .coup-itit { 40 | font-weight: bold; 41 | margin-bottom: 15rpx; 42 | } 43 | 44 | .cir { 45 | position: absolute; 46 | left: 185rpx; 47 | width: 30rpx; 48 | height: 30rpx; 49 | background-color: #f7f8f8; 50 | border-radius: 50%; 51 | } 52 | 53 | .cir-top { 54 | top: -15rpx; 55 | } 56 | 57 | .cir-bot { 58 | bottom: -15rpx; 59 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/credit/credit.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/credit/credit.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/credit/credit.wxml: -------------------------------------------------------------------------------- 1 |
2 | 积分抢兑 3 |
4 | 5 | 6 | 7 | 8 | 可用积分 9 | 171 10 | 小积分 换好礼 会员专享 定期更新 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 柠檬小龙虾沙拉 22 | 23 | 88 24 | 积分 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 柠檬小龙虾沙拉 33 | 34 | 88 35 | 积分 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 柠檬小龙虾沙拉 44 | 45 | 88 46 | 积分 47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/credit/credit.wxss: -------------------------------------------------------------------------------- 1 | .tips { 2 | display: flex; 3 | align-items: center; 4 | justify-content: center; 5 | padding: 50rpx 0; 6 | background: linear-gradient(to bottom, rgba(168, 168, 168, 1), rgba(168, 168, 168, 1) 50%, rgba(195, 195, 195, 1)) 7 | } 8 | 9 | .tips-box { 10 | display: flex; 11 | background-color: #fff; 12 | margin: 0 100rpx; 13 | padding: 10rpx; 14 | } 15 | 16 | .tips-con { 17 | display: flex; 18 | align-items: center; 19 | flex-direction: column; 20 | padding: 20rpx 30rpx; 21 | border: 1rpx solid #f5f6f7; 22 | } 23 | 24 | .tips-cre { 25 | color: #b3a078; 26 | font-size: var(--biger); 27 | font-weight: bold; 28 | font-family: din; 29 | margin: 15rpx 0; 30 | } 31 | 32 | .tips-tip { 33 | font-size: var(--mini); 34 | } 35 | 36 | 37 | .list { 38 | display: flex; 39 | flex-wrap: wrap; 40 | justify-content: space-between; 41 | margin: 20rpx; 42 | } 43 | 44 | .list-box { 45 | width: 48.5%; 46 | padding-bottom: 20rpx; 47 | margin-bottom: 20rpx; 48 | overflow: hidden; 49 | background-color: rgba(255, 255, 255, .98); 50 | } 51 | 52 | .list-box-img { 53 | height: 350rpx; 54 | overflow: hidden; 55 | } 56 | 57 | .list-box-img image { 58 | max-height: 100%; 59 | } 60 | 61 | .list-pd { 62 | padding: 0 20rpx; 63 | } 64 | 65 | .list-name { 66 | white-space: nowrap; 67 | text-overflow: ellipsis; 68 | overflow: hidden; 69 | margin: 10rpx 0 15rpx; 70 | } 71 | 72 | .list-price { 73 | font-family: din; 74 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/favo/favo.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/favo/favo.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/favo/favo.wxml: -------------------------------------------------------------------------------- 1 |
2 | 我的收藏 3 |
4 | 5 | 6 | 7 | 8 | 9 | 10 | 冬季新款女士连衣裙 11 | 12 | 13 | ¥ 14 | 10.00 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 冬季新款女士连衣裙 27 | 28 | 29 | ¥ 30 | 10.00 31 | 32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/favo/favo.wxss: -------------------------------------------------------------------------------- 1 | .favo { 2 | width: 100%; 3 | flex: 1; 4 | display: flex; 5 | margin-top: 1rpx; 6 | padding: 20rpx 30rpx; 7 | background-color: #fff; 8 | } 9 | 10 | .favo-img { 11 | flex-shrink: 0; 12 | width: 160rpx; 13 | height: 160rpx; 14 | margin-right: 20rpx; 15 | overflow: hidden; 16 | } 17 | 18 | .favo-img image { 19 | max-height: 100%; 20 | } 21 | 22 | .favo-txt { 23 | flex: 1; 24 | display: flex; 25 | flex-direction: column; 26 | justify-content: space-between; 27 | } 28 | 29 | .favo-tit { 30 | flex: 1; 31 | font-size: var(--big); 32 | white-space: nowrap; 33 | text-overflow: ellipsis; 34 | overflow: hidden; 35 | } 36 | 37 | .favo-price { 38 | font-family: din; 39 | font-size: var(--big); 40 | font-weight: bold; 41 | } 42 | 43 | .favo-bot { 44 | display: flex; 45 | align-items: center; 46 | justify-content: space-between; 47 | } 48 | 49 | .favo-del { 50 | font-size: var(--big); 51 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/integral/integral.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/integral/integral.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/integral/integral.wxml: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/pages/member/integral/integral.wxml -------------------------------------------------------------------------------- /小程序 商城/pages/member/integral/integral.wxss: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/pages/member/integral/integral.wxss -------------------------------------------------------------------------------- /小程序 商城/pages/member/message/message.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/message/message.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/message/message.wxml: -------------------------------------------------------------------------------- 1 |
2 | 通知公告 3 |
4 | 5 | 6 | 签到积分 7 | 05月28日 8 | 今日签到成功 9 | 10 | 11 | 瓜分积分： 12 | 100 13 | 14 | 15 | 参与人数： 16 | 1000 17 | 18 | 19 | 签到时间： 20 | 10:12 21 | 22 | 23 | 24 | 查看详情 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 吃得太多会长胖 34 | 吃得再多也不长胖的方法 35 | 36 | 查看详情 37 | 38 | 39 | 40 | 41 | 42 | 支付成功通知 43 | 05月28日 44 | 45 | 支付金额 46 | 47 | ¥ 48 | 10.00 49 | 50 | 51 | 52 | 53 | 交易商户： 54 | 轻知科技 55 | 56 | 57 | 支付金额： 58 | ¥10.00 59 | 60 | 61 | 支付方式： 62 | 余额支付 63 | 64 | 65 | 交易时间： 66 | 2020-05-28 12:12 67 | 68 | 69 | 70 | 查看详情 71 | 72 | 73 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/message/message.wxss: -------------------------------------------------------------------------------- 1 | .box { 2 | display: flex; 3 | flex-direction: column; 4 | padding: 30rpx; 5 | margin: 20rpx 20rpx 10rpx; 6 | background-color: #fff; 7 | } 8 | 9 | .box-tit { 10 | font-size: var(--biger); 11 | font-weight: bold; 12 | margin-bottom: 10rpx; 13 | } 14 | 15 | .box-time { 16 | font-size: var(--mini); 17 | } 18 | 19 | .box-msg { 20 | display: flex; 21 | flex-direction: column; 22 | margin: 20rpx 0; 23 | padding: 10rpx 0 30rpx; 24 | border-bottom: 1rpx solid #f5f6f7; 25 | } 26 | 27 | .jc { 28 | align-items: center; 29 | justify-content: center; 30 | } 31 | 32 | .box-price { 33 | margin-top: 10rpx; 34 | font-size: var(--biger); 35 | } 36 | 37 | .box-money { 38 | font-size: var(--bigers); 39 | font-family: din; 40 | font-weight: bold; 41 | } 42 | 43 | .box-li { 44 | margin: 10rpx 0; 45 | } 46 | 47 | .box-scan { 48 | display: flex; 49 | align-items: center; 50 | justify-content: space-between; 51 | padding-top: 25rpx; 52 | margin-top: 20rpx; 53 | border-top: 1rpx solid #f5f6f7; 54 | } 55 | 56 | .box-img { 57 | width: 100%; 58 | max-height: 320rpx; 59 | overflow: hidden; 60 | } 61 | 62 | .box-img image { 63 | width: 100%; 64 | } 65 | 66 | .box-name { 67 | font-size: var(--big); 68 | font-weight: bold; 69 | margin: 20rpx 0; 70 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/money/money.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | StatusBar: app.local.StatusBar, 11 | CustomBar: app.local.CustomBar, 12 | alpha: 0 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | 20 | }, 21 | 22 | /** 23 | * 生命周期函数--监听页面初次渲染完成 24 | */ 25 | onReady: function () { 26 | 27 | }, 28 | 29 | /** 30 | * 生命周期函数--监听页面显示 31 | */ 32 | onShow: function () { 33 | 34 | }, 35 | 36 | onPageScroll: function(e) { 37 | const alpha = e.scrollTop/100 38 | this.setData({ 39 | alpha: alpha 40 | }) 41 | }, 42 | 43 | goBack: function() { 44 | wx.navigateBack({ 45 | delta: 1 46 | }) 47 | }, 48 | 49 | /** 50 | * 生命周期函数--监听页面隐藏 51 | */ 52 | onHide: function () { 53 | 54 | }, 55 | 56 | /** 57 | * 生命周期函数--监听页面卸载 58 | */ 59 | onUnload: function () { 60 | 61 | }, 62 | 63 | /** 64 | * 页面相关事件处理函数--监听用户下拉动作 65 | */ 66 | onPullDownRefresh: function () { 67 | 68 | }, 69 | 70 | /** 71 | * 页面上拉触底事件的处理函数 72 | */ 73 | onReachBottom: function () { 74 | 75 | }, 76 | 77 | /** 78 | * 用户点击右上角分享 79 | */ 80 | onShareAppMessage: function () { 81 | 82 | } 83 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/money/money.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/money/money.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 我的钱包 6 | 7 | 8 | 9 | 10 | 总金额(元) 11 | 100.00 12 | 13 | 14 | 15 | 可用金额(元) 16 | 40.00 17 | 18 | 19 | 消费金额(元) 20 | 20.00 21 | 22 | 23 | 24 | 25 | 提现 26 | 充值 27 | 28 | 29 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/money/money.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #fff; 3 | } 4 | 5 | .head { 6 | position: fixed; 7 | top: 0; 8 | left: 0; 9 | width: 100%; 10 | display: flex; 11 | align-items: center; 12 | padding: 0 100rpx 0 20rpx; 13 | background-color: rgba(255, 255, 255, 0); 14 | } 15 | 16 | .head-back { 17 | width: 80rpx; 18 | } 19 | 20 | .head-tit { 21 | flex: 1; 22 | text-align: center; 23 | } 24 | 25 | .money { 26 | display: flex; 27 | background: linear-gradient(to bottom, rgba(255, 88, 109, 1), rgba(255, 255, 255, 1)) 28 | } 29 | 30 | .box { 31 | width: 94%; 32 | padding: 100rpx 30rpx 50rpx; 33 | margin: 30rpx auto 20rpx 3%; 34 | border-radius: 8rpx; 35 | background-color: #fff; 36 | } 37 | 38 | .box-tit { 39 | text-align: center; 40 | } 41 | 42 | .box-total { 43 | text-align: center; 44 | font-size: 48rpx; 45 | font-family: din; 46 | font-weight: bold; 47 | margin: 30rpx 20rpx; 48 | } 49 | 50 | .box-other { 51 | display: flex; 52 | justify-content: space-around; 53 | margin: 120rpx auto 100rpx; 54 | } 55 | 56 | .box-half { 57 | text-align: center; 58 | } 59 | 60 | .box-mon { 61 | font-size: 36rpx; 62 | font-family: din; 63 | margin-top: 15rpx; 64 | } 65 | 66 | .box-dos { 67 | display: flex; 68 | justify-content: space-between; 69 | } 70 | 71 | .box-dos view { 72 | width: 45%; 73 | height: 80rpx; 74 | line-height: 80rpx; 75 | text-align: center; 76 | background-color: #fef5ee; 77 | border-radius: 6rpx; 78 | } 79 | 80 | .box-dos view.act { 81 | color: #fff; 82 | background-color: #ed6666; 83 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/morder/morder.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | Page({ 4 | 5 | data: { 6 | CustomBar: app.local.CustomBar 7 | }, 8 | 9 | onLoad: function() { 10 | 11 | } 12 | 13 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/morder/morder.json: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /小程序 商城/pages/member/morder/morder.wxml: -------------------------------------------------------------------------------- 1 |
2 | 订单 3 |
4 | 5 | 6 | 7 | 全部 8 | 9 | 10 | 11 | 待付款 12 | 13 | 14 | 15 | 待发货 16 | 17 | 18 | 19 | 待收货 20 | 21 | 22 | 23 | 已完成 24 | 25 | 26 | 27 | 28 | 29 | 30 | 订单号：3232322323 31 | 待付款 32 | 33 | 34 | 35 | 36 | 37 | 夏季新款女士长裙 38 | 黑色、均码 39 | 40 | 41 | 42 | ¥ 43 | 12.00 44 | 45 | 1 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 夏季新款女士长裙 54 | 黑色、均码 55 | 56 | 57 | 58 | ¥ 59 | 12.00 60 | 61 | 1 62 | 63 | 64 | 65 | 66 | 67 | 共 2 件商品 合计： 68 | ¥ 69 | 12.00 70 | 71 | 72 | 73 | 查看物流 74 | 订单详情 75 | 76 | 77 | 78 | 79 | 80 | 订单号：3232322323 81 | 待付款 82 | 83 | 84 | 85 | 86 | 87 | 夏季新款女士长裙 88 | 黑色、均码 89 | 90 | 91 | 92 | ¥ 93 | 12.00 94 | 95 | 1 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 夏季新款女士长裙 104 | 黑色、均码 105 | 106 | 107 | 108 | ¥ 109 | 12.00 110 | 111 | 1 112 | 113 | 114 | 115 | 116 | 117 | 共 2 件商品 合计： 118 | ¥ 119 | 12.00 120 | 121 | 122 | 123 | 查看物流 124 | 订单详情 125 | 126 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/morder/morder.wxss: -------------------------------------------------------------------------------- 1 | .tab { 2 | position: fixed; 3 | top: 0; 4 | left: 0; 5 | right: 0; 6 | display: flex; 7 | height: 43px; 8 | align-items: center; 9 | justify-content: space-between; 10 | padding: 0 30rpx; 11 | background-color: #fff; 12 | border-top: 1rpx solid #f5f6f7; 13 | z-index: 999; 14 | } 15 | 16 | .tab-item { 17 | height: 43px; 18 | display: flex; 19 | flex-direction: column; 20 | align-items: center; 21 | justify-content: space-between; 22 | padding-top: 10px; 23 | color: #aaa; 24 | } 25 | 26 | .tab-item view { 27 | width: 30rpx; 28 | height: 3rpx; 29 | background-color: #fff; 30 | } 31 | 32 | .tab-item.act { 33 | color: #373737; 34 | } 35 | 36 | .tab-item.act view { 37 | background-color: #ff586d; 38 | } 39 | 40 | .box { 41 | display: flex; 42 | flex-direction: column; 43 | padding: 20rpx; 44 | margin: 0 20rpx 20rpx; 45 | background-color: #fff; 46 | } 47 | 48 | .box.first { 49 | margin-top: 55px; 50 | } 51 | 52 | .box-top { 53 | flex: 1; 54 | display: flex; 55 | justify-content: space-between; 56 | margin-bottom: 30rpx; 57 | } 58 | 59 | .box-good { 60 | flex: 1; 61 | display: flex; 62 | margin-bottom: 20rpx; 63 | } 64 | 65 | .box-good-img { 66 | width: 160rpx; 67 | height: 160rpx; 68 | margin-right: 20rpx; 69 | } 70 | 71 | .box-good-info { 72 | flex: 1; 73 | display: flex; 74 | flex-direction: column; 75 | justify-content: space-between; 76 | } 77 | 78 | .box-good-attr { 79 | margin-top: 15rpx; 80 | font-size: var(--mini); 81 | } 82 | 83 | .box-good-bot { 84 | display: flex; 85 | justify-content: space-between; 86 | } 87 | 88 | .box-good-price { 89 | font-size: var(--big); 90 | font-family: din; 91 | } 92 | 93 | .box-total { 94 | display: flex; 95 | align-items: center; 96 | justify-content: flex-end; 97 | padding: 15rpx 0; 98 | } 99 | 100 | .box-dos { 101 | display: flex; 102 | justify-content: flex-end; 103 | margin: 20rpx 0 10rpx; 104 | } 105 | 106 | .box-dos view, 107 | .box-dos navigator { 108 | margin-left: 20rpx; 109 | width: 220rpx; 110 | height: 70rpx; 111 | line-height: 70rpx; 112 | text-align: center; 113 | border: 1rpx solid #eee; 114 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/morderinfo/morderinfo.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/morderinfo/morderinfo.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/morderinfo/morderinfo.wxml: -------------------------------------------------------------------------------- 1 |
2 | 订单详情 3 |
4 | 5 | 6 | 7 | 8 | 小一 9 | 18288888888 10 | 11 | 湖南省长沙市开福区德雅路口 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 冬季新款女士连衣裙 21 | 黑色、均码 22 | 23 | 24 | 25 | ¥ 26 | 12.00 27 | 28 | 1 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 冬季新款女士连衣裙 38 | 黑色、均码 39 | 40 | 41 | 42 | ¥ 43 | 12.00 44 | 45 | 1 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 优惠券 56 | 57 | 每满150减18 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 商品总价 68 | 69 | ¥ 70 | 24.00 71 | 72 | 73 | 74 | 运费 75 | 76 | ¥ 77 | 0.00 78 | 79 | 80 | 81 | 优惠金额 82 | 83 | ¥ 84 | 1.00 85 | 86 | 87 | 88 | 获得积分 89 | 90 | + 91 | 0 92 | 93 | 94 | 95 | 96 | 97 | 共计1件商品 合计： 98 | 99 | ¥ 100 | 0.00 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 实付： 109 | ¥ 110 | 24.00 111 | 112 | 113 | 取消订单 114 | 确认收货 115 | 116 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/morderinfo/morderinfo.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | padding-bottom: 90rpx; 3 | } 4 | 5 | .address { 6 | display: flex; 7 | align-items: center; 8 | justify-content: space-between; 9 | background-color: #fff; 10 | margin: 1rpx 0 15rpx; 11 | padding: 20rpx 25rpx; 12 | } 13 | 14 | .address-info { 15 | flex: 1; 16 | display: flex; 17 | flex-direction: column; 18 | justify-content: space-between; 19 | margin-right: 20rpx; 20 | } 21 | 22 | .address-top { 23 | flex: 1; 24 | display: flex; 25 | justify-content: space-between; 26 | } 27 | 28 | .address-con { 29 | margin-top: 25rpx; 30 | } 31 | 32 | .good { 33 | display: flex; 34 | background-color: #fff; 35 | margin-bottom: 1rpx; 36 | padding: 20rpx 25rpx; 37 | } 38 | 39 | .good-img { 40 | width: 180rpx; 41 | height: 180rpx; 42 | margin-right: 20rpx; 43 | } 44 | 45 | .good-info { 46 | flex: 1; 47 | display: flex; 48 | flex-direction: column; 49 | justify-content: space-between; 50 | } 51 | 52 | .good-name { 53 | flex: 1; 54 | font-size: var(--big); 55 | margin-bottom: 10rpx; 56 | } 57 | 58 | .good-attr { 59 | font-size: var(--mini); 60 | } 61 | 62 | .good-bot { 63 | display: flex; 64 | align-items: center; 65 | justify-content: space-between; 66 | } 67 | 68 | .good-price { 69 | font-size: var(--biger); 70 | font-family: din; 71 | } 72 | 73 | .good-remark { 74 | width: 100%; 75 | height: 90rpx; 76 | background-color: #fff; 77 | padding: 0 25rpx; 78 | margin-bottom: 15rpx; 79 | } 80 | 81 | .info { 82 | display: flex; 83 | flex-direction: column; 84 | background-color: #fff; 85 | padding: 10rpx 25rpx; 86 | margin-bottom: 15rpx; 87 | } 88 | 89 | .info-li { 90 | display: flex; 91 | align-items: center; 92 | justify-content: space-between; 93 | padding: 15rpx 0; 94 | } 95 | 96 | .info-price { 97 | font-size: var(--biger); 98 | font-family: din; 99 | } 100 | 101 | .info-total { 102 | display: flex; 103 | } 104 | 105 | .info-symbol { 106 | display: inline-block; 107 | vertical-align: middle; 108 | margin-top: -9rpx; 109 | } 110 | 111 | .info-attr { 112 | display: flex; 113 | align-items: center; 114 | justify-content: space-between; 115 | padding: 27rpx 0; 116 | border-bottom: 1rpx solid #f7f8f9; 117 | } 118 | 119 | .info-attr:last-child { 120 | border-bottom: 0; 121 | } 122 | 123 | .info-attr-info { 124 | display: flex; 125 | align-items: center; 126 | } 127 | 128 | .info-attr-name { 129 | margin-right: 10rpx; 130 | } 131 | 132 | .info-tick { 133 | color: #ff586d; 134 | margin-right: 15rpx; 135 | } 136 | 137 | .pay-tit { 138 | padding: 20rpx 0; 139 | display: flex; 140 | align-items: center; 141 | justify-content: space-between; 142 | border-bottom: 1rpx solid #f7f8f9; 143 | } 144 | 145 | .pay-type { 146 | display: flex; 147 | justify-content: space-between; 148 | background-color: #fff; 149 | padding: 30rpx 0; 150 | margin-bottom: 1rpx; 151 | } 152 | 153 | .pay-wx { 154 | color: #09bb07; 155 | font-size: var(--biger); 156 | vertical-align: middle; 157 | display: inline-block; 158 | margin: -5rpx 5rpx 0 0; 159 | } 160 | 161 | .pay-ye { 162 | color: #ffbd27; 163 | font-size: var(--biger); 164 | vertical-align: middle; 165 | display: inline-block; 166 | margin: -5rpx 5rpx 0 0; 167 | } 168 | 169 | radio { 170 | transform: scale(.8); 171 | margin: -3rpx 0 0 5rpx; 172 | vertical-align: middle; 173 | } 174 | 175 | .footer { 176 | position: fixed; 177 | bottom: 0; 178 | left: 0; 179 | width: 100%; 180 | height: 90rpx; 181 | display: flex; 182 | align-items: center; 183 | justify-content: space-between; 184 | padding-right: 25rpx; 185 | background-color: #fff 186 | } 187 | 188 | .footer-info { 189 | flex: 1; 190 | margin-left: 25rpx; 191 | } 192 | 193 | .footer-dos { 194 | display: flex; 195 | } 196 | 197 | .footer-buy { 198 | margin-left: 20rpx; 199 | width: 220rpx; 200 | height: 70rpx; 201 | line-height: 70rpx; 202 | text-align: center; 203 | border: 1rpx solid #eee; 204 | margin-left: 15rpx; 205 | } 206 | 207 | .bold { 208 | font-weight: bold; 209 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/notice/notice.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/notice/notice.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/notice/notice.wxml: -------------------------------------------------------------------------------- 1 |
2 | 消息 3 |
4 | 5 | 6 | 7 | 8 | 9 | 通知公告 10 | 昨天 11 | 12 | 平台系统消息、公告 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 账户通知 21 | 昨天 22 | 23 | 账户信息通知、订单消息 24 | 25 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/notice/notice.wxss: -------------------------------------------------------------------------------- 1 | .box { 2 | display: flex; 3 | align-items: center; 4 | background-color: #fff; 5 | padding: 30rpx; 6 | margin-top: 1rpx; 7 | } 8 | 9 | .box-img { 10 | width: 80rpx; 11 | height: 80rpx; 12 | margin-right: 30rpx; 13 | } 14 | 15 | .box-info { 16 | flex: 1; 17 | display: flex; 18 | flex-direction: column; 19 | justify-content: space-between; 20 | } 21 | 22 | .box-tit { 23 | display: flex; 24 | justify-content: space-between; 25 | font-size: var(--big); 26 | font-weight: bold; 27 | margin-bottom: 10rpx; 28 | } 29 | 30 | .box-mini { 31 | font-size: var(--mini); 32 | font-weight: normal; 33 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/recomer/recomer.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | StatusBar: app.local.StatusBar || 20, 11 | CustomBar: app.local.CustomBar || 64, 12 | alpha: 0 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | 20 | }, 21 | 22 | onPageScroll: function(e) { 23 | const alpha = e.scrollTop/100 24 | this.setData({ 25 | alpha: alpha 26 | }) 27 | }, 28 | 29 | goBack: function() { 30 | wx.navigateBack({ 31 | delta: 1 32 | }) 33 | }, 34 | 35 | /** 36 | * 生命周期函数--监听页面初次渲染完成 37 | */ 38 | onReady: function () { 39 | 40 | }, 41 | 42 | /** 43 | * 生命周期函数--监听页面显示 44 | */ 45 | onShow: function () { 46 | 47 | }, 48 | 49 | /** 50 | * 生命周期函数--监听页面隐藏 51 | */ 52 | onHide: function () { 53 | 54 | }, 55 | 56 | /** 57 | * 生命周期函数--监听页面卸载 58 | */ 59 | onUnload: function () { 60 | 61 | }, 62 | 63 | /** 64 | * 页面相关事件处理函数--监听用户下拉动作 65 | */ 66 | onPullDownRefresh: function () { 67 | 68 | }, 69 | 70 | /** 71 | * 页面上拉触底事件的处理函数 72 | */ 73 | onReachBottom: function () { 74 | 75 | }, 76 | 77 | /** 78 | * 用户点击右上角分享 79 | */ 80 | onShareAppMessage: function () { 81 | 82 | } 83 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/member/recomer/recomer.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/member/recomer/recomer.wxml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 值得买 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 总收入(元) 16 | 100.00 17 | 18 | 19 | 20 | 待入账(元) 21 | 40.00 22 | 23 | 24 | 冻结(元) 25 | 20.00 26 | 27 | 28 | 可用(元) 29 | 20.00 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 10 38 | 发布的 39 | 40 | 41 | 10 42 | 点击 43 | 44 | 45 | 10 46 | 分享 47 | 48 | 49 | 50 | 51 | 去发布 52 | 53 | -------------------------------------------------------------------------------- /小程序 商城/pages/member/recomer/recomer.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #f2ecde; 3 | } 4 | 5 | .rela { 6 | position: relative; 7 | } 8 | 9 | .head { 10 | position: fixed; 11 | top: 0; 12 | left: 0; 13 | width: 100%; 14 | display: flex; 15 | align-items: center; 16 | padding: 0 100rpx 0 20rpx; 17 | background-color: rgba(255, 255, 255, 0); 18 | } 19 | 20 | .head-back { 21 | width: 80rpx; 22 | } 23 | 24 | .head-tit { 25 | flex: 1; 26 | text-align: center; 27 | } 28 | 29 | .poster { 30 | display: flex; 31 | justify-content: center; 32 | margin-bottom: 20rpx; 33 | } 34 | 35 | .box { 36 | display: flex; 37 | margin: 20rpx; 38 | padding: 30rpx; 39 | background-color: #3c373e; 40 | } 41 | 42 | .bg-column { 43 | flex-direction: column; 44 | background-color: #fff; 45 | } 46 | 47 | .box-tit { 48 | margin-top: 30rpx; 49 | text-align: center; 50 | } 51 | 52 | .box-total { 53 | color: #c1a573; 54 | text-align: center; 55 | font-size: var(--bigers); 56 | font-family: din; 57 | font-weight: bold; 58 | margin: 10rpx 20rpx 30rpx; 59 | } 60 | 61 | .box-other { 62 | width: 100%; 63 | display: flex; 64 | justify-content: space-around; 65 | margin: 50rpx auto 30rpx; 66 | } 67 | 68 | .box-half { 69 | text-align: center; 70 | } 71 | 72 | .box-mon { 73 | font-size: var(--biger); 74 | font-family: din; 75 | margin-top: 15rpx; 76 | } 77 | 78 | .nav-item { 79 | flex: 1; 80 | display: flex; 81 | flex-direction: column; 82 | align-items: center; 83 | } 84 | 85 | .nav-item image { 86 | width: 50rpx; 87 | height: 50rpx; 88 | margin-bottom: 16rpx 89 | } 90 | 91 | .nav-item view.nums { 92 | color: #d5be96; 93 | font-size: var(--biger); 94 | height: 56rpx; 95 | line-height: 50rpx; 96 | margin-bottom: 10rpx 97 | } 98 | 99 | .nav-line { 100 | position: relative; 101 | flex-shrink: 0; 102 | width: 1rpx; 103 | border-right: 1rpx solid #333036; 104 | border-left: 1rpx solid #4c454e; 105 | } -------------------------------------------------------------------------------- /小程序 商城/pages/order/order.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | let that 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | 11 | }, 12 | 13 | /** 14 | * 生命周期函数--监听页面加载 15 | */ 16 | onLoad: function (options) { 17 | 18 | }, 19 | 20 | /** 21 | * 生命周期函数--监听页面初次渲染完成 22 | */ 23 | onReady: function () { 24 | 25 | }, 26 | 27 | /** 28 | * 生命周期函数--监听页面显示 29 | */ 30 | onShow: function () { 31 | 32 | }, 33 | 34 | /** 35 | * 生命周期函数--监听页面隐藏 36 | */ 37 | onHide: function () { 38 | 39 | }, 40 | 41 | /** 42 | * 生命周期函数--监听页面卸载 43 | */ 44 | onUnload: function () { 45 | 46 | }, 47 | 48 | /** 49 | * 页面相关事件处理函数--监听用户下拉动作 50 | */ 51 | onPullDownRefresh: function () { 52 | 53 | }, 54 | 55 | /** 56 | * 页面上拉触底事件的处理函数 57 | */ 58 | onReachBottom: function () { 59 | 60 | }, 61 | 62 | /** 63 | * 用户点击右上角分享 64 | */ 65 | onShareAppMessage: function () { 66 | 67 | } 68 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/order/order.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/order/order.wxml: -------------------------------------------------------------------------------- 1 |
2 | 确认订单 3 |
4 | 5 | 6 | 7 | 8 | 小一 9 | 18288888888 10 | 11 | 湖南省长沙市开福区德雅路口 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 冬季新款女士连衣裙 21 | 黑色、均码 22 | 23 | 24 | 25 | ¥ 26 | 12.00 27 | 28 | 1 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 冬季新款女士连衣裙 38 | 黑色、均码 39 | 40 | 41 | 42 | ¥ 43 | 12.00 44 | 45 | 1 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 优惠券 56 | 57 | 每满150减18 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 商品总价 68 | 69 | ¥ 70 | 24.00 71 | 72 | 73 | 74 | 运费 75 | 76 | ¥ 77 | 0.00 78 | 79 | 80 | 81 | 优惠金额 82 | 83 | ¥ 84 | 1.00 85 | 86 | 87 | 88 | 获得积分 89 | 90 | + 91 | 0 92 | 93 | 94 | 95 | 96 | 97 | 共计1件商品 合计： 98 | 99 | ¥ 100 | 0.00 101 | 102 | 103 | 104 | 105 | 106 | 107 | 支付方式 108 | 109 | 116 | 123 | 124 | 125 | 126 | 127 | 128 | 实付： 129 | ¥ 130 | 24.00 131 | 132 | 确认下单 133 | -------------------------------------------------------------------------------- /小程序 商城/pages/order/order.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | padding-bottom: 90rpx; 3 | } 4 | 5 | .address { 6 | display: flex; 7 | align-items: center; 8 | justify-content: space-between; 9 | background-color: #fff; 10 | margin: 1rpx 0 15rpx; 11 | padding: 20rpx 25rpx; 12 | } 13 | 14 | .address-info { 15 | flex: 1; 16 | display: flex; 17 | flex-direction: column; 18 | justify-content: space-between; 19 | margin-right: 20rpx; 20 | } 21 | 22 | .address-top { 23 | flex: 1; 24 | display: flex; 25 | justify-content: space-between; 26 | } 27 | 28 | .address-con { 29 | margin-top: 25rpx; 30 | } 31 | 32 | .good { 33 | display: flex; 34 | background-color: #fff; 35 | margin-bottom: 1rpx; 36 | padding: 20rpx 25rpx; 37 | } 38 | 39 | .good-img { 40 | width: 180rpx; 41 | height: 180rpx; 42 | margin-right: 20rpx; 43 | } 44 | 45 | .good-info { 46 | flex: 1; 47 | display: flex; 48 | flex-direction: column; 49 | justify-content: space-between; 50 | } 51 | 52 | .good-name { 53 | flex: 1; 54 | font-size: var(--big); 55 | margin-bottom: 10rpx; 56 | } 57 | 58 | .good-attr { 59 | font-size: var(--mini); 60 | } 61 | 62 | .good-bot { 63 | display: flex; 64 | align-items: center; 65 | justify-content: space-between; 66 | } 67 | 68 | .good-price { 69 | font-size: var(--biger); 70 | font-family: din; 71 | } 72 | 73 | .good-remark { 74 | width: 100%; 75 | height: 90rpx; 76 | background-color: #fff; 77 | padding: 0 25rpx; 78 | margin-bottom: 15rpx; 79 | } 80 | 81 | .info { 82 | display: flex; 83 | flex-direction: column; 84 | background-color: #fff; 85 | padding: 10rpx 25rpx; 86 | margin-bottom: 15rpx; 87 | } 88 | 89 | .info-li { 90 | display: flex; 91 | align-items: center; 92 | justify-content: space-between; 93 | padding: 15rpx 0; 94 | } 95 | 96 | .info-price { 97 | font-size: var(--biger); 98 | font-family: din; 99 | } 100 | 101 | .info-total { 102 | display: flex; 103 | } 104 | 105 | .info-symbol { 106 | display: inline-block; 107 | vertical-align: middle; 108 | margin-top: -9rpx; 109 | } 110 | 111 | .info-attr { 112 | display: flex; 113 | align-items: center; 114 | justify-content: space-between; 115 | padding: 27rpx 0; 116 | border-bottom: 1rpx solid #f7f8f9; 117 | } 118 | 119 | .info-attr:last-child { 120 | border-bottom: 0; 121 | } 122 | 123 | .info-attr-info { 124 | display: flex; 125 | align-items: center; 126 | } 127 | 128 | .info-attr-name { 129 | margin-right: 10rpx; 130 | } 131 | 132 | .info-tick { 133 | color: #ff586d; 134 | margin-right: 15rpx; 135 | } 136 | 137 | .pay-tit { 138 | padding: 20rpx 0; 139 | display: flex; 140 | align-items: center; 141 | justify-content: space-between; 142 | border-bottom: 1rpx solid #f7f8f9; 143 | } 144 | 145 | .pay-type { 146 | display: flex; 147 | justify-content: space-between; 148 | background-color: #fff; 149 | padding: 30rpx 0; 150 | margin-bottom: 1rpx; 151 | } 152 | 153 | .pay-wx { 154 | color: #09bb07; 155 | font-size: var(--biger); 156 | vertical-align: middle; 157 | display: inline-block; 158 | margin: -5rpx 5rpx 0 0; 159 | } 160 | 161 | .pay-ye { 162 | color: #ffbd27; 163 | font-size: var(--biger); 164 | vertical-align: middle; 165 | display: inline-block; 166 | margin: -5rpx 5rpx 0 0; 167 | } 168 | 169 | radio { 170 | transform: scale(.8); 171 | margin: -3rpx 0 0 5rpx; 172 | vertical-align: middle; 173 | } 174 | 175 | .footer { 176 | position: fixed; 177 | bottom: 0; 178 | left: 0; 179 | width: 100%; 180 | height: 90rpx; 181 | display: flex; 182 | align-items: center; 183 | justify-content: space-around; 184 | background-color: #fff 185 | } 186 | 187 | .footer-info { 188 | flex: 2; 189 | margin-left: 25rpx; 190 | } 191 | 192 | .footer-buy { 193 | flex: 1; 194 | color: #fff; 195 | height: 68rpx; 196 | display: flex; 197 | align-items: center; 198 | justify-content: center; 199 | background-color: #ff586d; 200 | margin-right: 25rpx; 201 | } 202 | 203 | .bold { 204 | font-weight: bold; 205 | } -------------------------------------------------------------------------------- /小程序 商城/pages/recom/recom.js: -------------------------------------------------------------------------------- 1 | const app = getApp() 2 | 3 | 4 | Page({ 5 | 6 | /** 7 | * 页面的初始数据 8 | */ 9 | data: { 10 | StatusBar: app.local.StatusBar, 11 | CustomBar: app.local.CustomBar, 12 | alpha: 0 13 | }, 14 | 15 | /** 16 | * 生命周期函数--监听页面加载 17 | */ 18 | onLoad: function (options) { 19 | 20 | }, 21 | 22 | /** 23 | * 生命周期函数--监听页面初次渲染完成 24 | */ 25 | onReady: function () { 26 | 27 | }, 28 | 29 | /** 30 | * 生命周期函数--监听页面显示 31 | */ 32 | onShow: function () { 33 | 34 | }, 35 | 36 | onPageScroll: function(e) { 37 | const alpha = e.scrollTop/100 38 | this.setData({ 39 | alpha: alpha 40 | }) 41 | }, 42 | 43 | /** 44 | * 生命周期函数--监听页面隐藏 45 | */ 46 | onHide: function () { 47 | 48 | }, 49 | 50 | /** 51 | * 生命周期函数--监听页面卸载 52 | */ 53 | onUnload: function () { 54 | 55 | }, 56 | 57 | /** 58 | * 页面相关事件处理函数--监听用户下拉动作 59 | */ 60 | onPullDownRefresh: function () { 61 | 62 | }, 63 | 64 | /** 65 | * 页面上拉触底事件的处理函数 66 | */ 67 | onReachBottom: function () { 68 | 69 | }, 70 | 71 | /** 72 | * 用户点击右上角分享 73 | */ 74 | onShareAppMessage: function () { 75 | 76 | } 77 | }) -------------------------------------------------------------------------------- /小程序 商城/pages/recom/recom.json: -------------------------------------------------------------------------------- 1 | { 2 | "usingComponents": {} 3 | } -------------------------------------------------------------------------------- /小程序 商城/pages/recom/recom.wxml: -------------------------------------------------------------------------------- 1 | 2 | 值得买 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 9.9超值 11 | 定价直降 12 | 13 | 14 | 15 | 9.9超值 16 | 定价直降 17 | 18 | 19 | 20 | 9.9超值 21 | 定价直降 22 | 23 | 24 | 25 | 9.9超值 26 | 定价直降 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 秋季新款水饮冲调爆品热卖 35 | 36 | 37 | 38 | 好物鉴赏 39 | 40 | 41 | 100 阅读 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 秋季新款水饮冲调爆品热卖 53 | 54 | 55 | 56 | 好物鉴赏 57 | 58 | 59 | 100 阅读 60 | 61 | 62 | 63 | 64 | 65 | 66 | 秋季新款水饮冲调爆品热卖 67 | 68 | 69 | 70 | 好物鉴赏 71 | 72 | 73 | 100 阅读 74 | 75 | 76 | 77 | 78 | 79 | 80 | 81 | 82 | 83 | 84 | 秋季新款水饮冲调爆品热卖 85 | 86 | 87 | 88 | 好物鉴赏 89 | 90 | 91 | 100 阅读 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 秋季新款水饮冲调爆品热卖 103 | 104 | 105 | 106 | 好物鉴赏 107 | 108 | 109 | 100 阅读 110 | 111 | 112 | 113 | 114 | 115 | 116 | 秋季新款水饮冲调爆品热卖 117 | 118 | 119 | 120 | 好物鉴赏 121 | 122 | 123 | 100 阅读 124 | 125 | 126 | 127 | 128 | 129 | 130 | -------------------------------------------------------------------------------- /小程序 商城/pages/recom/recom.wxss: -------------------------------------------------------------------------------- 1 | .box { 2 | min-height: 100vh; 3 | background-size: 100% auto; 4 | background-repeat: no-repeat; 5 | background-attachment: fixed; 6 | } 7 | 8 | .head { 9 | position: fixed; 10 | top: 0; 11 | left: 0; 12 | width: 100%; 13 | display: flex; 14 | align-items: center; 15 | padding-left: 30rpx; 16 | font-size: var(--big); 17 | background-color: rgba(255, 255, 255, .97); 18 | z-index: 99999; 19 | } 20 | 21 | .hot { 22 | display: flex; 23 | flex-wrap: wrap; 24 | margin: 20rpx 20rpx; 25 | padding: 20rpx; 26 | background-color: rgba(255, 255, 255, .86); 27 | } 28 | 29 | .hot-item { 30 | width: 25%; 31 | display: flex; 32 | flex-direction: column; 33 | align-items: center; 34 | justify-content: center; 35 | margin: 20rpx 0; 36 | } 37 | 38 | .hot-item-img { 39 | width: 120rpx; 40 | height: 120rpx; 41 | } 42 | 43 | .hot-item-tit { 44 | font-weight: bold; 45 | margin-top: 10rpx; 46 | } 47 | 48 | .hot-item-tip { 49 | font-size: var(--mini); 50 | } 51 | 52 | .art { 53 | display: flex; 54 | margin: 20rpx 20rpx; 55 | overflow: hidden; 56 | background-color: rgba(255, 255, 255, .86); 57 | } 58 | 59 | .art-col { 60 | flex-direction: column; 61 | } 62 | 63 | .art-all { 64 | width: 100%; 65 | height: 420rpx; 66 | } 67 | 68 | .art-all image { 69 | width: 100%; 70 | height: 420rpx; 71 | } 72 | 73 | .art-three { 74 | display: flex; 75 | justify-content: space-between; 76 | padding: 20rpx 20rpx 0; 77 | } 78 | 79 | .art-three image { 80 | width: 32%; 81 | height: 300rpx; 82 | } 83 | 84 | .art-tit { 85 | font-size: var(--big); 86 | font-weight: bold; 87 | margin: 10rpx 20rpx 25rpx; 88 | } 89 | 90 | .art-info { 91 | display: flex; 92 | align-items: center; 93 | justify-content: space-between; 94 | padding: 10rpx 20rpx 20rpx; 95 | } 96 | 97 | .art-min { 98 | font-size: var(--mini); 99 | } 100 | 101 | .art-user { 102 | display: flex; 103 | align-items: center; 104 | } 105 | 106 | .art-user image { 107 | width: 40rpx; 108 | height: 40rpx; 109 | overflow: hidden; 110 | margin-right: 10rpx; 111 | } 112 | 113 | .art-user text { 114 | font-size: var(--mini); 115 | } 116 | 117 | .art-con { 118 | flex: 1; 119 | display: flex; 120 | flex-direction: column; 121 | justify-content: space-between; 122 | } 123 | 124 | .art-img { 125 | max-width: 230rpx; 126 | max-height: 180rpx; 127 | margin: 20rpx; 128 | } 129 | -------------------------------------------------------------------------------- /小程序 商城/project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "description": "项目配置文件", 3 | "packOptions": { 4 | "ignore": [] 5 | }, 6 | "setting": { 7 | "urlCheck": true, 8 | "es6": true, 9 | "enhance": false, 10 | "postcss": true, 11 | "preloadBackgroundData": false, 12 | "minified": true, 13 | "newFeature": true, 14 | "coverView": true, 15 | "nodeModules": false, 16 | "autoAudits": false, 17 | "showShadowRootInWxmlPanel": true, 18 | "scopeDataCheck": false, 19 | "uglifyFileName": false, 20 | "checkInvalidKey": true, 21 | "checkSiteMap": true, 22 | "uploadWithSourceMap": true, 23 | "compileHotReLoad": false, 24 | "useMultiFrameRuntime": false, 25 | "useApiHook": true, 26 | "babelSetting": { 27 | "ignore": [], 28 | "disablePlugins": [], 29 | "outputPath": "" 30 | }, 31 | "enableEngineNative": false, 32 | "useIsolateContext": true, 33 | "useCompilerModule": true, 34 | "userConfirmedUseCompilerModuleSwitch": false, 35 | "packNpmManually": false, 36 | "packNpmRelationList": [], 37 | "minifyWXSS": true 38 | }, 39 | "compileType": "miniprogram", 40 | "libVersion": "2.11.0", 41 | "appid": "wx6fcbef72d444c8aa", 42 | "projectname": "shop", 43 | "debugOptions": { 44 | "hidedInDevtools": [] 45 | }, 46 | "isGameTourist": false, 47 | "simulatorType": "wechat", 48 | "simulatorPluginLibVersion": {}, 49 | "condition": { 50 | "search": { 51 | "list": [] 52 | }, 53 | "conversation": { 54 | "list": [] 55 | }, 56 | "plugin": { 57 | "list": [] 58 | }, 59 | "game": { 60 | "currentL": -1, 61 | "list": [] 62 | }, 63 | "gamePlugin": { 64 | "list": [] 65 | }, 66 | "miniprogram": { 67 | "list": [ 68 | { 69 | "id": 0, 70 | "name": "pages/good/good", 71 | "pathName": "pages/good/good", 72 | "query": "", 73 | "scene": null 74 | } 75 | ] 76 | } 77 | } 78 | } -------------------------------------------------------------------------------- /小程序 商城/sitemap.json: -------------------------------------------------------------------------------- 1 | { 2 | "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html", 3 | "rules": [{ 4 | "action": "allow", 5 | "page": "*" 6 | }] 7 | } -------------------------------------------------------------------------------- /小程序 商城/static/agent.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/agent.jpg -------------------------------------------------------------------------------- /小程序 商城/static/cart.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/cart.png -------------------------------------------------------------------------------- /小程序 商城/static/carto.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/carto.png -------------------------------------------------------------------------------- /小程序 商城/static/class.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c0.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c0.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c1.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c2.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c3.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c4.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c5.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c6.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c7.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c8.png -------------------------------------------------------------------------------- /小程序 商城/static/class/c9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/class/c9.png -------------------------------------------------------------------------------- /小程序 商城/static/classo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/classo.png -------------------------------------------------------------------------------- /小程序 商城/static/cooper.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/cooper.png -------------------------------------------------------------------------------- /小程序 商城/static/customer.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/customer.png -------------------------------------------------------------------------------- /小程序 商城/static/favo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/favo.png -------------------------------------------------------------------------------- /小程序 商城/static/gift.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/gift.png -------------------------------------------------------------------------------- /小程序 商城/static/ic_mea.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/ic_mea.png -------------------------------------------------------------------------------- /小程序 商城/static/ic_meb.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/ic_meb.png -------------------------------------------------------------------------------- /小程序 商城/static/ic_mec.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/ic_mec.png -------------------------------------------------------------------------------- /小程序 商城/static/ic_med.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/ic_med.png -------------------------------------------------------------------------------- /小程序 商城/static/ic_mee.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/ic_mee.png -------------------------------------------------------------------------------- /小程序 商城/static/icon.wxss: -------------------------------------------------------------------------------- 1 | @keyframes icon-spin { 2 | 0% { 3 | -webkit-transform: rotate(0); 4 | transform: rotate(0); 5 | } 6 | 7 | 100% { 8 | -webkit-transform: rotate(359deg); 9 | transform: rotate(359deg); 10 | } 11 | } 12 | 13 | .iconfont-spin { 14 | -webkit-animation: icon-spin 2s infinite linear; 15 | animation: icon-spin 2s infinite linear; 16 | display: inline-block; 17 | } 18 | 19 | .iconfont-pulse { 20 | -webkit-animation: icon-spin 1s infinite steps(8); 21 | animation: icon-spin 1s infinite steps(8); 22 | display: inline-block; 23 | } 24 | 25 | text[class*="icon-"], 26 | view[class*="icon-"], 27 | button[class*="icon-"] { 28 | font-family: "iweIcon"; 29 | font-style: normal; 30 | } 31 | 32 | @font-face { 33 | font-family: 'iweIcon'; 34 | src: url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.eot'); 35 | src: url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.eot?#iefix') format('embedded-opentype'), 36 | url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.woff2') format('woff2'), 37 | url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.woff') format('woff'), 38 | url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.ttf') format('truetype'), 39 | url('//at.alicdn.com/t/font_1818100_1raqroxzhsr.svg#iconfont') format('svg'); 40 | } 41 | 42 | .icon-back:before { 43 | content: "\e602"; 44 | font-size: var(--biger); 45 | } 46 | 47 | .icon-search:before { 48 | content: "\e60c"; 49 | } 50 | 51 | .icon-scan:before { 52 | content: "\e7dc"; 53 | } 54 | 55 | .icon-arrow:before { 56 | content: "\e7b9"; 57 | } 58 | 59 | .icon-countdown:before { 60 | content: "\e60b"; 61 | } 62 | 63 | .icon-view:before { 64 | content: "\e61c"; 65 | } 66 | 67 | .icon-money:before { 68 | content: "\e665"; 69 | } 70 | 71 | .icon-level:before { 72 | content: "\e6b4"; 73 | } 74 | 75 | .icon-favo:before { 76 | content: "\e60d"; 77 | } 78 | 79 | .icon-favos:before { 80 | content: "\e622"; 81 | } 82 | 83 | .icon-hot:before { 84 | content: "\e600"; 85 | } 86 | 87 | .icon-hots:before { 88 | content: "\e60f"; 89 | } 90 | 91 | .icon-poster:before { 92 | content: "\e623"; 93 | } 94 | 95 | .icon-del:before { 96 | content: "\e62c"; 97 | } 98 | 99 | .icon-more:before { 100 | content: "\e609"; 101 | } 102 | 103 | .icon-che:before { 104 | content: "\e614"; 105 | } 106 | 107 | .icon-cheo:before { 108 | content: "\e613"; 109 | } 110 | 111 | .icon-pic::before { 112 | content: "\e627"; 113 | } 114 | 115 | .icon-txt::before { 116 | content: "\e61d"; 117 | } 118 | 119 | .icon-close::before { 120 | content: "\e60e"; 121 | } 122 | 123 | .icon-star::before { 124 | content: "\e7a7"; 125 | } 126 | 127 | .icon-kf::before { 128 | content: "\e607"; 129 | } -------------------------------------------------------------------------------- /小程序 商城/static/icon_news.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/icon_news.png -------------------------------------------------------------------------------- /小程序 商城/static/icon_pay.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/icon_pay.png -------------------------------------------------------------------------------- /小程序 商城/static/inb.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/inb.jpg -------------------------------------------------------------------------------- /小程序 商城/static/index.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/index.png -------------------------------------------------------------------------------- /小程序 商城/static/indexo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/indexo.png -------------------------------------------------------------------------------- /小程序 商城/static/main.wxss: -------------------------------------------------------------------------------- 1 | page { 2 | background-color: #f7f8fb; 3 | font-size: 28rpx; 4 | color: #373737; 5 | font-family: -apple-system-font, "Helvetica Neue", Helvetica, sans-serif; 6 | /* Color 可以自定义相关配色 */ 7 | --red: #ff586d; 8 | --orange: #f37b1d; 9 | --yellow: #fbbd08; 10 | --olive: #8dc63f; 11 | --green: #39b54a; 12 | --cyan: #35c3ab; 13 | --blue: #0081ff; 14 | --purple: #6739b6; 15 | --mauve: #9c26b0; 16 | --pink: #e03997; 17 | --brown: #a5673f; 18 | --grey: #8799a3; 19 | --gray: #aaa; 20 | --black: #333; 21 | --white: #fff; 22 | --mini: 24rpx; 23 | --minier: 20rpx; 24 | --big: 32rpx; 25 | --biger: 36rpx; 26 | --bigers: 42rpx; 27 | --bigera: 60rpx; 28 | --bigerb: 80rpx; 29 | --gradualRed: linear-gradient(45deg, #f43f3b, #ec008c); 30 | --gradualOrange: linear-gradient(45deg, #ff9700, #ed1c24); 31 | --gradualGreen: linear-gradient(45deg, #83c97d, #2dc2a9); 32 | --gradualPurple: linear-gradient(45deg, #9000ff, #5e00ff); 33 | --gradualPink: linear-gradient(45deg, #ec008c, #6739b6); 34 | --gradualBlue: linear-gradient(45deg, #0081ff, #1cbbb4); 35 | } 36 | 37 | view, scroll-view, swiper, button, input, text, textarea, label, navigator, 38 | image { 39 | box-sizing: border-box; 40 | } 41 | 42 | ::-webkit-input-placeholder { 43 | color: var(--gray); 44 | font-family: -apple-system-font, "Helvetica Neue", Helvetica, sans-serif; 45 | } 46 | 47 | ::-webkit-scrollbar { 48 | width: 0; 49 | height: 0; 50 | opacity: 0; 51 | color: transparent; 52 | } 53 | 54 | .round { 55 | border-radius: 5000rpx; 56 | } 57 | 58 | .radius { 59 | border-radius: 6rpx; 60 | } 61 | 62 | .radius-top-left { 63 | border-top-left-radius: 30rpx; 64 | } 65 | 66 | .shadow { 67 | box-shadow: 0 2rpx 6rpx rgba(100, 100, 100, 0.07); 68 | } 69 | 70 | .shadow-all { 71 | box-shadow: 3rpx 6rpx 12rpx rgba(100, 100, 100, 0.07); 72 | } 73 | 74 | .shadow-warp { 75 | position: relative; 76 | box-shadow: 0 0 6rpx rgba(0, 0, 0, 0.06); 77 | } 78 | 79 | .shadow-warp:before, .shadow-warp:after { 80 | position: absolute; 81 | content: ""; 82 | top: 20rpx; 83 | bottom: 30rpx; 84 | left: 20rpx; 85 | width: 50%; 86 | box-shadow: 0 20rpx 10rpx rgba(0, 0, 0, 0.1); 87 | transform: rotate(-3deg); 88 | z-index: -1; 89 | } 90 | 91 | .shadow-warp:after { 92 | right: 20rpx; 93 | left: auto; 94 | transform: rotate(3deg); 95 | } 96 | 97 | /* 98 | css 滤镜 控制黑白底色gif的 99 | */ 100 | 101 | .gif-black { 102 | mix-blend-mode: screen; 103 | } 104 | 105 | .gif-white { 106 | mix-blend-mode: multiply; 107 | } 108 | 109 | /* 110 | 图片 111 | */ 112 | 113 | image { 114 | max-width: 100%; 115 | display: inline-block; 116 | position: relative; 117 | z-index: 0; 118 | } 119 | 120 | image.loading::before { 121 | content: ""; 122 | background-color: #f5f5f5; 123 | display: block; 124 | position: absolute; 125 | width: 100%; 126 | height: 100%; 127 | z-index: -2; 128 | } 129 | 130 | image.loading::after { 131 | content: "\e7f1"; 132 | font-family: "cuIcon"; 133 | position: absolute; 134 | top: 0; 135 | left: 0; 136 | width: 32rpx; 137 | height: 32rpx; 138 | line-height: 32rpx; 139 | right: 0; 140 | bottom: 0; 141 | z-index: -1; 142 | font-size: 32rpx; 143 | margin: auto; 144 | color: #ccc; 145 | -webkit-animation: icon-spin 2s infinite linear; 146 | animation: icon-spin 2s infinite linear; 147 | display: block; 148 | } 149 | 150 | /* 151 | 头部 152 | */ 153 | 154 | .head { 155 | display: block; 156 | position: relative; 157 | } 158 | 159 | .bar { 160 | position: fixed; 161 | top: 0; 162 | width: 100%; 163 | display: flex; 164 | align-items: center; 165 | justify-content: space-between; 166 | z-index: 9999; 167 | } 168 | 169 | .foot { 170 | position: fixed; 171 | bottom: 0; 172 | left: 0; 173 | right: 0; 174 | padding: 0; 175 | min-height: 100rpx; 176 | display: flex; 177 | justify-content: space-around; 178 | background-color: #26c1ad; 179 | height: calc(100rpx + env(safe-area-inset-bottom) / 2); 180 | padding-bottom: calc(env(safe-area-inset-bottom) / 2); 181 | z-index: 99999; 182 | } 183 | 184 | .foot-height { 185 | min-height: 100rpx; 186 | height: calc(100rpx + env(safe-area-inset-bottom) / 2); 187 | } 188 | 189 | .bar-back { 190 | display: flex; 191 | align-items: center; 192 | text-align: left; 193 | height: 100%; 194 | max-width: 100%; 195 | min-width: 90rpx; 196 | } 197 | 198 | .bar-back text { 199 | margin: 2rpx auto 0 20rpx; 200 | } 201 | 202 | .bar-back text::before { 203 | font-size: var(--big); 204 | } 205 | 206 | .bar-back view { 207 | vertical-align: middle 208 | } 209 | 210 | .bar-title { 211 | position: absolute; 212 | top: 0; 213 | left: 0; 214 | bottom: 0; 215 | right: 0; 216 | text-align: center; 217 | width: calc(100% - 440rpx); 218 | height: 60rpx; 219 | margin: auto; 220 | font-size: var(--big); 221 | line-height: 62rpx; 222 | cursor: none; 223 | pointer-events: none; 224 | text-overflow: ellipsis; 225 | white-space: nowrap; 226 | overflow: hidden; 227 | } 228 | 229 | .bar-title image { 230 | height: 60rpx; 231 | width: 240rpx; 232 | } 233 | 234 | /* 235 | 轮播 236 | */ 237 | 238 | swiper.square-dot .wx-swiper-dot { 239 | background-color: #fff; 240 | opacity: 0.4; 241 | width: 10rpx; 242 | height: 10rpx; 243 | border-radius: 20rpx; 244 | transition: all 0.3s ease-in-out 0s; 245 | } 246 | 247 | swiper.square-dot .wx-swiper-dot.wx-swiper-dot-active { 248 | opacity: 1; 249 | width: 30rpx; 250 | } 251 | 252 | swiper.round-dot .wx-swiper-dot { 253 | width: 10rpx; 254 | height: 10rpx; 255 | top: -4rpx; 256 | transition: all 0.3s ease-in-out 0s; 257 | position: relative; 258 | } 259 | 260 | swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active::after { 261 | content: ""; 262 | position: absolute; 263 | width: 10rpx; 264 | height: 10rpx; 265 | top: 0rpx; 266 | left: 0rpx; 267 | right: 0; 268 | bottom: 0; 269 | margin: auto; 270 | background-color: #fff; 271 | border-radius: 20rpx; 272 | } 273 | 274 | swiper.round-dot .wx-swiper-dot.wx-swiper-dot-active { 275 | width: 18rpx; 276 | height: 18rpx; 277 | top: 0rpx; 278 | } 279 | 280 | .screen-swiper { 281 | min-height: 375rpx; 282 | } 283 | 284 | .screen-swiper image, .screen-swiper video, .swiper-item image, 285 | .swiper-item video { 286 | width: 100%; 287 | display: block; 288 | height: 100%; 289 | margin: 0; 290 | pointer-events: none; 291 | } 292 | 293 | .card-swiper { 294 | height: 420rpx; 295 | } 296 | 297 | .card-swiper swiper-item { 298 | width: 610rpx !important; 299 | left: 70rpx; 300 | box-sizing: border-box; 301 | padding: 40rpx 0rpx 70rpx; 302 | overflow: initial; 303 | } 304 | 305 | .card-swiper swiper-item .swiper-item { 306 | width: 100%; 307 | display: block; 308 | height: 100%; 309 | border-radius: 10rpx; 310 | transform: scale(0.9); 311 | transition: all 0.2s ease-in 0s; 312 | overflow: hidden; 313 | } 314 | 315 | .card-swiper swiper-item.cur .swiper-item { 316 | transform: none; 317 | transition: all 0.2s ease-in 0s; 318 | } 319 | 320 | .tower-swiper { 321 | height: 420rpx; 322 | position: relative; 323 | max-width: 750rpx; 324 | overflow: hidden; 325 | } 326 | 327 | .tower-swiper .tower-item { 328 | position: absolute; 329 | width: 300rpx; 330 | height: 380rpx; 331 | top: 0; 332 | bottom: 0; 333 | left: 50%; 334 | margin: auto; 335 | transition: all 0.2s ease-in 0s; 336 | opacity: 1; 337 | } 338 | 339 | .tower-swiper .tower-item.none { 340 | opacity: 0; 341 | } 342 | 343 | .tower-swiper .tower-item .swiper-item { 344 | width: 100%; 345 | height: 100%; 346 | border-radius: 6rpx; 347 | overflow: hidden; 348 | } 349 | 350 | /* 351 | 背景 352 | */ 353 | 354 | .bg-red { 355 | background-color: var(--red); 356 | color: #fff; 357 | } 358 | 359 | .bg-orange { 360 | background-color: var(--orange); 361 | color: #fff; 362 | } 363 | 364 | .bg-yellow { 365 | background-color: var(--yellow); 366 | color: var(--black); 367 | } 368 | 369 | .bg-olive { 370 | background-color: var(--olive); 371 | color: #fff; 372 | } 373 | 374 | .bg-green { 375 | background-color: var(--green); 376 | color: #fff; 377 | } 378 | 379 | .bg-cyan { 380 | background-color: var(--cyan); 381 | color: #fff; 382 | } 383 | 384 | .bg-blue { 385 | background-color: var(--blue); 386 | color: #fff; 387 | } 388 | 389 | .bg-purple { 390 | background-color: var(--purple); 391 | color: #fff; 392 | } 393 | 394 | .bg-mauve { 395 | background-color: var(--mauve); 396 | color: #fff; 397 | } 398 | 399 | .bg-pink { 400 | background-color: var(--pink); 401 | color: #fff; 402 | } 403 | 404 | .bg-brown { 405 | background-color: var(--brown); 406 | color: #fff; 407 | } 408 | 409 | .bg-grey { 410 | background-color: var(--grey); 411 | color: #fff; 412 | } 413 | 414 | .bg-gray { 415 | background-color: #f8f8f8; 416 | color: #666; 417 | } 418 | 419 | .bg-black { 420 | background-color: var(--black); 421 | color: #fff; 422 | } 423 | 424 | .bg-white { 425 | background-color: #fff; 426 | color: #666; 427 | } 428 | 429 | .bg-red.light { 430 | color: var(--red); 431 | background-color: #fadbd9; 432 | } 433 | 434 | .bg-orange.light { 435 | color: var(--orange); 436 | background-color: #fde6d2; 437 | } 438 | 439 | .bg-yellow.light { 440 | color: var(--yellow); 441 | background-color: #fef2ce; 442 | } 443 | 444 | .bg-olive.light { 445 | color: var(--olive); 446 | background-color: #e8f4d9; 447 | } 448 | 449 | .bg-green.light { 450 | color: var(--green); 451 | background-color: #d7f0db; 452 | } 453 | 454 | .bg-cyan.light { 455 | color: var(--cyan); 456 | background-color: #d2f1f0; 457 | } 458 | 459 | .bg-blue.light { 460 | color: var(--blue); 461 | background-color: #cce6ff; 462 | } 463 | 464 | .bg-purple.light { 465 | color: var(--purple); 466 | background-color: #e1d7f0; 467 | } 468 | 469 | .bg-mauve.light { 470 | color: var(--mauve); 471 | background-color: #ebd4ef; 472 | } 473 | 474 | .bg-pink.light { 475 | color: var(--pink); 476 | background-color: #f9d7ea; 477 | } 478 | 479 | .bg-brown.light { 480 | color: var(--brown); 481 | background-color: #ede1d9; 482 | } 483 | 484 | .bg-grey.light { 485 | color: var(--grey); 486 | background-color: #e7ebed; 487 | } 488 | 489 | .bg-gray.light { 490 | color: #666; 491 | background-color: #fadbd9; 492 | } 493 | 494 | .bg-gradual-red { 495 | background-image: var(--gradualRed); 496 | color: #fff; 497 | } 498 | 499 | .bg-gradual-orange { 500 | background-image: var(--gradualOrange); 501 | color: #fff; 502 | } 503 | 504 | .bg-gradual-green { 505 | background-image: var(--gradualGreen); 506 | color: #fff; 507 | } 508 | 509 | .bg-gradual-purple { 510 | background-image: var(--gradualPurple); 511 | color: #fff; 512 | } 513 | 514 | .bg-gradual-pink { 515 | background-image: var(--gradualPink); 516 | color: #fff; 517 | } 518 | 519 | .bg-gradual-blue { 520 | background-image: var(--gradualBlue); 521 | color: #fff; 522 | } 523 | 524 | .bg-img { 525 | background-size: cover; 526 | background-position: center; 527 | background-repeat: no-repeat; 528 | } 529 | 530 | .bg-mask { 531 | border-radius: inherit; 532 | width: 100%; 533 | height: 100%; 534 | display: block; 535 | background-color: rgba(0, 0, 0, 0.5); 536 | position: fixed; 537 | left: 0; 538 | right: 0; 539 | bottom: 0; 540 | top: 0; 541 | z-index: 999; 542 | } 543 | 544 | .bg-mask view, .bg-mask cover-view { 545 | z-index: 5; 546 | position: relative; 547 | } 548 | 549 | .bg-video { 550 | position: relative; 551 | } 552 | 553 | .bg-video video { 554 | display: block; 555 | height: 100%; 556 | width: 100%; 557 | -o-object-fit: cover; 558 | object-fit: cover; 559 | position: absolute; 560 | top: 0; 561 | z-index: 0; 562 | pointer-events: none; 563 | } 564 | 565 | /* 566 | 无数据 567 | */ 568 | 569 | .none { 570 | width: 100%; 571 | display: flex; 572 | flex-direction: column; 573 | align-items: center; 574 | margin-top: 300rpx; 575 | margin-bottom: 0; 576 | padding-bottom: 0; 577 | } 578 | 579 | .none image { 580 | width: 303rpx; 581 | height: 270rpx; 582 | } 583 | 584 | .none text { 585 | color: #ccc; 586 | font-size: 32rpx; 587 | margin: 45rpx auto 80rpx; 588 | } 589 | 590 | /* 591 | 加载更多 592 | */ 593 | 594 | .loading { 595 | width: 100%; 596 | padding: 30rpx 20rpx; 597 | display: flex; 598 | align-items: center; 599 | justify-content: center; 600 | } 601 | 602 | .loading view { 603 | width: 12px; 604 | height: 12px; 605 | margin: 0 20rpx; 606 | border-radius: 50%; 607 | } 608 | 609 | .loading-one { 610 | animation: load-one 1.5s infinite; 611 | background-color: #5c6bc0; 612 | } 613 | 614 | .loading-two { 615 | animation: load-two 1.5s infinite; 616 | animation-delay: 0.25s; 617 | background-color: #8bc34a; 618 | } 619 | 620 | .loading-three { 621 | animation: load-three 1.5s infinite; 622 | animation-delay: 0.5s; 623 | background-color: #ffb74d; 624 | } 625 | 626 | .loading-four { 627 | animation: load-four 1.5s infinite; 628 | animation-delay: 0.75s; 629 | background-color: #f44336; 630 | } 631 | 632 | @keyframes load-one { 633 | 75% { 634 | transform: scale(0); 635 | } 636 | } 637 | 638 | @keyframes load-two { 639 | 75% { 640 | transform: scale(0); 641 | } 642 | } 643 | 644 | @keyframes load-three { 645 | 75% { 646 | transform: scale(0); 647 | } 648 | } 649 | 650 | @keyframes load-four { 651 | 75% { 652 | transform: scale(0); 653 | } 654 | } 655 | 656 | /* 657 | 颜色 658 | */ 659 | 660 | .gray { 661 | color: var(--gray); 662 | } 663 | 664 | .grey { 665 | color: var(--grey); 666 | } 667 | 668 | .red { 669 | color: var(--red); 670 | } 671 | 672 | .orange { 673 | color: var(--orange); 674 | } 675 | 676 | .white { 677 | color: var(--white); 678 | } 679 | 680 | .blue { 681 | color: var(--blue); 682 | } 683 | 684 | .green { 685 | color: var(--green); 686 | } 687 | 688 | .bo-grey { 689 | border-color: var(--grey); 690 | } 691 | 692 | /* 693 | 字体大小 694 | */ 695 | 696 | .min { 697 | font-size: var(--mini); 698 | } 699 | 700 | .maxs { 701 | font-size: 30rpx; 702 | } 703 | 704 | .bold { 705 | font-weight: bold; 706 | } 707 | 708 | .dis { 709 | display: none; 710 | } 711 | 712 | .lt { 713 | float: left; 714 | } 715 | 716 | .rt { 717 | float: right; 718 | } 719 | -------------------------------------------------------------------------------- /小程序 商城/static/mar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/mar.png -------------------------------------------------------------------------------- /小程序 商城/static/mem.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/mem.png -------------------------------------------------------------------------------- /小程序 商城/static/memo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/memo.png -------------------------------------------------------------------------------- /小程序 商城/static/mess.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/mess.png -------------------------------------------------------------------------------- /小程序 商城/static/product/1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/1.png -------------------------------------------------------------------------------- /小程序 商城/static/product/10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/10.png -------------------------------------------------------------------------------- /小程序 商城/static/product/2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/2.png -------------------------------------------------------------------------------- /小程序 商城/static/product/3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/3.png -------------------------------------------------------------------------------- /小程序 商城/static/product/4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/4.png -------------------------------------------------------------------------------- /小程序 商城/static/product/5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/5.png -------------------------------------------------------------------------------- /小程序 商城/static/product/6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/6.png -------------------------------------------------------------------------------- /小程序 商城/static/product/7.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/7.png -------------------------------------------------------------------------------- /小程序 商城/static/product/8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/8.png -------------------------------------------------------------------------------- /小程序 商城/static/product/9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/product/9.png -------------------------------------------------------------------------------- /小程序 商城/static/reco.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/reco.png -------------------------------------------------------------------------------- /小程序 商城/static/recom.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/recom.png -------------------------------------------------------------------------------- /小程序 商城/static/recomo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/recomo.png -------------------------------------------------------------------------------- /小程序 商城/static/swaper/s0.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/swaper/s0.jpg -------------------------------------------------------------------------------- /小程序 商城/static/swaper/s1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Bruno-zou/vue_projects/a90578f61ffab275b0a6f6327cb79dfd99c12f37/小程序 商城/static/swaper/s1.jpg -------------------------------------------------------------------------------- /小程序 商城/utils/core.js: -------------------------------------------------------------------------------- 1 | class core { 2 | constructor(arg) {} 3 | 4 | //加法运算 5 | floatAdd(arg1, arg2) { 6 | let r1, r2, m 7 | try { 8 | r1 = arg1.toString().split(".")[1].length 9 | } catch (e) { 10 | r1 = 0 11 | } 12 | try { 13 | r2 = arg2.toString().split(".")[1].length 14 | } catch (e) { 15 | r2 = 0 16 | } 17 | m = Math.pow(10, Math.max(r1, r2)) 18 | return (arg1 * m + arg2 * m) / m 19 | } 20 | 21 | //减法 22 | floatSub(arg1, arg2) { 23 | let r1, r2, m, n 24 | try { 25 | r1 = arg1.toString().split(".")[1].length 26 | } catch (e) { 27 | r1 = 0 28 | } 29 | try { 30 | r2 = arg2.toString().split(".")[1].length 31 | } catch (e) { 32 | r2 = 0 33 | } 34 | m = Math.pow(10, Math.max(r1, r2))     //动态控制精度长度     35 | n = (r1 >= r2) ? r1 : r2 36 | return ((arg1 * m - arg2 * m) / m).toFixed(n) 37 | } 38 | 39 | //乘法 40 | floatMul(arg1, arg2) { 41 | let m = 0, 42 | s1 = arg1.toString(), 43 | s2 = arg2.toString() 44 | try { 45 | m += s1.split(".")[1].length 46 | } catch (e) {} 47 | try { 48 | m += s2.split(".")[1].length 49 | } catch (e) {} 50 | return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m) 51 | } 52 | 53 | //除法  54 | floatDiv(arg1, arg2) { 55 | let t1 = 0, 56 | t2 = 0, 57 | r1, r2 58 | try { 59 | t1 = arg1.toString().split(".")[1].length 60 | } catch (e) {} 61 | try { 62 | t2 = arg2.toString().split(".")[1].length 63 | } catch (e) {} 64 | 65 | r1 = Number(arg1.toString().replace(".", "")) 66 | r2 = Number(arg2.toString().replace(".", "")) 67 | return (r1 / r2) * Math.pow(10, t2 - t1) 68 | } 69 | 70 | //检查手机号 71 | isPhone(phone) { 72 | const regp = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/; 73 | return regp.test(phone) 74 | } 75 | 76 | //toast 77 | toast(tit) { 78 | wx.showToast({ 79 | title: tit, 80 | icon: 'none' 81 | }) 82 | } 83 | 84 | //排序 85 | sortJson(array, field, reverse) { 86 | /** 87 | * json 数据排序 88 | * @param array 原始json字符串 89 | * @param string 排序字段 90 | * @param string 倒序 91 | */ 92 | 93 | //数组长度小于2 或 没有指定排序字段 或 不是json格式数据 94 | if (array.length < 2 || !field || typeof array[0] !== "object") return array 95 | 96 | //数字类型排序 97 | if (typeof array[0][field] === "number") { 98 | array.sort(function (x, y) { return x[field] - y[field] }) 99 | } 100 | 101 | //字符串类型排序 102 | if (typeof array[0][field] === "string") { 103 | array.sort(function (x, y) { return x[field].localeCompare(y[field]) }) 104 | } 105 | 106 | //倒序 107 | if (reverse) { 108 | array.reverse() 109 | } 110 | return array 111 | } 112 | 113 | } 114 | 115 | module.exports = new core() -------------------------------------------------------------------------------- /小程序 商城/utils/http.js: -------------------------------------------------------------------------------- 1 | class Http { 2 | 3 | baseUrl = 'https://www.iwecore.cn/' 4 | 5 | constructor(arg) {} 6 | 7 | post = (url, data, sign, header = {}) => { 8 | if (wx.getStorageSync('token') && sign) { 9 | header.token = wx.getStorageSync('token') 10 | } 11 | return new Promise((resolve, reject) => { 12 | wx.request({ 13 | url: this.baseUrl + url, 14 | data: data, 15 | method: 'POST', 16 | header: { 17 | ...this._header, 18 | ...header 19 | }, 20 | success: res => resolve(res), 21 | fail: reject 22 | }) 23 | }) 24 | } 25 | 26 | get = (url, data, sign, header = {}) => { 27 | if (wx.getStorageSync('token') && sign) { 28 | header.token = wx.getStorageSync('token') 29 | } 30 | return new Promise((resolve, reject) => { 31 | wx.request({ 32 | url: this.baseUrl + url, 33 | data: data, 34 | method: 'GET', 35 | header: { 36 | ...this._header, 37 | ...header 38 | }, 39 | success: res => resolve(res), 40 | fail: reject 41 | }) 42 | }) 43 | } 44 | 45 | getSystem = (app) => { 46 | wx.getSystemInfo({ 47 | success: e => { 48 | app.local.winHeight = e.windowHeight 49 | app.local.winWidth = e.windowWidth 50 | app.local.StatusBar = e.statusBarHeight 51 | let custom = wx.getMenuButtonBoundingClientRect() 52 | app.local.CustomBar = custom.bottom + custom.top - e.statusBarHeight 53 | } 54 | }) 55 | } 56 | 57 | saveUserInfo = (info) => { 58 | if(!info) { 59 | return 60 | } 61 | this.post('saveUserInfo', { 62 | avatar_url: info.avatarUrl, 63 | nick_name: info.nickName, 64 | city: info.city, 65 | sex: info.gender, 66 | province: info.province 67 | }, true).then(res => { 68 | //console.log(res) 69 | }) 70 | } 71 | 72 | //签名 73 | getsign = (arr) => { 74 | let arrs = [] 75 | for(let item in arr) { 76 | arrs.push(item + '=' + arr[item] + '&') 77 | } 78 | arrs = arrs.sort() 79 | let signStr = '' 80 | for(let i=0; i { 91 | return this.rstr2hex(this.rstr_md5(this.str2rstr_utf8(a))) 92 | } 93 | 94 | hex_hmac_md5 = (a, b) => { 95 | return this.rstr2hex(this.rstr_hmac_md5(this.str2rstr_utf8(a), this.str2rstr_utf8(b))) 96 | } 97 | 98 | md5_vm_test = () => { 99 | return this.hex_md5("abc").toLowerCase() == "900150983cd24fb0d6963f7d28e17f72" 100 | } 101 | 102 | rstr_md5 = (a) => { 103 | return this.binl2rstr(this.binl_md5(this.rstr2binl(a), a.length * 8)) 104 | } 105 | 106 | rstr_hmac_md5 = (c, f) => { 107 | var e = this.rstr2binl(c); 108 | if (e.length > 16) { 109 | e = binl_md5(e, c.length * 8) 110 | } 111 | var a = Array(16), 112 | d = Array(16); 113 | for (var b = 0; b < 16; b++) { 114 | a[b] = e[b] ^ 909522486; 115 | d[b] = e[b] ^ 1549556828 116 | } 117 | var g = this.binl_md5(a.concat(this.rstr2binl(f)), 512 + f.length * 8); 118 | return this.binl2rstr(this.binl_md5(d.concat(g), 512 + 128)) 119 | } 120 | 121 | rstr2hex = (c) => { 122 | try { 123 | this.hexcase 124 | } catch (g) { 125 | this.hexcase = 0 126 | } 127 | var f = this.hexcase ? "0123456789ABCDEF" : "0123456789abcdef"; 128 | var b = ""; 129 | var a; 130 | for (var d = 0; d < c.length; d++) { 131 | a = c.charCodeAt(d); 132 | b += f.charAt((a >>> 4) & 15) + f.charAt(a & 15) 133 | } 134 | return b 135 | } 136 | 137 | str2rstr_utf8 = (c) => { 138 | var b = ""; 139 | var d = -1; 140 | var a, e; 141 | while (++d < c.length) { 142 | a = c.charCodeAt(d); 143 | e = d + 1 < c.length ? c.charCodeAt(d + 1) : 0; 144 | if (55296 <= a && a <= 56319 && 56320 <= e && e <= 57343) { 145 | a = 65536 + ((a & 1023) << 10) + (e & 1023); 146 | d++ 147 | } 148 | if (a <= 127) { 149 | b += String.fromCharCode(a) 150 | } else { 151 | if (a <= 2047) { 152 | b += String.fromCharCode(192 | ((a >>> 6) & 31), 128 | (a & 63)) 153 | } else { 154 | if (a <= 65535) { 155 | b += String.fromCharCode(224 | ((a >>> 12) & 15), 128 | ((a >>> 6) & 63), 128 | (a & 63)) 156 | } else { 157 | if (a <= 2097151) { 158 | b += String.fromCharCode(240 | ((a >>> 18) & 7), 128 | ((a >>> 12) & 63), 128 | ((a >>> 6) & 63), 128 | (a & 63)) 159 | } 160 | } 161 | } 162 | } 163 | } 164 | return b 165 | } 166 | 167 | rstr2binl = (b) => { 168 | var a = Array(b.length >> 2); 169 | for (var c = 0; c < a.length; c++) { 170 | a[c] = 0 171 | } 172 | for (var c = 0; c < b.length * 8; c += 8) { 173 | a[c >> 5] |= (b.charCodeAt(c / 8) & 255) << (c % 32) 174 | } 175 | return a 176 | } 177 | 178 | binl2rstr = (b) => { 179 | var a = ""; 180 | for (var c = 0; c < b.length * 32; c += 8) { 181 | a += String.fromCharCode((b[c >> 5] >>> (c % 32)) & 255) 182 | } 183 | return a 184 | } 185 | 186 | binl_md5 = (p, k) => { 187 | p[k >> 5] |= 128 << ((k) % 32); 188 | p[(((k + 64) >>> 9) << 4) + 14] = k; 189 | var o = 1732584193; 190 | var n = -271733879; 191 | var m = -1732584194; 192 | var l = 271733878; 193 | for (var g = 0; g < p.length; g += 16) { 194 | var j = o; 195 | var h = n; 196 | var f = m; 197 | var e = l; 198 | o = this.md5_ff(o, n, m, l, p[g + 0], 7, -680876936); 199 | l = this.md5_ff(l, o, n, m, p[g + 1], 12, -389564586); 200 | m = this.md5_ff(m, l, o, n, p[g + 2], 17, 606105819); 201 | n = this.md5_ff(n, m, l, o, p[g + 3], 22, -1044525330); 202 | o = this.md5_ff(o, n, m, l, p[g + 4], 7, -176418897); 203 | l = this.md5_ff(l, o, n, m, p[g + 5], 12, 1200080426); 204 | m = this.md5_ff(m, l, o, n, p[g + 6], 17, -1473231341); 205 | n = this.md5_ff(n, m, l, o, p[g + 7], 22, -45705983); 206 | o = this.md5_ff(o, n, m, l, p[g + 8], 7, 1770035416); 207 | l = this.md5_ff(l, o, n, m, p[g + 9], 12, -1958414417); 208 | m = this.md5_ff(m, l, o, n, p[g + 10], 17, -42063); 209 | n = this.md5_ff(n, m, l, o, p[g + 11], 22, -1990404162); 210 | o = this.md5_ff(o, n, m, l, p[g + 12], 7, 1804603682); 211 | l = this.md5_ff(l, o, n, m, p[g + 13], 12, -40341101); 212 | m = this.md5_ff(m, l, o, n, p[g + 14], 17, -1502002290); 213 | n = this.md5_ff(n, m, l, o, p[g + 15], 22, 1236535329); 214 | o = this.md5_gg(o, n, m, l, p[g + 1], 5, -165796510); 215 | l = this.md5_gg(l, o, n, m, p[g + 6], 9, -1069501632); 216 | m = this.md5_gg(m, l, o, n, p[g + 11], 14, 643717713); 217 | n = this.md5_gg(n, m, l, o, p[g + 0], 20, -373897302); 218 | o = this.md5_gg(o, n, m, l, p[g + 5], 5, -701558691); 219 | l = this.md5_gg(l, o, n, m, p[g + 10], 9, 38016083); 220 | m = this.md5_gg(m, l, o, n, p[g + 15], 14, -660478335); 221 | n = this.md5_gg(n, m, l, o, p[g + 4], 20, -405537848); 222 | o = this.md5_gg(o, n, m, l, p[g + 9], 5, 568446438); 223 | l = this.md5_gg(l, o, n, m, p[g + 14], 9, -1019803690); 224 | m = this.md5_gg(m, l, o, n, p[g + 3], 14, -187363961); 225 | n = this.md5_gg(n, m, l, o, p[g + 8], 20, 1163531501); 226 | o = this.md5_gg(o, n, m, l, p[g + 13], 5, -1444681467); 227 | l = this.md5_gg(l, o, n, m, p[g + 2], 9, -51403784); 228 | m = this.md5_gg(m, l, o, n, p[g + 7], 14, 1735328473); 229 | n = this.md5_gg(n, m, l, o, p[g + 12], 20, -1926607734); 230 | o = this.md5_hh(o, n, m, l, p[g + 5], 4, -378558); 231 | l = this.md5_hh(l, o, n, m, p[g + 8], 11, -2022574463); 232 | m = this.md5_hh(m, l, o, n, p[g + 11], 16, 1839030562); 233 | n = this.md5_hh(n, m, l, o, p[g + 14], 23, -35309556); 234 | o = this.md5_hh(o, n, m, l, p[g + 1], 4, -1530992060); 235 | l = this.md5_hh(l, o, n, m, p[g + 4], 11, 1272893353); 236 | m = this.md5_hh(m, l, o, n, p[g + 7], 16, -155497632); 237 | n = this.md5_hh(n, m, l, o, p[g + 10], 23, -1094730640); 238 | o = this.md5_hh(o, n, m, l, p[g + 13], 4, 681279174); 239 | l = this.md5_hh(l, o, n, m, p[g + 0], 11, -358537222); 240 | m = this.md5_hh(m, l, o, n, p[g + 3], 16, -722521979); 241 | n = this.md5_hh(n, m, l, o, p[g + 6], 23, 76029189); 242 | o = this.md5_hh(o, n, m, l, p[g + 9], 4, -640364487); 243 | l = this.md5_hh(l, o, n, m, p[g + 12], 11, -421815835); 244 | m = this.md5_hh(m, l, o, n, p[g + 15], 16, 530742520); 245 | n = this.md5_hh(n, m, l, o, p[g + 2], 23, -995338651); 246 | o = this.md5_ii(o, n, m, l, p[g + 0], 6, -198630844); 247 | l = this.md5_ii(l, o, n, m, p[g + 7], 10, 1126891415); 248 | m = this.md5_ii(m, l, o, n, p[g + 14], 15, -1416354905); 249 | n = this.md5_ii(n, m, l, o, p[g + 5], 21, -57434055); 250 | o = this.md5_ii(o, n, m, l, p[g + 12], 6, 1700485571); 251 | l = this.md5_ii(l, o, n, m, p[g + 3], 10, -1894986606); 252 | m = this.md5_ii(m, l, o, n, p[g + 10], 15, -1051523); 253 | n = this.md5_ii(n, m, l, o, p[g + 1], 21, -2054922799); 254 | o = this.md5_ii(o, n, m, l, p[g + 8], 6, 1873313359); 255 | l = this.md5_ii(l, o, n, m, p[g + 15], 10, -30611744); 256 | m = this.md5_ii(m, l, o, n, p[g + 6], 15, -1560198380); 257 | n = this.md5_ii(n, m, l, o, p[g + 13], 21, 1309151649); 258 | o = this.md5_ii(o, n, m, l, p[g + 4], 6, -145523070); 259 | l = this.md5_ii(l, o, n, m, p[g + 11], 10, -1120210379); 260 | m = this.md5_ii(m, l, o, n, p[g + 2], 15, 718787259); 261 | n = this.md5_ii(n, m, l, o, p[g + 9], 21, -343485551); 262 | o = this.safe_add(o, j); 263 | n = this.safe_add(n, h); 264 | m = this.safe_add(m, f); 265 | l = this.safe_add(l, e) 266 | } 267 | return Array(o, n, m, l) 268 | } 269 | 270 | md5_cmn = (h, e, d, c, g, f) => { 271 | return this.safe_add(this.bit_rol(this.safe_add(this.safe_add(e, h), this.safe_add(c, f)), g), d) 272 | } 273 | 274 | md5_ff = (g, f, k, j, e, i, h) => { 275 | return this.md5_cmn((f & k) | ((~f) & j), g, f, e, i, h) 276 | } 277 | 278 | md5_gg = (g, f, k, j, e, i, h) => { 279 | return this.md5_cmn((f & j) | (k & (~j)), g, f, e, i, h) 280 | } 281 | 282 | md5_hh = (g, f, k, j, e, i, h) => { 283 | return this.md5_cmn(f ^ k ^ j, g, f, e, i, h) 284 | } 285 | 286 | md5_ii = (g, f, k, j, e, i, h) => { 287 | return this.md5_cmn(k ^ (f | (~j)), g, f, e, i, h) 288 | } 289 | 290 | safe_add = (a, d) => { 291 | var c = (a & 65535) + (d & 65535); 292 | var b = (a >> 16) + (d >> 16) + (c >> 16); 293 | return (b << 16) | (c & 65535) 294 | } 295 | 296 | bit_rol = (a, b) => { 297 | return (a << b) | (a >>> (32 - b)) 298 | } 299 | 300 | } 301 | 302 | module.exports = new Http() -------------------------------------------------------------------------------- /小程序 商城/utils/pro.js: -------------------------------------------------------------------------------- 1 | let price, market, buyNum, list = [] 2 | for(let i=1; i<11; i++) { 3 | price = Math.random()*100 4 | market = Math.random()*10 + price 5 | buyNum = Math.floor(Math.random()*1000) 6 | 7 | list.push({ 8 | id: i, 9 | title: '商品'+i, 10 | price: price.toFixed(2), 11 | market: market.toFixed(2), 12 | buyNum: buyNum 13 | }) 14 | 15 | } 16 | 17 | module.exports = { 18 | list: list 19 | } -------------------------------------------------------------------------------- /小程序 商城/utils/util.js: -------------------------------------------------------------------------------- 1 | const formatTime = (date) => { 2 | const year = date.getFullYear() 3 | const month = date.getMonth() + 1 4 | const day = date.getDate() 5 | const hour = date.getHours() 6 | const minute = date.getMinutes() 7 | const second = date.getSeconds() 8 | 9 | return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':') 10 | } 11 | 12 | const formatNumber = (n) => { 13 | n = n.toString() 14 | return n[1] ? n : '0' + n 15 | } 16 | 17 | module.exports = { 18 | formatTime: formatTime 19 | } -------------------------------------------------------------------------------- /常用正则匹配/util 3.js: -------------------------------------------------------------------------------- 1 | //使用方法 供参考 : 2 | // 在vue文件中 import { regZh } from '@/js_sdk/liuj-regExp.util.js' 3 | // regZh("要检测的字符串") 4 | 5 | //匹配有没有中文 6 | export const regZh = (str)=> { 7 | return RegExp(/[\u4e00-\u9fa5]+/).test(str) 8 | } 9 | //只允许中文 10 | export const regOnlyZh = (str)=> { 11 | return RegExp(/^[\u4e00-\u9fa5]+$/).test(str) 12 | } 13 | //只允许中文，英文字母，数字 14 | export const regZhEnNum = (str)=> { 15 | return RegExp(/^[\u4e00-\u9fa5A-Za-z0-9]+$/).test(str) 16 | } 17 | //匹配身份证 18 | export const regIDC = (str)=> { 19 | return RegExp(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/).test(str); 20 | } 21 | //匹配手机号 22 | export const regPhone = (str)=> { 23 | return RegExp(/^1[34578]\d{9}$/).test(str); 24 | } 25 | //匹配邮箱格式 26 | export const regEmail = (str)=> { 27 | return RegExp(/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/).test(str); 28 | } 29 | //匹配域名 30 | export const regRealmName = (str)=> { 31 | return RegExp(/[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+\/.?/).test(str) 32 | } 33 | //匹配密码（密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)） 34 | export const regPwd = (str)=> { 35 | return RegExp(/^[a-zA-Z]\w{5,17}$/).test(str) 36 | } 37 | //日期格式 2019-01-12 38 | export const regDate = (str)=> { 39 | return RegExp(/^\d{4}-\d{1,2}-\d{1,2}/).test(str) 40 | } 41 | //匹配空白行 42 | export const regWhiteLine = (str)=>{ 43 | return RegExp(/\n\s*\r/).test(str) 44 | } 45 | //匹配正数、负数、和小数 46 | export const regNum1 = (str)=>{ 47 | return RegExp(/^(\-|\+)?\d+(\.\d+)?$/).test(str) 48 | } 49 | //匹配零和非零开头的数字 50 | export const regNum2 = (str)=>{ 51 | return RegExp(/^(0|[1-9][0-9]*)$/).test(str) 52 | } 53 | //匹配数字 54 | export const regNum3 = (str)=>{ 55 | return RegExp(/^[0-9]*$/).test(str) 56 | } 57 | //匹配m-n位的数字 58 | export const regNum4 = (str)=>{ 59 | return RegExp(/^\d{m,n}$/).test(str) 60 | } 61 | //长度为3-20的所有字符 62 | export const allByte = (str)=>{ 63 | return RegExp(/^.{3,20}$/).test(str) 64 | } 65 | 66 | /* 67 | ------------------------------ 68 | 一、校验数字的表达式 69 | 1 数字： ^[0-9]$ 70 | 2 n位的数字： ^\d{n}$ 71 | 3 至少n位的数字： ^\d{n,}$ 72 | 4 m-n位的数字：^\d{m,n}$ 73 | 5 零和非零开头的数字：^(0|[1-9][0-9]*)$ 74 | 6 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$ 75 | 7 带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$ 76 | 8 正数、负数、和小数：^(\-|\+)?\d+(\.\d+)?$ 77 | 9 有两位小数的正实数：^[0-9]+(.[0-9]{2})?$ 78 | 10 有1~3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$ 79 | 11 非零的正整数：^[1-9]\d*$ 或 ^([1-9][0-9]*){1,3}$ 或 ^\+?[1-9][0-9]*$ 80 | 12 非零的负整数：^\-[1-9][]0-9"*$ 或 ^-[1-9]\d*$ 81 | 13 非负整数：^\d+$ 或 ^[1-9]\d*|0$ 82 | 14 非正整数：^-[1-9]\d*|0$ 或 ^((-\d+)|(0+))$ 83 | 15 非负浮点数：^\d+(\.\d+)?$ 或 ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$ 84 | 16 非正浮点数：^((-\d+(\.\d+)?)|(0+(\.0+)?))$ 或 ^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$ 85 | 17 正浮点数：^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$ 或 ^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$ 86 | 18 负浮点数：^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$ 或 ^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$ 87 | 19 浮点数：^(-?\d+)(\.\d+)?$ 或 ^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$ 88 | 89 | 二、校验字符的表达式 90 | 1 汉字：^[\u4e00-\u9fa5]{0,}$ 91 | 2 英文和数字：^[A-Za-z0-9]+$ 或 ^[A-Za-z0-9]{4,40}$ 92 | 3 长度为3-20的所有字符：^.{3,20}$ 93 | 4 由26个英文字母组成的字符串：^[A-Za-z]+$ 94 | 5 由26个大写英文字母组成的字符串：^[A-Z]+$ 95 | 6 由26个小写英文字母组成的字符串：^[a-z]+$ 96 | 7 由数字和26个英文字母组成的字符串：^[A-Za-z0-9]+$ 97 | 8 由数字、26个英文字母或者下划线组成的字符串：^\w+$ 或 ^\w{3,20}$ 98 | 9 中文、英文、数字包括下划线：^[\u4E00-\u9FA5A-Za-z0-9_]+$ 99 | 10 中文、英文、数字但不包括下划线等符号：^[\u4E00-\u9FA5A-Za-z0-9]+$ 或 ^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$ 100 | 11 可以输入含有^%&',;=?$\"等字符：[^%&',;=?$\x22]+ 101 | 12 禁止输入含有~的字符：[^~\x22]+ 102 | 103 | 三、特殊需求表达式 104 | 1 Email地址：^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$ 105 | 2 域名：[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+/.? 106 | 3 InternetURL：[a-zA-z]+://[^\s]* 或 ^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$ 107 | 4 手机号码：^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$ 108 | 5 电话号码("XXX-XXXXXXX"、"XXXX-XXXXXXXX"、"XXX-XXXXXXX"、"XXX-XXXXXXXX"、"XXXXXXX"和"XXXXXXXX)：^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$ 109 | 6 国内电话号码(0511-4405222、021-87888822)：\d{3}-\d{8}|\d{4}-\d{7} 110 | 7 身份证号(15位、18位数字)：^\d{15}|\d{18}$ 111 | 8 短身份证号码(数字、字母x结尾)：^([0-9]){7,18}(x|X)?$ 或 ^\d{8,18}|[0-9x]{8,18}|[0-9X]{8,18}?$ 112 | 9 帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$ 113 | 10 密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)：^[a-zA-Z]\w{5,17}$ 114 | 11 强密码(必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间)：^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$ 115 | 12 日期格式：^\d{4}-\d{1,2}-\d{1,2} 116 | 13 一年的12个月(01～09和1～12)：^(0?[1-9]|1[0-2])$ 117 | 14 一个月的31天(01～09和1～31)：^((0?[1-9])|((1|2)[0-9])|30|31)$ 118 | 16 1.有四种钱的表示形式我们可以接受:"10000.00" 和 "10,000.00", 和没有 "分" 的 "10000" 和 "10,000"：^[1-9][0-9]*$ 119 | 17 2.这表示任意一个不以0开头的数字,但是,这也意味着一个字符"0"不通过,所以我们采用下面的形式：^(0|[1-9][0-9]*)$ 120 | 18 3.一个0或者一个不以0开头的数字.我们还可以允许开头有一个负号：^(0|-?[1-9][0-9]*)$ 121 | 19 4.这表示一个0或者一个可能为负的开头不为0的数字.让用户以0开头好了.把负号的也去掉,因为钱总不能是负的吧.下面我们要加的是说明可能的小数部分：^[0-9]+(.[0-9]+)?$ 122 | 20 5.必须说明的是,小数点后面至少应该有1位数,所以"10."是不通过的,但是 "10" 和 "10.2" 是通过的：^[0-9]+(.[0-9]{2})?$ 123 | 21 6.这样我们规定小数点后面必须有两位,如果你认为太苛刻了,可以这样：^[0-9]+(.[0-9]{1,2})?$ 124 | 22 7.这样就允许用户只写一位小数.下面我们该考虑数字中的逗号了,我们可以这样：^[0-9]{1,3}(,[0-9]{3})*(.[0-9]{1,2})?$ 125 | 23 8.1到3个数字,后面跟着任意个 逗号+3个数字,逗号成为可选,而不是必须：^([0-9]+|[0-9]{1,3}(,[0-9]{3})*)(.[0-9]{1,2})?$ 126 | 24 备注：这就是最终结果了,别忘了"+"可以用"*"替代如果你觉得空字符串也可以接受的话(奇怪,为什么?)最后,别忘了在用函数时去掉去掉那个反斜杠,一般的错误都在这里 127 | 25 xml文件：^([a-zA-Z]+-?)+[a-zA-Z0-9]+\\.[x|X][m|M][l|L]$ 128 | 26 中文字符的正则表达式：[\u4e00-\u9fa5] 129 | 27 双字节字符：[^\x00-\xff] (包括汉字在内，可以用来计算字符串的长度(一个双字节字符长度计2，ASCII字符计1))28 空白行的正则表达式：\n\s*\r (可以用来删除空白行) 130 | 29 HTML标记的正则表达式：<(\S*?)[^>]*>.*?|<.*? /> (网上流传的版本太糟糕，上面这个也仅仅能部分，对于复杂的嵌套标记依旧无能为力)30 首尾空白字符的正则表达式：^\s*|\s*$或(^\s*)|(\s*$) (可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等)，非常有用的表达式) 131 | 31 腾讯QQ号：[1-9][0-9]{4,} (腾讯QQ号从10000开始) 132 | 32 中国邮政编码：[1-9]\d{5}(?!\d) (中国邮政编码为6位数字) 133 | 33 IP地址：\d+\.\d+\.\d+\.\d+ (提取IP地址时有用)34 IP地址：((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)) 134 | 34 "^\d+$" //非负整数（正整数 + 0） 135 | 35 "^[0-9]*[1-9][0-9]*$" //正整数 136 | 36 "^((-\d+)|(0+))$" //非正整数（负整数 + 0） 137 | 37 "^-[0-9]*[1-9][0-9]*$" //负整数 138 | 38 "^-?\d+$" //整数 139 | 39 "^\d+(\.\d+)?$" //非负浮点数（正浮点数 + 0） 140 | 40 "^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$" //正浮点数 141 | 41 "^((-\d+(\.\d+)?)|(0+(\.0+)?))$" //非正浮点数（负浮点数 + 0） 142 | 42 "^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$" //负浮点数 143 | 43 "^(-?\d+)(\.\d+)?$" //浮点数 144 | 44 "^[A-Za-z]+$" //由26个英文字母组成的字符串 145 | 45"^[A-Z]+$" //由26个英文字母的大写组成的字符串 146 | 46 "^[a-z]+$" //由26个英文字母的小写组成的字符串 147 | 47 "^[A-Za-z0-9]+$" //由数字和26个英文字母组成的字符串 148 | 48 "^\w+$" //由数字、26个英文字母或者下划线组成的字符串 149 | 49 "^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$" //email地址 150 | 50 "^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$" //url 151 | 整数或者小数：^[0-9]+\.{0,1}[0-9]{0,2}$ 152 | 只能输入数字："^[0-9]*$"。 153 | 只能输入n位的数字："^\d{n}$"。 154 | 只能输入至少n位的数字："^\d{n,}$"。 155 | 只能输入m~n位的数字：。"^\d{m,n}$" 156 | 只能输入零和非零开头的数字："^(0|[1-9][0-9]*)$"。 157 | 只能输入有两位小数的正实数："^[0-9]+(.[0-9]{2})?$"。 158 | 只能输入有1~3位小数的正实数："^[0-9]+(.[0-9]{1,3})?$"。 159 | 只能输入非零的正整数："^\+?[1-9][0-9]*$"。 160 | 只能输入非零的负整数："^\-[1-9][]0-9"*$。 161 | 只能输入长度为3的字符："^.{3}$"。 162 | 只能输入由26个英文字母组成的字符串："^[A-Za-z]+$"。 163 | 只能输入由26个大写英文字母组成的字符串："^[A-Z]+$"。 164 | 只能输入由26个小写英文字母组成的字符串："^[a-z]+$"。 165 | 只能输入由数字和26个英文字母组成的字符串："^[A-Za-z0-9]+$"。 166 | 只能输入由数字、26个英文字母或者下划线组成的字符串："^\w+$"。 167 | 验证用户密码："^[a-zA-Z]\w{5,17}$"正确格式为：以字母开头，长度在6~18之间，只能包含字符、数字和下划线。 168 | 验证是否含有^%&'',;=?$\"等字符："[^%&'',;=?$\x22]+"。 169 | 只能输入汉字："^[\u4e00-\u9fa5]{0,}$" 170 | 验证Email地址："^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$"。 171 | 验证InternetURL："^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$"。 172 | 验证电话号码："^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$"正确格式为："XXX-XXXXXXX"、"XXXX-XXXXXXXX"、"XXX-XXXXXXX"、"XXX-XXXXXXXX"、"XXXXXXX"和"XXXXXXXX"。 173 | 验证身份证号（15位或18位数字）："^\d{15}|\d{18}$"。 174 | 验证一年的12个月："^(0?[1-9]|1[0-2])$"正确格式为："01"～"09"和"1"～"12"。 175 | 验证一个月的31天："^((0?[1-9])|((1|2)[0-9])|30|31)$"正确格式 176 | 为；"01"～"09"和"1"～"31"。 177 | 整数或者小数：^[0-9]+\.{0,1}[0-9]{0,2}$ 178 | "^\w+$" //由数字、26个英文字母或者下划线组成的字符串 179 | "^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$" //email地址 180 | "^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$" //url 181 | 可输入形如2008、2008-9、2008-09、2008-9-9、2008-09-09. ^(\d{4}|(\d{4}-\d{1,2})|(\d{4}-\d{1,2}-\d{1,2}))$ 182 | 邮箱验证正则表达式 \w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)* 183 | ------------------------------ 184 | */ 185 | -------------------------------------------------------------------------------- /表单验证/common/validate.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | /** 3 | * 数据集合 4 | */ 5 | data: [], 6 | /** 7 | * 错误信息 8 | */ 9 | error: [], 10 | /** 11 | * 默认错误信息 12 | */ 13 | defaultErrorMsg: { 14 | regex: ':attribute不符合验证规则', 15 | require: ':attribute为必填项', 16 | number: ':attribute只能为数字整数', 17 | chn: ':attribute只能为中文汉字', 18 | chnNum: ':attribute只能为中文汉字和数字', 19 | chnOrNum: ':attribute只能为中文汉字或者数字', 20 | alphaLine: ':attribute只能包含英文和下划线，首尾不能是下划线、且不能只是下划线', 21 | landline: ':attribute格式不正确', 22 | mobile: ':attribute格式不正确', 23 | alphaNum: ':attribute只能是字母和数字', 24 | email: ':attribute格式不正确', 25 | zipCode: ':attribute格式不正确', 26 | min: ':attribute长度不能小于:rule位', 27 | max: ':attribute长度不能大于:rule位', 28 | length: ':attribute长度只能在:rule之间', 29 | notbetween: ':attribute 不在 :1 - :2 范围之间', 30 | in: ':attribute只能在:rule范围内', 31 | notIn: ':attribute不能能在:rule范围内', 32 | different: ':attribute不能与:rule相同', 33 | gt: ':attribute必须大于:rule', 34 | egt: ':attribute必须大于或等于:rule', 35 | elt: ':attribute必须小于或等于:rule', 36 | lt: ':attribute必须小于:rule', 37 | eq: ':attribute必须等于:rule', 38 | notEq: ':attribute不能与:rule相同' 39 | }, 40 | /** 41 | * 验证类型别名 42 | */ 43 | alias: { 44 | '>': 'gt', 45 | '>=': 'egt', 46 | '<': 'lt', 47 | '<=': 'elt', 48 | '=': 'eq', 'same': 'eq', 49 | '!=': 'notEq', '<>': 'notEq' 50 | }, 51 | /** 52 | * 查找别名 53 | */ 54 | getAlias(value, compare = (a, b) => a === b) { 55 | var result = Object.keys(this.alias).find(k => compare(this.alias[k], value)) 56 | if (typeof result == 'undefined') { 57 | var result = this.alias[value]; 58 | } 59 | return result; 60 | }, 61 | 62 | /** 63 | * 开始验证 64 | * @param {Object} data 65 | * @param {Object} param 66 | */ 67 | check(data, param) { 68 | // 避免再次验证后出现重复错误信息 69 | this.error = []; 70 | this.data = data; 71 | 72 | for (var i = 0; i < param.length; i++) { 73 | // 字段name 74 | var name = param[i].name; 75 | // 字段中文名称 76 | var nameChn = param[i].nameChn; 77 | // 字段数据 78 | var value = data[name]; 79 | // 规则列表 80 | var rules = param[i].rules; 81 | // 自定义错误信息 82 | var errorMsg = param[i].errorMsg; 83 | 84 | for (let index in rules) { 85 | if (rules.indexOf('require') < 0) { 86 | // 必填项 87 | if (!this.checkResult('require', value)) { 88 | continue; 89 | } 90 | } 91 | 92 | if (!this.checkResult(rules[index], value)) { 93 | // 验证未通过返回错误信息 94 | this.buildError(name, nameChn, rules[index], errorMsg); 95 | } 96 | } 97 | } 98 | 99 | // 验证结果 100 | return JSON.stringify(this.error) == '[]' ? true : false; 101 | }, 102 | 103 | /** 104 | * 构建错误信息 105 | */ 106 | buildError(name, nameChn = '', rule, errorMsg = '') { 107 | // 获取rule中 名称、范围 108 | if (typeof rule == 'object') { 109 | // 数组格式 110 | var ruleName = rule[0]; 111 | if (rule[1]) { 112 | var ruleValue = rule[1]; 113 | } else { 114 | var ruleValue = ''; 115 | } 116 | } else { 117 | // 字符串格式 118 | if (rule.indexOf(':') > -1) { 119 | var ruleArray = rule.split(':'); 120 | var ruleName = ruleArray[0]; 121 | var ruleValue = ruleArray[1]; 122 | } else { 123 | var ruleName = rule; 124 | var ruleValue = ''; 125 | } 126 | } 127 | 128 | if (errorMsg !== '') { 129 | // 使用自定义错误信息 130 | if (!errorMsg[ruleName]) { 131 | // 规则中有不存在的自定义信息 132 | if (typeof this.getAlias(ruleName) != 'undefined') { 133 | // 别名 134 | this.error.push(errorMsg[this.getAlias(ruleName)]); 135 | return; 136 | } 137 | } else { 138 | // 所有规则自定义信息都存在 139 | this.error.push(errorMsg[ruleName]); 140 | return; 141 | } 142 | } 143 | 144 | // 组合替换需要的数组格式 145 | if (String(ruleValue).indexOf(',') > -1) { 146 | // 范围内的数组格式 147 | var ruleValueArray = ruleValue.split(','); 148 | ruleValueArray.push(''); 149 | } else { 150 | var ruleValueArray = ['', '', '']; 151 | } 152 | 153 | // 替换开始 154 | var defaultErrorMsg = this.defaultErrorMsg[ruleName]; 155 | defaultErrorMsg = defaultErrorMsg.replace(/(:attribute|:rule|:1|:2)/g, ($0, $1) => { 156 | return { 157 | // 可自定义字段中文名称 158 | ':attribute': nameChn != '' ? nameChn : name, 159 | ':rule': ruleValue, 160 | ':1': ruleValueArray[0], 161 | ':2': ruleValueArray[1], 162 | }[$1]; 163 | }); 164 | 165 | // 替换完成 166 | // this.error[name] = [defaultErrorMsg]; 167 | this.error.push(defaultErrorMsg); 168 | }, 169 | 170 | getError() { 171 | return this.error; 172 | }, 173 | 174 | /** 175 | * 验证结果 176 | * @param {Object} rule 177 | * @param {Object} value 178 | */ 179 | checkResult(rule, value) { 180 | switch (rule) { 181 | case 'require': 182 | // 必须项 183 | return !(!value || String(value).length < 1); 184 | break; 185 | case 'number': 186 | // 数值 187 | return this.regex(/^-?[1-9][0-9]?.?[0-9]*$/, String(value)); 188 | break; 189 | case 'integer': 190 | // 整数 191 | return this.regex(/(^[1-9]\d*$)/, String(value)); 192 | break; 193 | case 'float': 194 | // 浮点数 195 | return this.regex(/^(-?\\d+)(\\.\\d+)?$/, String(value)); 196 | break; 197 | case 'chn': 198 | // 中文 199 | return this.regex(/^[\u4e00-\u9fa5]+$/u, decodeURI(value)); 200 | break; 201 | case 'chnNum': 202 | // 同时包含数字和汉字 203 | return this.regex(/^[0-9\u4e00-\u9fa5]+$/u, decodeURI(value)); 204 | break; 205 | case 'chnOrNum': 206 | // 包含汉字或者数字 207 | return this.regex(/^[\u4e00}-\u9fa5]+|[0-9]+$/u, decodeURI(value)); 208 | break; 209 | case 'alphaLine': 210 | // 英文和下划线，首尾不能是下划线、且不能只是下划线 211 | return (value.slice(0, 1) != '_' && value.slice(-1) != '_' && this.regex(/^[A-Za-z\_]+$/, value)); 212 | break; 213 | case 'landline': 214 | // 固定电话号 215 | return this.regex(/^(\+\d{2}-)?0\d{2,3}-\d{7,8}|(\+\d{2}-)?\(0\d{2,3}\)\d{7,8}$/, decodeURI(value)); 216 | break; 217 | case 'mobile': 218 | // 手机号 219 | return this.regex(/^1[345789]\d{9}$/, parseInt(decodeURI(value))); 220 | break; 221 | case 'alphaNum': 222 | // 字母和数字 223 | return this.regex(/^[a-zA-Z]+|[0-9]+$/, value); 224 | break; 225 | case 'email': 226 | // 电子邮箱 227 | return this.regex(/^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, value); 228 | break; 229 | case 'zipCode': 230 | // 邮政编码 231 | return this.regex(/^[0-9]{6}$/, value); 232 | break; 233 | default: 234 | // 带范围验证 235 | if (typeof rule == 'string' && rule.indexOf(':') > -1) { 236 | // 字符串格式 237 | var ruleArr = rule.split(':'); 238 | } 239 | if (typeof rule == 'object') { 240 | // 数组格式 241 | var ruleArr = rule; 242 | } 243 | if (typeof this[ruleArr[0]] != 'function') { 244 | // 别名转换 245 | ruleArr[0] = this.getAlias(ruleArr[0]); 246 | } 247 | return this[ruleArr[0]](ruleArr[1], value); 248 | } 249 | }, 250 | 251 | /** 252 | * 正则 253 | * @param {Object} rule 254 | * @param {Object} value 255 | */ 256 | regex(rule, value) { 257 | var pattern = new RegExp(rule); 258 | return pattern.test(value); 259 | }, 260 | 261 | /** 262 | * 长度不能小于 263 | * @param {Object} rule 264 | * @param {Object} value 265 | */ 266 | min(rule, value) { 267 | return String(value).length >= rule; 268 | }, 269 | 270 | /** 271 | * 长度不能大于 272 | * @param {Object} rule 273 | * @param {Object} value 274 | */ 275 | max(rule, value) { 276 | return String(value).length <= rule; 277 | }, 278 | 279 | /** 280 | * 长度范围内 281 | * @param {Object} rule 282 | * @param {Object} value 283 | */ 284 | length(rule, value) { 285 | var length = String(value).length; 286 | if (String(rule).indexOf(',') > -1) { 287 | // 区间 288 | [min, max] = rule.split(','); 289 | return length >= min && length <= max; 290 | } else { 291 | // 固定 292 | return length == rule; 293 | } 294 | }, 295 | 296 | /** 297 | * 不在范围之间 298 | * @param {Object} rule 299 | * @param {Object} value 300 | */ 301 | notbetween(rule, value) { 302 | if (String(rule).indexOf(',') > -1) { 303 | [min, max] = rule.split(','); 304 | return value < min || value > max; 305 | } 306 | return false; 307 | }, 308 | 309 | /** 310 | * 数据范围内 311 | * @param {Object} rule a,b,c多个包含 312 | * @param {Object} value 313 | */ 314 | in(rule, value) { 315 | return rule.split(',').includes(value); 316 | }, 317 | 318 | /** 319 | * 数组不在范围内 320 | * @param {Object} rule 321 | * @param {Object} value 322 | */ 323 | notIn(rule, value) { 324 | return !rule.split(',').includes(value); 325 | }, 326 | 327 | /** 328 | * 字段相同 329 | * @param {Object} rule 330 | * @param {Object} value 331 | */ 332 | identical(rule, value) { 333 | return this.data[rule] === value; 334 | }, 335 | 336 | /** 337 | * 字段不相同 338 | * @param {Object} rule 339 | * @param {Object} value 340 | */ 341 | different(rule, value) { 342 | return this.data[rule] != value; 343 | }, 344 | 345 | /** 346 | * 大于某值 347 | * @param {Object} rule 348 | * @param {Object} value 349 | */ 350 | gt(rule, value) { 351 | return Number(value) > rule; 352 | }, 353 | 354 | /** 355 | * 大于或等于某值 356 | * @param {Object} rule 357 | * @param {Object} value 358 | */ 359 | egt(rule, value) { 360 | return Number(value) >= rule; 361 | }, 362 | 363 | /** 364 | * 小于或等于某值 365 | * @param {Object} rule 366 | * @param {Object} value 367 | */ 368 | elt(rule, value) { 369 | return Number(value) <= rule; 370 | }, 371 | 372 | /** 373 | * 小于某值 374 | * @param {Object} rule 375 | * @param {Object} value 376 | */ 377 | lt(rule, value) { 378 | return Number(value) < rule; 379 | }, 380 | 381 | /** 382 | * 等于某值 383 | * @param {Object} rule 384 | * @param {Object} value 385 | */ 386 | eq(rule, value) { 387 | return Number(value) == rule; 388 | }, 389 | 390 | /** 391 | * 不等于某值 392 | * @param {Object} rule 393 | * @param {Object} value 394 | */ 395 | notEq(rule, value) { 396 | return Number(value) != rule; 397 | } 398 | }; 399 | -------------------------------------------------------------------------------- /表单验证/readme.md: -------------------------------------------------------------------------------- 1 | ## 表单验证/数据验证/强大灵活验证 2 | 3 | ### 家族成员 4 | 5 | [【actionSheet弹窗/底部菜单/底部弹出/底部弹出层】](https://ext.dcloud.net.cn/plugin?id=2304) 6 |
7 | [【全局modal弹窗/可覆盖原生/弹出层/alert】](https://ext.dcloud.net.cn/plugin?id=2280) 8 |
9 | 欢迎下载匹配使用，统一度更强 10 | 11 | ### 插件亮点 12 | 13 | 1、支持批量方法检查
14 | 2、支持单一方法检查
15 | 3、支持每个字段自由设置检查规则
16 | 4、可单独某个字段下某个规则自定义错误信息
17 | 18 | ### 在你的项目中使用 19 | 20 | 1、将common复制到你的common下
21 | 2、在需要使用的页面