Adam / gulu-vue

Download as
Browse Code »

Commit fe62536c349941b0907444090ad0035068e181ac

Authored by 范牧
2 parents 530bb7e836 1dbb125acb
Exists in master

合并冲突

Showing 10 changed files   Show diff stats
src/components/CommodityCard/CommodityCard.vue
Diff comments   View file @fe62536
... ... @@ -77,8 +77,9 @@ image {
77 77 }
78 78 .name {
79 79 width: 92%;
80   - height: 54rpx;
  80 + height: 76rpx;
81 81 padding: 5px 4%;
  82 + box-sizing: border-box;
82 83 display: -webkit-box;
83 84 -webkit-box-orient: vertical;
84 85 -webkit-line-clamp: 2;
... ...
src/components/HMFilterDropdown/HMFilterDropdown.vue
Diff comments   View file @fe62536
... ... @@ -12,7 +12,7 @@
12 12 <view
13 13 class="first-menu"
14 14 :class="{'on':showPage==index || on[index] === 1}"
15   - @tap="togglePage(index)"
  15 + @tap="togglePage(index, false)"
16 16 v-if="!item.isNoPull"
17 17 >
18 18 <text class="name">{{item.name}}</text>
... ... @@ -372,14 +372,14 @@ export default {
372 372 this.$forceUpdate()
373 373 },
374 374 // 菜单开关
375   - togglePage (index) {
  375 + togglePage (index, isRequest = true) {
376 376 if (index === this.showPage) {
377   - this.hidePageLayer(true)
  377 + this.hidePageLayer(true, isRequest)
378 378 this.hideMask()
379 379 this.showPage = -1
380 380 } else {
381 381 if (this.showPage > -1) {
382   - this.hidePageLayer(false)
  382 + this.hidePageLayer(false, isRequest)
383 383 }
384 384 this.showPageLayer(index)
385 385 this.showMask()
... ... @@ -416,14 +416,17 @@ export default {
416 416 })
417 417 },
418 418 // hide菜单页
419   - hidePageLayer (isAnimation) {
  419 + hidePageLayer (isAnimation,isRequset = true) {
420 420 this.triangleDeg[this.showPage] = 0
421 421 const tmpIndex = this.showPage
422 422 if (isAnimation) {
423 423 setTimeout(() => {
424 424 this.pageState.splice(tmpIndex, 1, false)
425   - }, 200)
426   - this.confirm()
  425 + }, 200)
  426 + // debugger
  427 + if(isRequset){
  428 + this.confirm()
  429 + }
427 430 } else {
428 431 this.pageState.splice(tmpIndex, 1, false)
429 432 }
... ... @@ -812,20 +815,21 @@ export default {
812 815 }
813 816 .labels {
814 817 flex-direction: row;
815   - flex-wrap: wrap;
  818 + flex-wrap: wrap;
  819 + justify-content: space-between;
816 820 .on {
817 821 border-color: #ff6b4a;
818 822 background-color: #ff6b4a;
819 823 color: #fff;
820 824 }
821 825 > view {
822   - width: 148rpx;
  826 + width: 220rpx;
823 827 height: 30px;
824 828 border: solid 1rpx #adadad;
825 829 border-radius: 2px;
826   - margin-right: 15px;
  830 + margin-right: 2px;
827 831 margin-top: 8px;
828   - padding: 0 16rpx;
  832 + padding: 0 10rpx;
829 833 box-sizing: border-box;
830 834 font-size: 12px;
831 835 flex-direction: row;
... ...
src/components/sl-filter/filter-view.vue
Diff comments   View file @fe62536
... ... @@ -0,0 +1,475 @@
  1 +<template>
  2 +
  3 + <view>
  4 + <view style="padding: 0px 0px;">
  5 + <view class="filter-content" v-for="(item, index) in menuList" :key="index" v-if="menuIndex == index">
  6 + <view v-if="item.isSort">
  7 + <view class="filter-content-list">
  8 + <view v-for="(detailItem,idx) in selectDetailList" :key="idx" :class="detailItem.isSelected?'filter-content-list-item-active':'filter-content-list-item-default'"
  9 + :style="{'color': detailItem.isSelected?themeColor:'#666666'}" @tap="sortTap(idx,selectDetailList,item.key)">
  10 + <text>{{detailItem.title}}</text>
  11 + </view>
  12 + </view>
  13 + </view>
  14 + <view v-else>
  15 + <view class="filter-content-title" v-if="item.detailTitle && item.detailTitle.length">
  16 + <text>{{item.detailTitle}}</text>
  17 + </view>
  18 + <view class="filter-content-detail">
  19 + <text v-for="(detailItem,idx) in selectDetailList" :key="idx" class='filter-content-detail-item-default' :style="{'background-color':detailItem.isSelected?themeColor:'#FFFFFF','color':detailItem.isSelected?'#FFFFFF':'#666666'}"
  20 + @tap="itemTap(idx,selectDetailList,item.isMutiple,item.key)">
  21 + {{detailItem.title}}
  22 + </text>
  23 + </view>
  24 + <view class="filter-content-footer">
  25 + <view class="filter-content-footer-item" style="color: #777777; background-color: #FFFFFF;" @tap="resetClick(selectDetailList,item.key)">
  26 + <text>重置</text>
  27 + </view>
  28 + <view class="filter-content-footer-item" :style="{'color': '#FFFFFF', 'background-color': themeColor}" @tap="sureClick">
  29 + <text>确定</text>
  30 + </view>
  31 + </view>
  32 + </view>
  33 + </view>
  34 + </view>
  35 + </view>
  36 +
  37 +</template>
  38 +
  39 +<script>
  40 + export default {
  41 + data() {
  42 + return {
  43 + selectArr: [],
  44 + result: {},
  45 + menuIndex: 0,
  46 + selectDetailList: [],
  47 + independenceObj: {},
  48 + selectedKey: '',
  49 + cacheSelectedObj: {},
  50 + defaultSelectedTitleObj: {}
  51 + };
  52 + },
  53 + props: {
  54 + themeColor: {
  55 + type: String,
  56 + default () {
  57 + return '#D1372C'
  58 + }
  59 + },
  60 + menuList: {
  61 + type: Array,
  62 + default () {
  63 + return []
  64 + }
  65 + },
  66 + independence: {
  67 + type: Boolean,
  68 + default: false
  69 + }
  70 + },
  71 + computed: {
  72 + selectedTitleObj() {
  73 + let obj = {}
  74 + for (let i = 0; i < this.menuList.length; i++) {
  75 + let item = this.menuList[i];
  76 + obj[item.key] = item.title;
  77 + }
  78 + return obj;
  79 + },
  80 + defaultSelectedObj() { // 保存初始状态
  81 + return this.getSelectedObj()
  82 + },
  83 + selectedObj: {
  84 + get() {
  85 + return this.getSelectedObj()
  86 + },
  87 + set(newObj) {
  88 + return newObj;
  89 + }
  90 +
  91 + }
  92 + },
  93 + methods: {
  94 + getSelectedObj() {
  95 + let obj = {}
  96 + for (let i = 0; i < this.menuList.length; i++) {
  97 + let item = this.menuList[i];
  98 + if (!this.independence && item.defaultSelectedIndex != null && item.defaultSelectedIndex.toString().length > 0) { // 处理并列菜单默认值
  99 +
  100 + if (item.isMutiple) {
  101 + obj[item.key] = [];
  102 + item.detailList[0].isSelected = false;
  103 + if (!Array.isArray(item.defaultSelectedIndex)) { // 如果默认值不是数组
  104 + item.defaultSelectedIndex = [item.defaultSelectedIndex];
  105 + }
  106 + for (let j = 0; j < item.defaultSelectedIndex.length; j++) { // 将默认选中的值放入selectedObj
  107 + item.detailList[item.defaultSelectedIndex[j]].isSelected = true;
  108 + obj[item.key].push(item.detailList[item.defaultSelectedIndex[j]].value)
  109 + }
  110 +
  111 + } else {
  112 + obj[item.key] = item.detailList[item.defaultSelectedIndex].value;
  113 + this.selectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title;
  114 + this.defaultSelectedTitleObj[item.key] = item.detailList[item.defaultSelectedIndex].title;
  115 + item.detailList[0].isSelected = false;
  116 + item.detailList[item.defaultSelectedIndex].isSelected = true;
  117 + }
  118 + } else {
  119 + if (item.isMutiple) {
  120 + obj[item.key] = [];
  121 + } else {
  122 + obj[item.key] = '';
  123 + }
  124 + }
  125 + }
  126 + this.result = obj;
  127 + return obj;
  128 + },
  129 + // 重置所有选项，包括默认选项，并更新result
  130 + resetAllSelect(callback) {
  131 + let titles = [];
  132 + for (let i = 0; i < this.menuList.length; i++) {
  133 + this.resetSelected(this.menuList[i].detailList,this.menuList[i].key);
  134 + titles[this.menuList[i].key] = this.menuList[i].title;
  135 + }
  136 + let obj = {
  137 + 'result': this.result,
  138 + 'titles': titles,
  139 + 'isReset': true
  140 + }
  141 + this.$emit("confirm", obj);
  142 + callback(this.result);
  143 + },
  144 + // 重置选项为设置的默认值，并更新result
  145 + resetSelectToDefault(callback) {
  146 + for (let i = 0; i < this.menuList.length; i++) {
  147 + this.selectDetailList = this.menuList[i].detailList;
  148 +
  149 + if (this.menuList[i].defaultSelectedIndex) {
  150 + if (Array.isArray(this.menuList[i].defaultSelectedIndex)) { // 把所有默认的为false的点为true
  151 + for (let j = 0; j < this.menuList[i].defaultSelectedIndex.length; j++) {
  152 + if (this.selectDetailList[this.menuList[i].defaultSelectedIndex[j]].isSelected == false) {
  153 + this.itemTap(this.menuList[i].defaultSelectedIndex[j], this.selectDetailList, this.menuList[i].isMutiple, this
  154 + .menuList[i].key)
  155 + }
  156 + }
  157 + } else {
  158 + this.itemTap(this.menuList[i].defaultSelectedIndex, this.selectDetailList, this.menuList[i].isMutiple, this.menuList[
  159 + i].key)
  160 + }
  161 +
  162 + // 获取非默认项的下标
  163 + let unDefaultSelectedIndexArr = this.getUnDefaultSelectedIndex(this.menuList[i])
  164 + // 把所有不是默认的为true的点为false
  165 + for (let j = 0; j < unDefaultSelectedIndexArr.length; j++) {
  166 + if (this.selectDetailList[unDefaultSelectedIndexArr[j]].isSelected == true) {
  167 + this.itemTap(unDefaultSelectedIndexArr[j], this.selectDetailList, this.menuList[i].isMutiple, this
  168 + .menuList[i].key)
  169 + }
  170 + }
  171 + }
  172 +
  173 +
  174 + }
  175 +
  176 + this.selectedObj = this.defaultSelectedObj;
  177 + this.result = this.defaultSelectedObj;
  178 + let obj = {
  179 + 'result': this.result,
  180 + 'titles': this.defaultSelectedTitleObj,
  181 + 'isReset': true
  182 + }
  183 + this.$emit("confirm", obj);
  184 + callback(this.result)
  185 + },
  186 + getUnDefaultSelectedIndex(menuListItem) { // 获取非默认项
  187 + let tempDefault = menuListItem.defaultSelectedIndex;
  188 + if (!Array.isArray(tempDefault)) {
  189 + tempDefault = [tempDefault];
  190 + }
  191 + // 获取所有项的下标 组成新的数组
  192 + let all = [];
  193 + for (let i = 0; i < menuListItem.detailList.length; i++) {
  194 + all.push(i)
  195 + }
  196 + // 将默认选中的数组与所有项的数组的不同值合并为一个新数组
  197 + var unDefaultSelectedIndex = tempDefault.filter(function(v) {
  198 + return !(all.indexOf(v) > -1)
  199 + }).concat(all.filter(function(v) {
  200 + return !(tempDefault.indexOf(v) > -1)
  201 + }));
  202 + return unDefaultSelectedIndex;
  203 + },
  204 + resetMenuList(val) {
  205 + this.menuList = val;
  206 + this.$emit('update:menuList', val)
  207 + },
  208 + menuTabClick(index) {
  209 + this.menuIndex = index;
  210 + this.selectDetailList = this.menuList[index].detailList;
  211 + this.selectedKey = this.menuList[index].key;
  212 + // 如果是独立菜单
  213 + if (this.independence && !this.menuList[index].isSort) {
  214 + if (JSON.stringify(this.independenceObj) == '{}') {
  215 + this.initIndependenceObj(index);
  216 + } else {
  217 + for (let key in this.independenceObj) {
  218 + if (key != this.selectedKey) {
  219 + this.initIndependenceObj(index);
  220 + this.resetSelected(this.menuList[index].detailList, this.selectedKey);
  221 + }
  222 + }
  223 + }
  224 +
  225 + }
  226 + if (this.independence && this.menuList[index].isSort) {
  227 +
  228 + this.independenceObj = {};
  229 +
  230 +
  231 + }
  232 + if (this.independence) {
  233 + let idx = this.menuList[index].defaultSelectedIndex;
  234 + if (idx != null && idx.toString().length > 0) { // 处理独立菜单默认值
  235 + if (this.menuList[index].isMutiple) {
  236 + for (let i = 0; i < idx.length; i++) {
  237 + if (this.menuList[index].detailList[idx[i]].isSelected == false) {
  238 + this.itemTap(idx[i], this.menuList[index].detailList, true, this.selectedKey);
  239 + }
  240 +
  241 + }
  242 + } else {
  243 + if (this.menuList[index].detailList[idx].isSelected == false) {
  244 +
  245 + this.itemTap(idx, this.menuList[index].detailList, false, this.selectedKey);
  246 +
  247 + }
  248 + }
  249 +
  250 + }
  251 + }
  252 +
  253 +
  254 + // #ifdef H5
  255 + this.selectedObj = this.selectedObj;
  256 + this.$forceUpdate();
  257 + // #endif
  258 + },
  259 + initIndependenceObj(index) {
  260 + this.independenceObj = {};
  261 + if (this.menuList[index].isMutiple) {
  262 + this.independenceObj[this.selectedKey] = [];
  263 + } else {
  264 + this.independenceObj[this.selectedKey] = '';
  265 + }
  266 + },
  267 + itemTap(index, list, isMutiple, key) {
  268 + if (isMutiple == true) {
  269 + list[index].isSelected = !list[index].isSelected;
  270 + if (index == 0) {
  271 + this.resetSelected(list, key)
  272 + if (!this.independence) {
  273 + this.selectedTitleObj[key] = list[index].title;
  274 + }
  275 + } else {
  276 + list[0].isSelected = false
  277 + if (list[index].isSelected) {
  278 + if (this.independence) {
  279 + this.independenceObj[this.selectedKey].push(list[index].value);
  280 + } else {
  281 + this.selectedObj[key].push(list[index].value);
  282 + }
  283 + } else {
  284 + list[index].isSelected = false;
  285 + if (this.independence) {
  286 + var idx = this.independenceObj[this.selectedKey].indexOf(list[index].value);
  287 + this.independenceObj[this.selectedKey].splice(idx, 1);
  288 + } else {
  289 + var idx = this.selectedObj[key].indexOf(list[index].value);
  290 + this.selectedObj[key].splice(idx, 1);
  291 + }
  292 +
  293 + }
  294 + if (this.independence) {
  295 + this.result = this.independenceObj;
  296 + } else {
  297 + this.result = this.selectedObj;
  298 + }
  299 +
  300 + }
  301 + } else {
  302 + if (index == 0) {
  303 + this.resetSelected(list, key)
  304 + if (!this.independence) {
  305 + this.selectedTitleObj[key] = list[index].title;
  306 + }
  307 + } else {
  308 + list[0].isSelected = false
  309 + if (this.independence) {
  310 + this.independenceObj[this.selectedKey] = list[index].value;
  311 + this.result = this.independenceObj;
  312 + } else {
  313 + this.selectedObj[key] = list[index].value;
  314 + this.result = this.selectedObj;
  315 + this.selectedTitleObj[key] = list[index].title;
  316 + }
  317 +
  318 + for (let i = 0; i < list.length; i++) {
  319 + if (index == i) {
  320 + list[i].isSelected = true
  321 + } else {
  322 + list[i].isSelected = false
  323 + }
  324 + }
  325 + }
  326 + }
  327 + // #ifdef H5
  328 + this.$forceUpdate();
  329 + // #endif
  330 + },
  331 + resetSelected(list, key) {
  332 + if (typeof this.result[key] == 'object') {
  333 + this.result[key] = [];
  334 + this.selectedTitleObj[key] = list[0].title;
  335 + } else {
  336 + this.result[key] = '';
  337 + this.selectedTitleObj[key] = list[0].title;
  338 + }
  339 + for (let i = 0; i < list.length; i++) {
  340 + if (i == 0) {
  341 + list[i].isSelected = true;
  342 + } else {
  343 + list[i].isSelected = false;
  344 + }
  345 + }
  346 + // #ifdef H5
  347 + this.$forceUpdate();
  348 + // #endif
  349 + },
  350 + sortTap(index, list, key) {
  351 + if (this.independence) {
  352 + this.independenceObj[this.selectedKey] = list[index].value;
  353 + this.result = this.independenceObj;
  354 + } else {
  355 + this.selectedObj[key] = list[index].value;
  356 + this.result = this.selectedObj;
  357 + this.selectedTitleObj[key] = list[index].title;
  358 + }
  359 +
  360 + for (let i = 0; i < list.length; i++) {
  361 + if (index == i) {
  362 + list[i].isSelected = true;
  363 + } else {
  364 + list[i].isSelected = false;
  365 + }
  366 + }
  367 + let obj = {
  368 + 'result': this.result,
  369 + 'titles': this.selectedTitleObj,
  370 + 'isReset': false
  371 + }
  372 + this.$emit("confirm", obj);
  373 + },
  374 + sureClick() {
  375 + let obj = {
  376 + 'result': this.result,
  377 + 'titles': this.selectedTitleObj,
  378 + 'isReset': false
  379 + }
  380 + this.$emit("confirm", obj);
  381 + },
  382 + resetClick(list, key) {
  383 + this.resetSelected(list, key)
  384 + }
  385 + }
  386 + }
  387 +</script>
  388 +
  389 +<style>
  390 + .filter-content {
  391 + background-color: #F6F7F8;
  392 + }
  393 +
  394 + .filter-content-title {
  395 + border-bottom: #EEEEEE 1px solid;
  396 + padding: 10px 15px;
  397 + font-size: 13px;
  398 + color: #999999;
  399 + }
  400 +
  401 + .filter-content-detail {
  402 + padding: 5px 15px;
  403 + }
  404 +
  405 + .filter-content-detail-item-active {
  406 + background-color: #D1372C;
  407 + color: #FFFFFF;
  408 + padding: 5px 15px;
  409 + border-radius: 20px;
  410 + margin-right: 10px;
  411 + margin-top: 10px;
  412 + display: inline-block;
  413 + font-size: 14px;
  414 + }
  415 +
  416 + .filter-content-detail-item-default {
  417 + background-color: #FFFFFF;
  418 + color: #666666;
  419 + padding: 5px 15px;
  420 + border-radius: 20px;
  421 + margin-right: 10px;
  422 + margin-top: 10px;
  423 + display: inline-block;
  424 + font-size: 14px;
  425 + }
  426 +
  427 + .filter-content-footer {
  428 + display: flex;
  429 + justify-content: space-between;
  430 + width: 100%;
  431 + height: 45px;
  432 + margin-top: 10px;
  433 + }
  434 +
  435 + .filter-content-footer-item {
  436 + width: 50%;
  437 + display: flex;
  438 + justify-content: center;
  439 + align-items: center;
  440 + font-size: 16px;
  441 + }
  442 +
  443 + .filter-content-list {
  444 +
  445 + padding: 5px 15px;
  446 + }
  447 +
  448 + .filter-content-list-item-default {
  449 + color: #666666;
  450 + width: 100%;
  451 + padding: 10px 0px;
  452 + }
  453 +
  454 + .filter-content-list-item-default text {
  455 + width: 90%;
  456 + font-size: 14px;
  457 + display: inline-block;
  458 + }
  459 +
  460 + .filter-content-list-item-active {
  461 + color: #D1372C;
  462 + width: 100%;
  463 + padding: 10px 0px;
  464 + }
  465 +
  466 + .filter-content-list-item-active text {
  467 + font-size: 14px;
  468 + width: 90%;
  469 + display: inline-block;
  470 + }
  471 +
  472 + .filter-content-list-item-active:after {
  473 + content: '✓';
  474 + }
  475 +</style>
... ...
src/components/sl-filter/iconfont/iconfont.css
Diff comments   View file @fe62536
... ... @@ -0,0 +1,20 @@
  1 +@font-face {
  2 + font-family: 'sl-font';
  3 + src: url('data:font/truetype;charset=utf-8;base64,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') format('truetype');
  4 +}
  5 +
  6 +.sl-font {
  7 + font-family: "sl-font" !important;
  8 + font-size: 16px;
  9 + font-style: normal;
  10 + -webkit-font-smoothing: antialiased;
  11 + -moz-osx-font-smoothing: grayscale;
  12 +}
  13 +
  14 +.sl-down:before {
  15 + content: "\e61a";
  16 +}
  17 +
  18 +.sl-up:before {
  19 + content: "\e61c";
  20 +}
... ...
src/components/sl-filter/popup-layer.vue
Diff comments   View file @fe62536
... ... @@ -0,0 +1,122 @@
  1 +<template>
  2 + <scroll-view scroll-y v-show="ifshow" @tap="ableClose" @touchmove.stop.prevent class="popup-layer">
  3 + <view ref="popRef" class="popup-content" @tap.stop="stopEvent" :style="_location">
  4 + <slot></slot>
  5 + </view>
  6 + </scroll-view>
  7 +</template>
  8 +
  9 +<script>
  10 + export default {
  11 + name: 'popup-layer',
  12 + props: {
  13 + direction: {
  14 + type: String,
  15 + default: 'top', // 方向 top，bottom，left，right
  16 + },
  17 + autoClose: {
  18 + type: Boolean,
  19 + default: true,
  20 + },
  21 + isTransNav: {
  22 + type: Boolean,
  23 + default: false
  24 + },
  25 + navHeight: {
  26 + type: Number,
  27 + default: 0
  28 + }
  29 + },
  30 + data() {
  31 + return {
  32 + ifshow: false, // 是否展示,
  33 + translateValue: -100, // 位移距离
  34 + timer: null,
  35 + iftoggle: false,
  36 + };
  37 + },
  38 + computed: {
  39 + _translate() {
  40 + if (this.isTransNav) {
  41 + const transformObj = {
  42 + 'top': `transform:translateY(${-this.translateValue}%)`,
  43 + 'bottom': `transform:translateY(calc(${this.translateValue}% + ${this.navHeight}px))`,
  44 + 'left': `transform:translateX(${-this.translateValue}%)`,
  45 + 'right': `transform:translateX(${this.translateValue}%)`
  46 + };
  47 + return transformObj[this.direction]
  48 + } else {
  49 + const transformObj = {
  50 + 'top': `transform:translateY(${-this.translateValue}%)`,
  51 + 'bottom': `transform:translateY(${this.translateValue}%)`,
  52 + 'left': `transform:translateX(${-this.translateValue}%)`,
  53 + 'right': `transform:translateX(${this.translateValue}%)`
  54 + };
  55 + return transformObj[this.direction]
  56 + }
  57 +
  58 + },
  59 + _location() {
  60 + const positionValue = {
  61 + 'top': 'bottom:0px;width:100%;',
  62 + 'bottom': 'top:0px;width:100%;',
  63 + 'left': 'right:0px;height:100%;',
  64 + 'right': 'left:0px;height:100%;',
  65 + };
  66 + return positionValue[this.direction] + this._translate;
  67 + }
  68 + },
  69 + methods: {
  70 + show() {
  71 + let _this = this;
  72 + this.ifshow = true;
  73 + let _open = setTimeout(() => {
  74 + this.translateValue = 0;
  75 + _open = null;
  76 + }, 100)
  77 + let _toggle = setTimeout(() => {
  78 + this.iftoggle = true;
  79 + _toggle = null;
  80 + }, 300);
  81 + },
  82 + close() {
  83 + if (this.timer !== null || !this.iftoggle) {
  84 + return;
  85 + }
  86 + this.translateValue = -100 - this.navHeight;
  87 +
  88 + this.timer = setTimeout(() => {
  89 + this.ifshow = false;
  90 + this.timer = null;
  91 + this.iftoggle = false;
  92 + }, 300);
  93 + this.$emit("close")
  94 + },
  95 + ableClose() {
  96 + if (this.autoClose) {
  97 + this.close();
  98 + }
  99 + },
  100 + stopEvent(event) {},
  101 + }
  102 + }
  103 +</script>
  104 +
  105 +<style>
  106 + .popup-layer {
  107 + position: absolute;
  108 + z-index: 999999;
  109 + background: rgba(0, 0, 0, .3);
  110 + height: calc(100% - 50px);
  111 + width: 100%;
  112 + left: 0px;
  113 + overflow: hidden;
  114 + }
  115 +
  116 + .popup-content {
  117 + position: absolute;
  118 + z-index: 1000000;
  119 + background: #FFFFFF;
  120 + transition: all .3s ease;
  121 + }
  122 +</style>
... ...
src/components/sl-filter/sl-filter.vue
Diff comments   View file @fe62536
... ... @@ -0,0 +1,317 @@
  1 +<template>
  2 + <view class="content">
  3 + <view :style="{height: tabHeight + 1 +'px'}">
  4 + <view :class="topFixed?'select-tab-fixed-top':'select-tab'" :style="{height: tabHeight+'px'}">
  5 + <view class="select-tab-item" :style="{width: itemWidth}" v-for="(item,index) in titleList" :key="index" @tap="showMenuClick(index)">
  6 + <text :style="{color:color}">{{item.title}}</text>
  7 + <text class="arrows sl-font" :class="statusList[index].isActive?up:down"></text>
  8 + </view>
  9 + </view>
  10 + </view>
  11 + <popup-layer ref="popupRef" :direction="'bottom'" @close="close" :isTransNav="isTransNav" :navHeight="navHeight"
  12 + :tabHeight="tabHeight">
  13 + <sl-filter-view :ref="'slFilterView'" :independence="independence" :themeColor="themeColor" :menuList.sync="menuListTemp"
  14 + ref="slFilterView" @confirm="filterResult"></sl-filter-view>
  15 + </popup-layer>
  16 + </view>
  17 +
  18 +</template>
  19 +
  20 +<script>
  21 + import popupLayer from '@/components/sl-filter/popup-layer.vue';
  22 + import slFilterView from '@/components/sl-filter/filter-view.vue';
  23 + export default {
  24 + components: {
  25 + popupLayer,
  26 + slFilterView
  27 + },
  28 + props: {
  29 + menuList: {
  30 + type: Array,
  31 + default () {
  32 + return []
  33 + }
  34 + },
  35 + themeColor: {
  36 + type: String,
  37 + default () {
  38 + return '#000000'
  39 + }
  40 + },
  41 + color: {
  42 + type: String,
  43 + default () {
  44 + return '#666666'
  45 + }
  46 + },
  47 + independence: {
  48 + type: Boolean,
  49 + default: false
  50 + },
  51 + isTransNav: {
  52 + type: Boolean,
  53 + default: false
  54 + },
  55 + navHeight: {
  56 + type: Number,
  57 + default: 0
  58 + },
  59 + topFixed: {
  60 + type: Boolean,
  61 + default: false
  62 + }
  63 + },
  64 +
  65 + computed: {
  66 + itemWidth() {
  67 + return 'calc(100%/2)'
  68 + },
  69 + menuListTemp: {
  70 + get() {
  71 + return this.getMenuListTemp();
  72 + },
  73 + set(newObj) {
  74 + return newObj;
  75 + }
  76 + }
  77 + },
  78 + // #ifndef H5
  79 + onReady: function() {
  80 + let arr = [];
  81 + let titleArr = [];
  82 + let r = {};
  83 + for (let i = 0; i < this.menuList.length; i++) {
  84 + arr.push({
  85 + 'isActive': false
  86 + });
  87 + // titleArr.push({
  88 + // 'title': this.menuList[i].title,
  89 + // 'key': this.menuList[i].key
  90 + // })
  91 +
  92 + r[this.menuList[i].key] = this.menuList[i].title;
  93 +
  94 + if (this.menuList[i].reflexTitle && this.menuList[i].defaultSelectedIndex > -1) {
  95 + titleArr.push({
  96 + 'title': this.menuList[i].detailList[this.menuList[i].defaultSelectedIndex].title,
  97 + 'key': this.menuList[i].key
  98 + })
  99 + } else {
  100 + titleArr.push({
  101 + 'title': this.menuList[i].title,
  102 + 'key': this.menuList[i].key
  103 + })
  104 + }
  105 +
  106 + }
  107 + this.statusList = arr;
  108 + this.titleList = titleArr;
  109 + this.tempTitleObj = r;
  110 + },
  111 + // #endif
  112 +
  113 + // #ifdef H5
  114 + created: function() {
  115 + let arr = [];
  116 + let titleArr = [];
  117 + let r = {};
  118 + for (let i = 0; i < this.menuList.length; i++) {
  119 + arr.push({
  120 + 'isActive': false
  121 + });
  122 + // titleArr.push({
  123 + // 'title': this.menuList[i].title,
  124 + // 'key': this.menuList[i].key
  125 + // });
  126 + r[this.menuList[i].key] = this.menuList[i].title;
  127 +
  128 + if (this.menuList[i].reflexTitle && this.menuList[i].defaultSelectedIndex > -1) {
  129 + titleArr.push({
  130 + 'title': this.menuList[i].detailList[this.menuList[i].defaultSelectedIndex].title,
  131 + 'key': this.menuList[i].key
  132 + })
  133 + } else {
  134 + titleArr.push({
  135 + 'title': this.menuList[i].title,
  136 + 'key': this.menuList[i].key
  137 + })
  138 + }
  139 +
  140 + }
  141 + this.statusList = arr;
  142 + this.titleList = titleArr;
  143 + this.tempTitleObj = r;
  144 + },
  145 + // #endif
  146 + data() {
  147 + return {
  148 + down: 'sl-down',
  149 + up: 'sl-up',
  150 + tabHeight: 50,
  151 + statusList: [],
  152 + selectedIndex: '',
  153 + titleList: [],
  154 + tempTitleObj: {}
  155 + };
  156 + },
  157 + methods: {
  158 + getMenuListTemp() {
  159 + let arr = this.menuList;
  160 + for (let i = 0; i < arr.length; i++) {
  161 + let item = arr[i];
  162 + for (let j = 0; j < item.detailList.length; j++) {
  163 + let d_item = item.detailList[j];
  164 + if (j == 0) {
  165 + d_item.isSelected = true
  166 + } else {
  167 + d_item.isSelected = false
  168 + }
  169 + }
  170 + }
  171 + return arr;
  172 + },
  173 + // 重置所有选项，包括默认选项，并更新result
  174 + resetAllSelect(callback) {
  175 + this.$refs.slFilterView.resetAllSelect(function(e){
  176 + callback(e);
  177 + });
  178 + },
  179 + // 重置选项为设置的默认值，并更新result
  180 + resetSelectToDefault(callback) {
  181 + this.$refs.slFilterView.resetSelectToDefault(function(e){
  182 + callback(e);
  183 + });
  184 + },
  185 + resetMenuList(val) {
  186 + this.menuList = val;
  187 + this.$emit('update:menuList', val)
  188 + this.$forceUpdate();
  189 + this.$refs.slFilterView.resetMenuList(val)
  190 + },
  191 + showMenuClick(index) {
  192 + this.selectedIndex = index;
  193 + if (this.statusList[index].isActive == true) {
  194 + this.$refs.popupRef.close();
  195 + this.statusList[index].isActive = false
  196 + } else {
  197 + this.menuTabClick(index);
  198 + this.$refs.popupRef.show()
  199 + }
  200 + },
  201 + menuTabClick(index) {
  202 + this.$refs.slFilterView.menuTabClick(index);
  203 + for (let i = 0; i < this.statusList.length; i++) {
  204 + if (index == i) {
  205 + this.statusList[i].isActive = true;
  206 + } else {
  207 + this.statusList[i].isActive = false;
  208 + }
  209 + }
  210 + },
  211 + filterResult(obj) {
  212 + let val = obj.result;
  213 + let titlesObj = obj.titles;
  214 + // 处理选项映射到菜单title
  215 + if (this.independence) {
  216 + if (!this.menuList[this.selectedIndex].isMutiple || this.menuList[this.selectedIndex].isSort) {
  217 + let tempTitle = '';
  218 + for (let i = 0; i < this.menuList[this.selectedIndex].detailList.length; i++) {
  219 + let item = this.menuList[this.selectedIndex].detailList[i];
  220 + if (item.value == val[this.menuList[this.selectedIndex].key]) {
  221 + tempTitle = item.title;
  222 + }
  223 + }
  224 + if (this.menuList[this.selectedIndex].reflexTitle) {
  225 + this.titleList[this.selectedIndex].title = tempTitle;
  226 + }
  227 + }
  228 + } else {
  229 + for (let key in titlesObj) {
  230 + if (!Array.isArray(titlesObj[key])) {
  231 + this.tempTitleObj[key] = titlesObj[key];
  232 + }
  233 +
  234 + }
  235 + for (let key in this.tempTitleObj) {
  236 + for (let i = 0; i < this.titleList.length; i++) {
  237 + if (this.titleList[i].key == key) {
  238 + this.titleList[i].title = this.tempTitleObj[key];
  239 + }
  240 + }
  241 + }
  242 + }
  243 +
  244 + this.$refs.popupRef.close()
  245 + if (obj.isReset) {
  246 +
  247 + } else{
  248 + this.$emit("result", val)
  249 + }
  250 +
  251 +
  252 + },
  253 + close() {
  254 + for (let i = 0; i < this.statusList.length; i++) {
  255 + this.statusList[i].isActive = false;
  256 + }
  257 + }
  258 + }
  259 + }
  260 +</script>
  261 +
  262 +<style lang="scss">
  263 + @import 'iconfont/iconfont.css';
  264 + // .content{
  265 + // flex-shrink: 0;
  266 + // width: 100%;
  267 + // height: 44px;
  268 + // position: fixed;
  269 + // z-index: 997;
  270 + // flex-wrap: nowrap;
  271 + // display: flex;
  272 + // flex-direction: row;
  273 + // // top: var(--window-top);
  274 + // left: 0;
  275 + // view {
  276 + // display: flex;
  277 + // flex-wrap: nowrap;
  278 + // }
  279 + // }
  280 + .select-tab {
  281 + border-bottom: #F7F7F7 1px solid;
  282 + background-color: #FFFFFF;
  283 + display: flex;
  284 + width: 100%;
  285 + }
  286 +
  287 + .select-tab-fixed-top {
  288 + border-bottom: #F7F7F7 1px solid;
  289 + background-color: #FFFFFF;
  290 + display: flex;
  291 + width: 100%;
  292 + position: fixed;
  293 + /* #ifdef H5 */
  294 + top: 44px;
  295 + /* #endif */
  296 + /* #ifndef H5 */
  297 + top: 0;
  298 + /* #endif */
  299 + }
  300 +
  301 + .arrows {
  302 + margin-left: 5px;
  303 + }
  304 +
  305 + .select-tab .select-tab-item,
  306 + .select-tab-fixed-top .select-tab-item {
  307 + display: flex;
  308 + justify-content: center;
  309 + align-items: center;
  310 + }
  311 +
  312 + .select-tab .select-tab-item text,
  313 + .select-tab-fixed-top .select-tab-item text {
  314 + color: #666666;
  315 + font-size: 14px;
  316 + }
  317 +</style>
... ...
src/pages/cart/cart.vue
Diff comments   View file @fe62536
... ... @@ -8,6 +8,7 @@
8 8 <view class="cardHeader">
9 9 <view
10 10 v-bind:class="pIsoPen? 'partentChecked' : 'partentCheck'"
  11 + @click="pClick"
11 12 >
12 13 <span class="correct"></span>
13 14 </view>
... ... @@ -24,7 +25,8 @@
24 25 @longpress="delCart(item.cart_id,index)"
25 26 >
26 27 <view
27   - v-bind:class="childIsOpen[index]? 'partentChecked':'partentCheck'"
  28 + v-bind:class="cartList[index].isChecked? 'partentChecked':'partentCheck'"
  29 + @click="childClick(cartList[index],index)"
28 30 >
29 31 <span class="correct"></span>
30 32 </view>
... ... @@ -108,46 +110,58 @@ export default {
108 110 sk_id:String,
109 111 mp_id:String,
110 112 isShowBottom : false, //底部弹窗开关
111   - totalPrice: 0,
112   - pIsoPen: false,
113   - // childIsOpen:[],
114 113 cart_id:Number,
115 114 maxCount: 20,
116   - cartIndex:Number
  115 + cartIndex:Number,
  116 + cartList:[]
117 117 }
118 118 },
119 119 computed: {
120   - // skInfo(){
121   - // return filters()
122   - // }
  120 + pIsoPen (){
  121 + if (this.cartList.length > 0){
  122 + return this.cartList.find(item => !item.isChecked) ? false : true;
  123 + }
  124 + return false
  125 + },
123 126 goodInfo () {
124   - // console.log(this.$store.state.read.goodInfo)
125 127 return this.$store.state.read.goodInfo
126 128 },
127   - cartList() {
128   - // console.log('cart-list', this.$store.state.cart.cartList);
129   - // this.totalPrice=0
130   - return this.$store.state.cart.cartList
131   - },
132   - childIsOpen() {
133   - const temp = []
134   - temp.length = this.$store.state.cart.cartList.length
135   - for (let i = 0; i < temp.length; i++) {
136   - temp[i] = false
137   - }
138   - // console.log('this.childisOPne===>', temp)
139   - return temp
140   - },
141   - },
142   - onShow() {
143   - this.pIsoPen = false
  129 + totalPrice() {
  130 + let totalPrice = 0
  131 + this.cartList.forEach((item)=>{
  132 + if(item.isChecked){
  133 + totalPrice += item.nowPrice * item.num;
  134 + }
  135 + })
  136 + return totalPrice
  137 + }
144 138 },
145   - onLoad: function() {
146   - store.dispatch('cart/getCartList', {
  139 + onLoad: async function() {
  140 + await this.$store.dispatch('cart/getCartList', {
147 141 uid: this.$store.state.user.userInfo.uid, // 用户id
148   - })
  142 + })
  143 +
  144 + this.cartList = this.$store.state.cart.cartList;
  145 + this.cartList.forEach((item)=>{
  146 + item.isChecked = false
  147 + })
149 148 },
150 149 methods: {
  150 + //全选按钮
  151 + pClick(){
  152 + let pStatus = this.cartList.find(item => !item.isChecked) ? false : true
  153 + let oldList = this.cartList;
  154 + oldList.forEach((item, index)=>{
  155 + item.isChecked = !pStatus
  156 + this.cartList.splice(index,1, item)
  157 + })
  158 + },
  159 + //单选按钮
  160 + childClick(type,index){
  161 + this.cartList[index].isChecked = !this.cartList[index].isChecked
  162 + //vue没有办法监听数组内部值的变化，所以需要通过这个方法去触发
  163 + this.cartList.splice(index,1, this.cartList[index])
  164 + },
151 165 //修改购物车
152 166 chooseCartModi(mp_id,sk_id,price,pid,num,cart_id,index){
153 167 // console.log('modi',mp_id,sk_id,price,pid,num,cart_id)
... ... @@ -169,7 +183,7 @@ export default {
169 183 })
170 184  
171 185 this.$forceUpdate()
172   - console.log('21212121212',this.cartList)
  186 + // console.log('21212121212',this.cartList)
173 187 },
174 188 //底部弹窗开关
175 189 showBottom(isCart,pid,skId,mp_id,cart_id,index){
... ... @@ -190,8 +204,6 @@ export default {
190 204 this.isShowBottom = false;
191 205 },
192 206 toGoods(id, sk_id) {
193   - console.log('cart-list', this.$store.state.cart.cartList)
194   - console.log('---', '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id)
195 207 uni.navigateTo({
196 208 url: '../frameDetail/frameDetail?pid=' + id + '&sk_id=' + sk_id,
197 209 success: res => {},
... ... @@ -205,20 +217,14 @@ export default {
205 217 })
206 218 },
207 219 counter(index, isadd, item) {
208   - // console.log('===>>counter ===>num',num)
209   - // console.log('===>>counter ===>isadd',isadd)
210   - console.log('item=====>', item)
211   - console.log('num=====>', item.num)
  220 + // console.log('item=====>', item)
  221 + // console.log('num=====>', item.num)
212 222 const nums = parseInt(item.num)
213 223 if (isadd) {
214 224 if (nums >= this.maxCount) {
215 225 this.addDisabled = true
216 226 } else {
217 227 this.addDisabled = true
218   - // 修改num
219   - // if (this.childIsOpen[index]) {
220   - // this.totalPrice = this.totalPrice + this.$store.state.cart.cartList[index].nowPrice
221   - // }
222 228 store.dispatch('cart/modiCart', {
223 229 uid: this.$store.state.user.userInfo.uid,
224 230 openid: this.$store.state.user.userInfo.openid,
... ... @@ -240,10 +246,7 @@ export default {
240 246 this.desDisabled = true
241 247 } else {
242 248 this.desDisabled = false
243   - // post 请求修改相关参数
244   - // if (this.childIsOpen[index]) {
245   - // this.totalPrice = this.totalPrice - this.$store.state.cart.cartList[index].nowPrice
246   - // }
  249 +
247 250 store.dispatch('cart/modiCart', {
248 251 uid: this.$store.state.user.userInfo.uid,
249 252 openid: this.$store.state.user.userInfo.openid,
... ... @@ -263,57 +266,13 @@ export default {
263 266 }
264 267  
265 268 },
266   - // Change(isopen, indexC) {
267   - // // console.log('lalla===>',isopen)
268   - // this.childIsOpen[indexC] = !isopen
269   - // if (!isopen) {
270   - // this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
271   - // } else {
272   - // this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[indexC].num * this.$store.state.cart.cartList[indexC].nowPrice)
273   - // }
274   - // let m = true
275   - // for (let i = 0; i < this.childIsOpen.length; i++) {
276   - // m = m & this.childIsOpen[i]
277   - // }
278   - // if (m === 1) {
279   - // this.pIsoPen = true
280   - // } else {
281   - // this.pIsoPen = false
282   - // }
283   - // },
284   - // pChange(isopen) {
285   - // this.pIsoPen = !isopen
286   - // for (let i = 0; i < this.childIsOpen.length; i++) {
287   - // this.childIsOpen[i] = !isopen
288   - // }
289   - // if (this.pIsoPen) {
290   - // // 计算总价逻辑
291   - // if (this.childIsOpen.length !== 0) {
292   - // for (let i = 0; i < this.childIsOpen.length; i++) {
293   - // if (this.childIsOpen[i]) {
294   - // this.totalPrice = this.totalPrice + (this.$store.state.cart.cartList[i].num * this.$store.state.cart.cartList[i].nowPrice)
295   - // }
296   - // }
297   - // }
298   - // } else {
299   - // this.totalPrice = 0
300   - // }
301   - // },
302 269 delCart(cart_id, index) {
303   - // console.log('userInfo',this.$store.state.user.userInfo)
304 270 cart_id = parseInt(cart_id)
305   - // console.log('delcart------>cart_id',cart_id)
306   - // console.log('cartlist====>delcart',this.$store.state.cart.cartList)
307   - // console.log('delcart======>index',index)
308 271 uni.showModal({
309 272 title: '是否删除该商品',
310   - // content: '是否删除该商品',
311 273 success: function (res) {
312 274 if (res.confirm) {
313   - // if (this.childIsOpen[index]) {
314   - // this.totalPrice = this.totalPrice - (this.$store.state.cart.cartList[index].nowPrice*this.$store.state.cart.cartList[index].num)
315   - // }
316   - console.log('index===>',index)
  275 +
317 276 store.dispatch('cart/delCart', {
318 277 uid: this.$store.state.user.userInfo.uid,
319 278 openid: this.$store.state.user.userInfo.openid,
... ...
src/pages/index/index.vue
Diff comments   View file @fe62536
... ... @@ -106,8 +106,8 @@
106 106 </view>
107 107 </view>
108 108 <view class="loading-text">
109   - <text>{{loadedText}}</text>
110   - <!-- <text v-else>{{loadedText}}</text> -->
  109 + <text v-if="isLoading==true">{{loadingText}}</text>
  110 + <text v-else>{{loadedText}}</text>
111 111 </view>
112 112 </view>
113 113 <!-- </scroll-view> -->
... ... @@ -140,7 +140,7 @@ export default {
140 140 valueArr: "",
141 141 isLoading: true, //初始化加载状态
142 142 loadingText: "data loading...",
143   - loadedText: "~~到底啦~~",
  143 + loadedText: "~~暂无更多数据~~",
144 144 filterDropdownValue: [],
145 145 filterData: [],
146 146 searchText: "",
... ... @@ -158,7 +158,12 @@ export default {
158 158 goodsList() {
159 159 // 也可以从 getters 获取
160 160 // console.log('index-list=====>',this.$store.state.index.list)
161   - return this.$store.state.index.list;
  161 + let list = this.$store.state.index.list;
  162 + if(list.length == 0){
  163 + this.isLoading = false;
  164 + }
  165 + this.scrollTop = 0.1;
  166 + return list
162 167 },
163 168 categoryList() {
164 169 return this.$store.state.index.categoryList;
... ... @@ -260,7 +265,6 @@ export default {
260 265 flex-direction: column;
261 266 align-items: center;
262 267 justify-content: center;
263   - background-color: #f7f6f6;
264 268 }
265 269 .header {
266 270 display: flex;
... ...
src/store/modules/cart.js
Diff comments   View file @fe62536
... ... @@ -30,7 +30,11 @@ const actions = {
30 30 url: cartList,
31 31 data: param,
32 32 success: (res) => {
33   - console.log('cart===>接口数据', res.data.data)
  33 + let test = {
  34 + isChecked: false,
  35 + itemNum:1,
  36 + price:0
  37 + }
34 38 commit('INIT', res.data.data)
35 39 resolve(res.data.data)
36 40 },
... ...
src/store/modules/index.js
Diff comments   View file @fe62536
... ... @@ -16,6 +16,350 @@ initArr.forEach(function (value) {
16 16 list.push(initData)
17 17 });
18 18  
  19 +let categoryList = [
  20 + {
  21 + "type": "checkbox",
  22 + "name": "产品",
  23 + "value": "category",
  24 + "submenu": [
  25 + {
  26 + "label": "镜框",
  27 + "name": "镜框",
  28 + "value": "1"
  29 + },
  30 + {
  31 + "label": "镜片",
  32 + "name": "镜片",
  33 + "value": "2"
  34 + },
  35 + {
  36 + "label": "特种镜",
  37 + "name": "特种镜",
  38 + "value": "146"
  39 + }
  40 + ],
  41 + "groups": [
  42 + "001"
  43 + ]
  44 + },
  45 + {
  46 + "type": "radio",
  47 + "name": "规则",
  48 + "value": "px",
  49 + "submenu": [
  50 + {
  51 + "name": "按价格排",
  52 + "value": "1"
  53 + },
  54 + {
  55 + "name": "按销量排",
  56 + "value": "2"
  57 + }
  58 + ],
  59 + "groups": [
  60 + "002"
  61 + ]
  62 + },
  63 + {
  64 + "type": "radio",
  65 + "name": "排序",
  66 + "value": "sort",
  67 + "submenu": [
  68 + {
  69 + "name": "从高到低",
  70 + "value": "1"
  71 + },
  72 + {
  73 + "name": "从低到高",
  74 + "value": "2"
  75 + }
  76 + ],
  77 + "groups": [
  78 + "003"
  79 + ]
  80 + },
  81 + {
  82 + "type": "filter",
  83 + "name": "筛选",
  84 + "value": "filter",
  85 + "submenu": [
  86 + {
  87 + "type": "checkbox",
  88 + "name": "性别",
  89 + "value": "sex",
  90 + "submenu": [
  91 + {
  92 + "label": "男性",
  93 + "name": "男性",
  94 + "value": "27"
  95 + },
  96 + {
  97 + "label": "女性",
  98 + "name": "女性",
  99 + "value": "28"
  100 + }
  101 + ]
  102 + },
  103 + {
  104 + "type": "checkbox",
  105 + "name": "年龄",
  106 + "value": "age",
  107 + "submenu": [
  108 + {
  109 + "label": "通用",
  110 + "name": "通用",
  111 + "value": "24"
  112 + }
  113 + ]
  114 + },
  115 + {
  116 + "type": "checkbox",
  117 + "name": "适用场景",
  118 + "value": "sense",
  119 + "submenu": [
  120 + {
  121 + "label": "行政风",
  122 + "name": "行政风",
  123 + "value": "53"
  124 + },
  125 + {
  126 + "label": "青春学子风",
  127 + "name": "青春学子风",
  128 + "value": "54"
  129 + },
  130 + {
  131 + "label": "运动风",
  132 + "name": "运动风",
  133 + "value": "55"
  134 + },
  135 + {
  136 + "label": "简约-极简文艺范",
  137 + "name": "简约-极简文艺范",
  138 + "value": "56"
  139 + },
  140 + {
  141 + "label": "奶奶风",
  142 + "name": "奶奶风",
  143 + "value": "57"
  144 + },
  145 + {
  146 + "label": "流线洛可可",
  147 + "name": "流线洛可可",
  148 + "value": "58"
  149 + },
  150 + {
  151 + "label": "自然舒视角",
  152 + "name": "自然舒视角",
  153 + "value": "59"
  154 + },
  155 + {
  156 + "label": "无界人文系",
  157 + "name": "无界人文系",
  158 + "value": "60"
  159 + },
  160 + {
  161 + "label": "有机未来时",
  162 + "name": "有机未来时",
  163 + "value": "61"
  164 + },
  165 + {
  166 + "label": "立体巴洛克",
  167 + "name": "立体巴洛克",
  168 + "value": "62"
  169 + },
  170 + {
  171 + "label": "多元新风尚",
  172 + "name": "多元新风尚",
  173 + "value": "63"
  174 + },
  175 + {
  176 + "label": "理性几何派",
  177 + "name": "理性几何派",
  178 + "value": "64"
  179 + },
  180 + {
  181 + "label": "轻简北欧风",
  182 + "name": "轻简北欧风",
  183 + "value": "65"
  184 + },
  185 + {
  186 + "label": "质感哥特潮",
  187 + "name": "质感哥特潮",
  188 + "value": "66"
  189 + },
  190 + {
  191 + "label": "时尚",
  192 + "name": "时尚",
  193 + "value": "67"
  194 + },
  195 + {
  196 + "label": "复古",
  197 + "name": "复古",
  198 + "value": "68"
  199 + },
  200 + {
  201 + "label": "商务",
  202 + "name": "商务",
  203 + "value": "69"
  204 + },
  205 + {
  206 + "label": "休闲",
  207 + "name": "休闲",
  208 + "value": "70"
  209 + },
  210 + {
  211 + "label": "折射率",
  212 + "name": "折射率",
  213 + "value": "285"
  214 + }
  215 + ]
  216 + },
  217 + {
  218 + "type": "checkbox",
  219 + "name": "价格",
  220 + "value": "price",
  221 + "submenu": [
  222 + {
  223 + "name": "100以下",
  224 + "value": "1,100"
  225 + },
  226 + {
  227 + "name": "100-300",
  228 + "value": "100,300"
  229 + },
  230 + {
  231 + "name": "300-1000",
  232 + "value": "300,1000"
  233 + },
  234 + {
  235 + "name": "1000以上",
  236 + "value": "1000,-1"
  237 + }
  238 + ]
  239 + },
  240 + {
  241 + "type": "checkbox",
  242 + "name": "材质",
  243 + "value": "glasscate",
  244 + "submenu": [
  245 + {
  246 + "label": "购易",
  247 + "name": "购易",
  248 + "value": "72"
  249 + },
  250 + {
  251 + "label": "海俪恩",
  252 + "name": "海俪恩",
  253 + "value": "73"
  254 + },
  255 + {
  256 + "label": "沙漠风暴",
  257 + "name": "沙漠风暴",
  258 + "value": "74"
  259 + },
  260 + {
  261 + "label": "古诗",
  262 + "name": "古诗",
  263 + "value": "75"
  264 + },
  265 + {
  266 + "label": "暴龙",
  267 + "name": "暴龙",
  268 + "value": "76"
  269 + },
  270 + {
  271 + "label": "犀牛",
  272 + "name": "犀牛",
  273 + "value": "77"
  274 + },
  275 + {
  276 + "label": "Ray-Ban雷朋",
  277 + "name": "Ray-Ban雷朋",
  278 + "value": "78"
  279 + },
  280 + {
  281 + "label": "PARIM派丽蒙",
  282 + "name": "PARIM派丽蒙",
  283 + "value": "79"
  284 + },
  285 + {
  286 + "label": "石狼",
  287 + "name": "石狼",
  288 + "value": "80"
  289 + },
  290 + {
  291 + "label": "木九十",
  292 + "name": "木九十",
  293 + "value": "81"
  294 + }
  295 + ]
  296 + },
  297 + {
  298 + "type": "checkbox",
  299 + "name": "品牌",
  300 + "value": "brand",
  301 + "submenu": [
  302 + {
  303 + "label": "购易",
  304 + "name": "购易",
  305 + "value": "72"
  306 + },
  307 + {
  308 + "label": "海俪恩",
  309 + "name": "海俪恩",
  310 + "value": "73"
  311 + },
  312 + {
  313 + "label": "沙漠风暴",
  314 + "name": "沙漠风暴",
  315 + "value": "74"
  316 + },
  317 + {
  318 + "label": "古诗",
  319 + "name": "古诗",
  320 + "value": "75"
  321 + },
  322 + {
  323 + "label": "暴龙",
  324 + "name": "暴龙",
  325 + "value": "76"
  326 + },
  327 + {
  328 + "label": "犀牛",
  329 + "name": "犀牛",
  330 + "value": "77"
  331 + },
  332 + {
  333 + "label": "Ray-Ban雷朋",
  334 + "name": "Ray-Ban雷朋",
  335 + "value": "78"
  336 + },
  337 + {
  338 + "label": "PARIM派丽蒙",
  339 + "name": "PARIM派丽蒙",
  340 + "value": "79"
  341 + },
  342 + {
  343 + "label": "石狼",
  344 + "name": "石狼",
  345 + "value": "80"
  346 + },
  347 + {
  348 + "label": "木九十",
  349 + "name": "木九十",
  350 + "value": "81"
  351 + }
  352 + ]
  353 + }
  354 + ],
  355 + "groups": [
  356 + "001",
  357 + "002",
  358 + "003"
  359 + ],
  360 + }
  361 + ]
  362 +
19 363 //初始化数据是为了显示默认骨架
20 364 const state = {
21 365 categoryList: [],
... ... @@ -52,7 +396,6 @@ initArr.forEach(function (value) {
52 396 });
53 397 commit('CATEGORY', data);
54 398 resolve(data)
55   - console.log('3333')
56 399 },
57 400 fail: (res) => {
58 401 console.log("fail status === > ", res);
... ... @@ -67,8 +410,7 @@ initArr.forEach(function (value) {
67 410 url: shopList,
68 411 success: (res) => {
69 412 commit('LIST', res.data.data)
70   - resolve(res.data)
71   - console.log('3333')
  413 + resolve(res.data)
72 414 },
73 415 fail: (res) => {
74 416 console.log("fail status === > ", res);
... ...