From c300654f9c8e285c91a4228cd1007d6d567befda Mon Sep 17 00:00:00 2001 From: mullins <476823686@qq.com> Date: Thu, 21 May 2020 10:28:48 +0800 Subject: [PATCH] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E9=83=A8=E5=88=86=E5=8A=9F?= =?UTF-8?q?=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 17 ++- .../HMFilterDropdown/HMFilterDropdown.vue | 132 ++++++++++------- src/pages/detailsChoiceArgs/detailsChoiceArgs.vue | 12 +- src/pages/index/index.vue | 156 +++++++++------------ src/store/modules/categoryOrder.js | 40 ------ src/store/modules/index.js | 95 +++++++++++++ src/store/modules/user.js | 2 + src/store/request.js | 1 - src/store/url.js | 12 +- 9 files changed, 264 insertions(+), 203 deletions(-) delete mode 100644 src/store/modules/categoryOrder.js create mode 100644 src/store/modules/index.js diff --git a/src/App.vue b/src/App.vue index 62f620c..62b0b6f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -7,13 +7,13 @@ onLaunch(options) { const option = options || {}; // 获取用户来源 - console.log('软件启动，输出转来的参数:', option); - console.log('场景值------------------:', option.scene); + // console.log('软件启动，输出转来的参数:', option); + // console.log('场景值------------------:', option.scene); let loginQueryInfo = option ? option.query : {}; loginQueryInfo = loginQueryInfo || {}; - console.log('loginQueryInfo onShow===>', loginQueryInfo); + // console.log('loginQueryInfo onShow===>', loginQueryInfo); const scene = decodeURIComponent(loginQueryInfo.scene); - console.log('decodeURIComponent scense====>', scene); + // console.log('decodeURIComponent scense====>', scene); let fromInfo = {}; if(scene.length > 0 ) { @@ -35,9 +35,9 @@ scene: option.scene, } store.dispatch('user/setFrom', fromInfo); - console.log('loginQueryInfo.hasOwnProperty=====111===>', getQueryString); + // console.log('loginQueryInfo.hasOwnProperty=====111===>', getQueryString); } else { - console.log('loginQueryInfo.hasOwnProperty====22222====>', loginQueryInfo); + // console.log('loginQueryInfo.hasOwnProperty====22222====>', loginQueryInfo); if (loginQueryInfo.hasOwnProperty('sid') == false) { loginQueryInfo.sid = 0; } @@ -67,11 +67,10 @@ } }, onShow() { - - console.log('App Show') + // console.log('App Show') }, onHide() { - console.log('App Hide') + // console.log('App Hide') }, methods: { } diff --git a/src/components/HMFilterDropdown/HMFilterDropdown.vue b/src/components/HMFilterDropdown/HMFilterDropdown.vue index 5c8e973..19cc811 100644 --- a/src/components/HMFilterDropdown/HMFilterDropdown.vue +++ b/src/components/HMFilterDropdown/HMFilterDropdown.vue @@ -2,9 +2,25 @@ - + + {{item.name}} + + + {{item.name}} - @@ -101,7 +117,8 @@ firstScrollInto: 0, secondScrollInto: 0, componentTop:0 ,//组件top - isReadNewSelect:false + isReadNewSelect:false, + on: [1,0,0,0,0], } }, props: { @@ -136,9 +153,9 @@ this.defaultActive = JSON.parse(JSON.stringify(newVal)); this.activeMenuArr = JSON.parse(JSON.stringify(newVal)); this.shadowActiveMenuArr = JSON.parse(JSON.stringify(newVal)); - if(this.updateMenuName){ - this.setMenuName(); - } + // if(this.updateMenuName){ + // this.setMenuName(); + // } } }, methods: { @@ -150,53 +167,54 @@ tmpMenu.push({ //如果没有设置name，则取第一个菜单作为menu.name,filter类型则将"筛选"作为menu.name name: tmpitem.name || (tmpitem.type == "filter" ? "筛选" : tmpitem.submenu[0].name), - type: tmpitem.type + type: tmpitem.type, + isNoPull: tmpitem.isNoPull, }); - //初始化选中项数组-ui状态 + // 初始化选中项数组-ui状态 tmpMenuActiveArr.push(this.processActive(tmpitem)); - //初始化角度数组 + // 初始化角度数组 this.triangleDeg.push(0); - //初始化控制显示状态数组 + // 初始化控制显示状态数组 this.pageState.push(false); - //递归处理子菜单数据 + // 递归处理子菜单数据 tmpitem = this.processSubMenu(tmpitem); this.filterData[i] = tmpitem; } this.menu = tmpMenu; - //初始化选中项数组 + // 初始化选中项数组 tmpMenuActiveArr = this.defaultActive.length>0?this.defaultActive:this.activeMenuArr.length>0?this.activeMenuArr:tmpMenuActiveArr; this.defaultActive = []; this.activeMenuArr = JSON.parse(JSON.stringify(tmpMenuActiveArr)); this.shadowActiveMenuArr = JSON.parse(JSON.stringify(tmpMenuActiveArr)); - //加载菜单数据 + // 加载菜单数据 this.subData = this.filterData; - //设定顶部菜单名字 - if(this.updateMenuName){ - this.setMenuName(); - } - }, - setMenuName(){ - for(var i=0;i0 && row[0]!=null){ - tmpsub = this.subData[i].submenu[row[0]]; - if(row.length>1 && row[1]!=null){ - tmpsub = tmpsub.submenu[row[1]]; - if(row.length>2 && row[2]!=null){ - tmpsub = tmpsub.submenu[row[2]]; - } - } - }else{ - tmpsub = false; - } - if(tmpsub){ - this.menu[i].name = tmpsub.name; - } - } - } + // 设定顶部菜单名字 + // if(this.updateMenuName){ + // this.setMenuName(); + // } }, + // setMenuName(){ + // for(var i=0;i0 && row[0]!=null){ + // tmpsub = this.subData[i].submenu[row[0]]; + // if(row.length>1 && row[1]!=null){ + // tmpsub = tmpsub.submenu[row[1]]; + // if(row.length>2 && row[2]!=null){ + // tmpsub = tmpsub.submenu[row[2]]; + // } + // } + // }else{ + // tmpsub = false; + // } + // if(tmpsub){ + // this.menu[i].name = tmpsub.name; + // } + // } + // } + // }, //展开更多 showMoreSub(index) { this.subData[this.showPage].submenu[this.activeMenuArr[this.showPage][0]].submenu[index].showAllSub = true; @@ -217,9 +235,9 @@ if (level3_index != null || level2_index != null || (level1_index != null && this.subData[page_index].submenu[level1_index].submenu.length == 0) ) { let sub = this.subData[page_index].submenu[level1_index].submenu[level2_index]; - if(this.updateMenuName){ - this.menu[page_index].name = (level3_index != null && sub.submenu[level3_index].name) || (level2_index != null && sub.name) || this.subData[page_index].submenu[level1_index].name; - } + // if(this.updateMenuName){ + // this.menu[page_index].name = (level3_index != null && sub.submenu[level3_index].name) || (level2_index != null && sub.name) || this.subData[page_index].submenu[level1_index].name; + // } this.shadowActiveMenuArr[page_index] = JSON.parse(JSON.stringify(this.activeMenuArr[page_index])); this.togglePage(this.showPage); } @@ -286,6 +304,19 @@ this.showPageLayer(index); this.showMask(); } + if(this.on[0] === 1) { + this.on[0] = 0; + } + this.on[index] = 1; + }, + showAll() { + this.on = [1,0,0,0,0] + // 输出 + this.$emit('search', { + index: {}, + value: {}, + on: this.on, + }); }, //hide遮罩层 hideMask() { @@ -343,8 +374,7 @@ }); }else{ let submenu = this.subData[i].submenu[item[0]]; - // console.log(this.subData[i]) - value[i][0] = submenu.value; + value[i][0] = submenu && submenu.value; if(value[i].length>=2 && item[1]!=null){ if(submenu.submenu.length>0){ submenu = submenu.submenu[item[1]]; @@ -366,9 +396,10 @@ }); // 输出 - this.$emit('confirm', { + this.$emit('search', { index: index, - value: value + value: value, + on: this.on, }); }, //show菜单页 @@ -515,13 +546,12 @@ .nav { width: 100%; height: 44px; - border-bottom: solid 1rpx #eee; z-index: 12; background-color: #ffffff; flex-direction: row; .first-menu { width: 100%; - font-size: 13px; + font-size: 16px; color: #333333; flex-direction: row; align-items: center; @@ -537,6 +567,7 @@ } .name { height: 20px; + // font-size: 16px; text-align: center; text-overflow: clip; overflow: hidden; @@ -544,6 +575,7 @@ .iconfont { width: 13px; height: 13px; + line-height: 16px; align-items: center; justify-content: center; transition: transform .2s linear, color .2s linear; @@ -605,7 +637,7 @@ } &.alone { max-height: 345px; - min-height: 170px; + min-height: 60rpx; height: auto; .sub-menu { min-height: calc(44px - 1rpx); @@ -788,4 +820,4 @@ } } } - + diff --git a/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue b/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue index 960af37..c4bed99 100644 --- a/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue +++ b/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue @@ -16,12 +16,6 @@ - - - - - - 填写验光数据 @@ -157,7 +151,11 @@ - + + + + + 立即结算 diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index fd8242c..1430d65 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -4,11 +4,17 @@ - + - + - @@ -91,20 +98,21 @@ export default { }, data() { return { - screenItems: [ - { current: 0, text: "全部", hasIcon: false }, - { current: 1, text: "销量", hasIcon: false }, - { current: 2, text: "价格", hasIcon: true }, - { current: 3, text: "折扣", hasIcon: false }, - { current: 4, text: "筛选", hasIcon: true } - ], - current: 0, - showRight: false, + // screenItems: [ + // { current: 0, text: "全部", hasIcon: false }, + // { current: 1, text: "销量", hasIcon: false }, + // { current: 2, text: "价格", hasIcon: true }, + // { current: 3, text: "折扣", hasIcon: false }, + // { current: 4, text: "筛选", hasIcon: true } + // ], + // current: 0, + // showRight: false, indexArr: "", valueArr: "", loadingText: "~~到底了~~", filterDropdownValue: [], filterData: [], + searchText: '', // goodsList:[ // { goods_id: 0, img: "/static/img/goods/p1.jpg", name: '镜片',originCost:'￥198',price: '￥168', slogan:'1235人浏览',goodType:1 }, // { goods_id: 1, img: '/static/img/goods/p2.jpg', name: '镜框',originCost:'￥198',price: '￥168', slogan:'1235人浏览',goodType:2 }, @@ -120,62 +128,12 @@ export default { }; }, computed: { - goodsList() { - // 也可以从 getters 获取 - return this.$store.state.test.list; - }, + goodsList() { + // 也可以从 getters 获取 + return this.$store.state.index.list; + }, categoryList(){ - // console.log(this.$store.state.categoryOrder.categoryList); - const categoryList = this.$store.state.categoryOrder.categoryList - let newData = [ - { - "name":'产品', - "type": 'filter', - "submenu": [{ - "submenu": [ - - ] - }, - ], - }, - { - "name":'品牌', - "type": 'filter', - "submenu": [{ - "submenu": [ - ] - }, - ] - }, - { - "name":'使用场景', - "type": 'filter', - "submenu": [{ - "submenu": [ - ] - } - ] - }, - { - "name":'材质', - "type": 'filter', - "submenu": [{ - "submenu": [ - ] - } - ] - }, - { - "name":'筛选', - "type": 'filter', - "submenu": [{ - // "name": "折扣(多选)", - "submenu": [ - ] - } - ] - } - ] + return this.$store.state.index.categoryList; // newData[0].submenu[0].submenu = categoryList[0].submenu // newData[1].submenu[0].submenu = categoryList[3].submenu[5].submenu // newData[2].submenu[0].submenu = categoryList[3].submenu[2].submenu @@ -183,26 +141,29 @@ export default { // newData[4].submenu[0] = categoryList[3] this.filterData = newData; // this.filterData = categoryList; - } - + }, }, filters: { outData(value) { return JSON.stringify(value); } }, - onLoad: function() { - store.dispatch('test/fetch'); - store.dispatch('categoryOrder/fetch') - - // 登陆 - // store.dispatch('user/login') - + onLoad() { + console.log('onload') + store.dispatch('index/category'); + // this.getList(); + store.dispatch('index/list'); }, methods: { showDrawer(e) { this.$refs[e].open(); }, + getList() { + store.dispatch('index/list'); + }, + // search(params) { + // this.$store.index. + // }, closeDrawer(e) { this.$refs[e].close(); }, @@ -217,16 +178,35 @@ export default { dropDown() { console.log("下拉"); }, + searchKey(e) { + const { value: keyword } = e.detail; + this.keyWords = keyword; + console.log('e', e, keyword); + store.dispatch('index/search', { + params: {}, + keyword, + }); + }, //接收菜单结果 - confirm(e) { - this.indexArr = e.index; - this.valueArr = e.value; - return; - console.log("修改菜单"); - this.filterData[4].submenu[1] = { - name: "项目2", - submenu: [] - }; + search(e) { + console.log("修改菜单-----", e, this.categoryList); + const { on, value, index } = e; + let params = {} + if(on[0] === 1) { + this.searchText = ''; + store.dispatch('index/list'); + } else { + for(let i = 1; i<=on.length; i++){ // on[0]是全部 + if(on[i] === 1) { // 若该选项被选中 + console.log('---', `${this.categoryList[i].value}`); + params[`${this.categoryList[i].value}`] = value[i][0]; + } + } + store.dispatch('index/search', { + params, + keyword: this.keyWords + }); + } } }, diff --git a/src/store/modules/categoryOrder.js b/src/store/modules/categoryOrder.js deleted file mode 100644 index fbfb4b0..0000000 --- a/src/store/modules/categoryOrder.js +++ /dev/null @@ -1,40 +0,0 @@ - import urlAlias from '../url'; - import request from '../request'; - - const { - category - } = urlAlias; - -const state = { - categoryList: [], -}; - -const mutations = { - INIT: (state, categoryList) => { - state.categoryList = categoryList; - }, -}; - -const actions = { - fetch({ commit }, param) { - request({ - url: category, - success: (res) => { - commit('INIT', res.data.data) - }, - fail: (res) => { - console.log("fail status === > ", res); - }, - complete: (res) => { - console.log("complete status === > ", res); - }, - }) - }, -}; - -export default { - namespaced: true, - state, - mutations, - actions, -}; diff --git a/src/store/modules/index.js b/src/store/modules/index.js new file mode 100644 index 0000000..6444492 --- /dev/null +++ b/src/store/modules/index.js @@ -0,0 +1,95 @@ + import urlAlias from '../url'; + import request from '../request'; + + const { + category, + shopList, + search, + } = urlAlias; + +const state = { + categoryList: [], + list: [], +}; + +const mutations = { + LIST: (state, list) => { + state.list = list; + }, + CATEGORY: (state, categoryList) => { + state.categoryList = categoryList; + }, +}; + +const actions = { + category({ commit }, param) { + request({ + url: category, + success: (res) => { + console.log('category', res); + let data = res.data.data; + for(let i = 0; i<=data.length; i++) { + if(data[i] && data[i].type !== 'filter'){ + data[i].type = 'hierarchy'; + } + } + data.unshift({ + type: "hierarchy", + name: "全部", + value: "all", + isNoPull: true, + }); + commit('CATEGORY', data); + }, + fail: (res) => { + console.log("fail status === > ", res); + }, + complete: (res) => { + console.log("complete status === > ", res); + }, + }) + }, + list({ commit }, param) { + request({ + url: shopList, + success: (res) => { + commit('LIST', res.data.data) + }, + fail: (res) => { + console.log("fail status === > ", res); + }, + complete: (res) => { + console.log("complete status === > ", res); + }, + }) + }, + search({ commit }, { params, keyword }) { + const uid = uni.getStorageSync('uid'); + console.log("params",params, keyword); + request({ + url: search, + data: { + params: JSON.stringify(params), + uid, + way: 1, + keyword, + }, + success: (res) => { + commit('LIST', res.data.data); + }, + fail: (res) => { + console.log("fail status === > ", res); + }, + complete: (res) => { + console.log("complete status === > ", res); + }, + }) + } +}; + +export default { + namespaced: true, + state, + mutations, + actions, +}; diff --git a/src/store/modules/user.js b/src/store/modules/user.js index ae0128e..7c3711b 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -73,6 +73,7 @@ const actions = { success: (res) => { console.log('userInfo=====', res); const { data: { data: { uid, username: nickName, openid, headerphoto } } } = res; + uni.setStorageSync('uid', uid); const userInfo = { uid, openid, @@ -112,6 +113,7 @@ const actions = { success: (res) => { console.log('userInfo=====', res); const { data: { data: { uid, username: nickName, openid, headerphoto } } } = res; + uni.setStorageSync('uid', uid); const userInfo = { uid, openid, diff --git a/src/store/request.js b/src/store/request.js index dd1d799..130385d 100644 --- a/src/store/request.js +++ b/src/store/request.js @@ -18,7 +18,6 @@ export default async function request({ console.log("complete status === > ", res); }, }) { - console.log("DOMAIN", DOMAIN, url); uni .request({ url: DOMAIN + url, diff --git a/src/store/url.js b/src/store/url.js index b4d15cb..23f5895 100644 --- a/src/store/url.js +++ b/src/store/url.js @@ -1,15 +1,11 @@ const urlAlias = { - // 获取首页商品列表 - shopList: '/app/prod/list', - - // 获取首页商品列表 - category: '/app/prod/category2', - // 获取商品信息 - read: '/app/prod/read', + // 获取商品信息 + read: '/app/prod/read', // 首页 shopList: '/app/prod/list', // 获取首页商品列表 - category: '/app/prod/category', // 获取首页商品分类 + category: '/app/prod/category2', // 获取首页商品分类 + search: '/app/prod/search', // 首页搜索商品 // 登陆 login: '/app/glass/getOpenId', // 登陆 -- 2.0.0