| 1 |
- {"remainingRequest":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\components\\mobilePage\\home_product.vue?vue&type=style&index=0&id=2ab207a6&scoped=true&lang=scss","dependencies":[{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\components\\mobilePage\\home_product.vue","mtime":1761185180003},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoubWVudXMgew0KICBkaXNwbGF5OiBmbGV4Ow0KICBhbGlnbi1pdGVtczogY2VudGVyOw0KICB3aWR0aDogMTAwMDAlOw0KICBjdXJzb3I6IHBvaW50ZXI7DQogIHBhZGRpbmctbGVmdDogMTJweDsNCiAgcGFkZGluZzogOXB4IDA7DQoNCiAgJi5vbiB7DQogICAgcGFkZGluZy1ib3R0b206IDE0cHg7DQogIH0NCg0KICAudGl0bGUgew0KICAgIGNvbG9yOiAjMzMzOw0KICAgIGZvbnQtc2l6ZTogMTJweDsNCiAgICBtYXJnaW4tdG9wOiA0cHg7DQogICAgaGVpZ2h0OiAyMHB4Ow0KICAgIGJvcmRlci1yYWRpdXM6IDIwcHg7DQogICAgcGFkZGluZzogMCA1cHg7DQogICAgbGluZS1oZWlnaHQ6IDIwcHg7DQogICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICB9DQoNCiAgLml0ZW0gew0KICAgIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgICBjb2xvcjogIzMzMzsNCiAgICBmb250LXNpemU6IDE0cHg7DQogICAgbWFyZ2luLXJpZ2h0OiAyOHB4Ow0KICAgIHotaW5kZXg6IDk7DQoNCiAgICAmLnBpYyB7DQogICAgICBtYXJnaW4tcmlnaHQ6IDE1cHg7DQogICAgfQ0KDQogICAgLnBpY3RydWUgew0KICAgICAgd2lkdGg6IDQ2cHg7DQogICAgICBoZWlnaHQ6IDQ2cHg7DQogICAgICBib3JkZXI6IDFweCBzb2xpZCAjZWVlZWVlOw0KICAgICAgYm9yZGVyLXJhZGl1czogNTAlOw0KICAgICAgYmFja2dyb3VuZDogI2YzZjlmZjsNCiAgICAgIG1hcmdpbjogMCBhdXRvOw0KDQogICAgICAuaW1nIHsNCiAgICAgICAgd2lkdGg6IDQycHg7DQogICAgICAgIGhlaWdodDogNDJweDsNCiAgICAgICAgYm9yZGVyLXJhZGl1czogNTAlOw0KICAgICAgfQ0KDQogICAgICBpbWcgew0KICAgICAgICB3aWR0aDogMjdweDsNCiAgICAgIH0NCiAgICB9DQoNCiAgICAmLm9uIHsNCiAgICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgICAgIGZvbnQtd2VpZ2h0OiA2MDA7DQoNCiAgICAgIHNwYW4gew0KICAgICAgICBkaXNwbGF5OiBibG9jazsNCiAgICAgICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgICAgICBsZWZ0OiA1MCU7DQogICAgICAgIGJvdHRvbTogNHB4Ow0KICAgICAgICB3aWR0aDogMTAwJTsNCiAgICAgICAgaGVpZ2h0OiA0cHg7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDEwMHB4Ow0KICAgICAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoLTUwJSk7DQogICAgICAgIGJhY2tncm91bmQ6ICNmZmY7DQogICAgICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCg5MGRlZywgI2U5MzMyMyAwJSwgI2ZmNzkzMSAxMDAlKTsNCiAgICAgICAgei1pbmRleDogLTE7DQogICAgICB9DQogICAgfQ0KDQogICAgJi5vbjIgew0KICAgICAgaGVpZ2h0OiAyNHB4Ow0KICAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICAgbGluZS1oZWlnaHQ6IDI0cHg7DQogICAgICBjb2xvcjogI2ZmZjsNCiAgICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCg5MGRlZywgI2U5MzMyMyAwJSwgI2ZmNzkzMSAxMDAlKTsNCiAgICAgIGJvcmRlci1yYWRpdXM6IDUwcHg7DQogICAgICBwYWRkaW5nOiAwIDZweDsNCiAgICB9DQoNCiAgICAmLm9uMyB7DQogICAgICBmb250LXNpemU6IDE2cHg7DQogICAgICBmb250LXdlaWdodDogNjAwOw0KICAgICAgY29sb3I6ICNlOTMzMjM7DQoNCiAgICAgIHNwYW4gew0KICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICAgIHdpZHRoOiAzMHB4Ow0KICAgICAgICBoZWlnaHQ6IDMwcHg7DQogICAgICAgIGJvcmRlcjogM3B4IHNvbGlkICNlOTMzMjM7DQogICAgICAgIGJvcmRlci1sZWZ0OiAzcHggc29saWQgdHJhbnNwYXJlbnQgIWltcG9ydGFudDsNCiAgICAgICAgYm9yZGVyLXRvcDogM3B4IHNvbGlkIHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7DQogICAgICAgIGJvcmRlci1yaWdodDogM3B4IHNvbGlkIHRyYW5zcGFyZW50ICFpbXBvcnRhbnQ7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDUwJTsNCiAgICAgICAgYm90dG9tOiAtNHB4Ow0KICAgICAgICBsZWZ0OiA1MCU7DQogICAgICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTsNCiAgICAgIH0NCiAgICB9DQogIH0NCn0NCg0KLmhvbWVfcHJvZHVjdCB7DQogIG92ZXJmbG93OiBoaWRkZW47DQoNCiAgLmhkX25hdiB7DQogICAgZGlzcGxheTogZmxleDsNCiAgICBoZWlnaHQ6IDY1cHg7DQogICAgb3ZlcmZsb3c6IGhpZGRlbjsNCiAgICBwYWRkaW5nOiAxMHB4IDA7DQoNCiAgICAuaXRlbSB7DQogICAgICBkaXNwbGF5OiBmbGV4Ow0KICAgICAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsNCiAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyOw0KICAgICAgbWFyZ2luLXJpZ2h0OiAzN3B4Ow0KDQogICAgICAudGl0bGUgew0KICAgICAgICBmb250LXNpemU6IDE1cHg7DQogICAgICAgIGNvbG9yOiAjMjgyODI4Ow0KICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7DQogICAgICB9DQoNCiAgICAgIC5sYWJlbCB7DQogICAgICAgIHdpZHRoOiA1NnB4Ow0KICAgICAgICBoZWlnaHQ6IDE5cHg7DQogICAgICAgIGxpbmUtaGVpZ2h0OiAxOXB4Ow0KICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7DQogICAgICAgIGJhY2tncm91bmQ6IHRyYW5zcGFyZW50Ow0KICAgICAgICBib3JkZXItcmFkaXVzOiAxMHB4Ow0KICAgICAgICBjb2xvcjogIzk5OTk5OTsNCiAgICAgICAgZm9udC1zaXplOiAxMXB4Ow0KICAgICAgfQ0KDQogICAgICAmLmFjdGl2ZSB7DQogICAgICAgIC50aXRsZSB7DQogICAgICAgICAgY29sb3I6ICNmZjQ0NDQ7DQogICAgICAgIH0NCg0KICAgICAgICAubGFiZWwgew0KICAgICAgICAgIGNvbG9yOiAjZmZmOw0KICAgICAgICAgIGJhY2tncm91bmQ6IGxpbmVhci1ncmFkaWVudCgyNzBkZWcsIHJnYmEoMjU1LCA4NCwgMCwgMSkgMCUsIHJnYmEoMjU1LCAwLCAwLCAxKSAxMDAlKTsNCiAgICAgICAgfQ0KICAgICAgfQ0KICAgIH0NCiAgfQ0KDQogIC5saXN0LXdyYXBwZXIgew0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAgZmxleC13cmFwOiB3cmFwOw0KICAgIGp1c3RpZnktY29udGVudDogc3BhY2UtYmV0d2VlbjsNCg0KICAgIC5pdGVtIHsNCiAgICAgIHdpZHRoOiA0OC41JTsNCiAgICAgIG1hcmdpbi1ib3R0b206IDEwcHg7DQogICAgICBwb3NpdGlvbjogcmVsYXRpdmU7DQoNCiAgICAgIC5qaWEgew0KICAgICAgICB3aWR0aDogMjJweDsNCiAgICAgICAgaGVpZ2h0OiAyMnB4Ow0KICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAjZTkzMzIzOw0KICAgICAgICBib3JkZXItcmFkaXVzOiA1MCU7DQogICAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTsNCiAgICAgICAgcmlnaHQ6IDEwcHg7DQogICAgICAgIGJvdHRvbTogOHB4Ow0KDQogICAgICAgIC5qaWFDb24gew0KICAgICAgICAgIHdpZHRoOiAxMDAlOw0KICAgICAgICAgIGhlaWdodDogMTAwJTsNCiAgICAgICAgICB0ZXh0LWFsaWduOiBjZW50ZXI7DQogICAgICAgICAgbGluZS1oZWlnaHQ6IDIycHg7DQoNCiAgICAgICAgICAuaWNvbmZvbnQgew0KICAgICAgICAgICAgY29sb3I6ICNmZmY7DQogICAgICAgICAgICBmb250LXNpemU6IDEzcHg7DQogICAgICAgICAgfQ0KICAgICAgICB9DQogICAgICB9DQoNCiAgICAgIC5pbWctYm94IHsNCiAgICAgICAgd2lkdGg6IDEwMCU7DQogICAgICAgIGhlaWdodDogMTczcHg7DQoNCiAgICAgICAgLmltZyB7DQogICAgICAgICAgd2lkdGg6IDEwMCU7DQogICAgICAgICAgaGVpZ2h0OiAxMDAlOw0KICAgICAgICB9DQoNCiAgICAgICAgaW1nLA0KICAgICAgICAuYm94IHsNCiAgICAgICAgICB3aWR0aDogNjVweDsNCiAgICAgICAgICBoZWlnaHQ6IDUwcHg7DQogICAgICAgIH0NCg0KICAgICAgICAuZW1wdHktYm94IHsNCiAgICAgICAgICBiYWNrZ3JvdW5kOiAjZjNmOWZmOw0KICAgICAgICB9DQoNCiAgICAgICAgLmJveCB7DQogICAgICAgICAgYmFja2dyb3VuZDogI2Q4ZDhkODsNCiAgICAgICAgfQ0KDQogICAgICAgIC5sYWJlbCB7DQogICAgICAgICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgICAgICAgIGxlZnQ6IDA7DQogICAgICAgICAgdG9wOiAwOw0KICAgICAgICAgIHdpZHRoOiA0NnB4Ow0KICAgICAgICAgIGhlaWdodDogMjJweDsNCiAgICAgICAgICBib3JkZXItcmFkaXVzOiAxMHB4IDBweCAxMHB4IDBweDsNCiAgICAgICAgICBjb2xvcjogI2ZmZjsNCiAgICAgICAgICBmb250LXNpemU6IDEzcHg7DQogICAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICAgICAgIGxpbmUtaGVpZ2h0OiAyMnB4Ow0KICAgICAgICB9DQogICAgICB9DQoNCiAgICAgIC5pbmZvIHsNCiAgICAgICAgcGFkZGluZzogN3B4IDEwcHg7DQogICAgICAgIGJhY2tncm91bmQ6ICNmZmY7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDBweCAwcHggMTBweCAxMHB4Ow0KDQogICAgICAgIC5waWN0cnVlIHsNCiAgICAgICAgICAvLyB3aWR0aDogOTlweDsNCiAgICAgICAgICBoZWlnaHQ6IDE0cHg7DQogICAgICAgICAgbWFyZ2luLXRvcDogNHB4Ow0KDQogICAgICAgICAgaW1nIHsNCiAgICAgICAgICAgIC8vIHdpZHRoOiAxMDAlOw0KICAgICAgICAgICAgaGVpZ2h0OiAxMDAlOw0KICAgICAgICAgIH0NCiAgICAgICAgfQ0KDQogICAgICAgIC50aXRsZSB7DQogICAgICAgICAgZm9udC1zaXplOiAxNHB4Ow0KICAgICAgICAgIGNvbG9yOiAjMjgyODI4Ow0KICAgICAgICB9DQoNCiAgICAgICAgLnNhbGVzIHsNCiAgICAgICAgICBjb2xvcjogIzk5OTsNCiAgICAgICAgICBmb250LXNpemU6IDExcHg7DQogICAgICAgIH0NCg0KICAgICAgICAucHJpY2Ugew0KICAgICAgICAgIGRpc3BsYXk6IGZsZXg7DQogICAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgICAgICAgICBtYXJnaW4tdG9wOiA2cHg7DQoNCiAgICAgICAgICBpbWcgew0KICAgICAgICAgICAgd2lkdGg6IDcwcHg7DQogICAgICAgICAgICBoZWlnaHQ6IDE1cHg7DQogICAgICAgICAgfQ0KDQogICAgICAgICAgLm51bSB7DQogICAgICAgICAgICBmb250LXNpemU6IDIwcHg7DQogICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDRweDsNCiAgICAgICAgICAgIGZvbnQtZmFtaWx5OiBTZW1pQm9sZDsNCg0KICAgICAgICAgICAgc3BhbiB7DQogICAgICAgICAgICAgIGZvbnQtc2l6ZTogMTJweDsNCiAgICAgICAgICAgIH0NCiAgICAgICAgICB9DQoNCiAgICAgICAgICAubGFiZWwgew0KICAgICAgICAgICAgd2lkdGg6IDE2cHg7DQogICAgICAgICAgICBoZWlnaHQ6IDE4cHg7DQogICAgICAgICAgICBtYXJnaW4tbGVmdDogNXB4Ow0KICAgICAgICAgICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgICAgICAgICAgbGluZS1oZWlnaHQ6IDE4cHg7DQogICAgICAgICAgICBmb250LXNpemU6IDExcHg7DQoNCiAgICAgICAgICAgICYub24gew0KICAgICAgICAgICAgICBtYXJnaW4tbGVmdDogMDsNCiAgICAgICAgICAgIH0NCiAgICAgICAgICB9DQogICAgICAgIH0NCiAgICAgIH0NCiAgICB9DQogIH0NCn0NCg=="},{"version":3,"sources":["home_product.vue"],"names":[],"mappings":";AAokBA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"home_product.vue","sourceRoot":"src/components/mobilePage","sourcesContent":["<template>\r\n <div\r\n class=\"mobile-page\"\r\n :style=\"{\r\n background: bottomBgColor,\r\n marginTop: mTop + 'px',\r\n paddingTop: topConfig + 'px',\r\n paddingBottom: bottomConfig + 'px',\r\n paddingLeft: prConfig + 'px',\r\n paddingRight: prConfig + 'px',\r\n }\"\r\n >\r\n <div class=\"home_product\">\r\n <div class=\"hd_nav\" v-if=\"styleConfig == 0\">\r\n <div class=\"item\" :class=\"index == tabCur ? 'active' : ''\" v-for=\"(item, index) in navlist\" :key=\"index\">\r\n <p\r\n class=\"title\"\r\n :style=\"{ color: index == tabCur ? (toneConfig ? textColor2 : colorStyle.theme) : '#282828' }\"\r\n >\r\n {{ item.chiild[0].val || '标题' }}\r\n </p>\r\n <span\r\n class=\"label\"\r\n :style=\"{ background: index == tabCur ? (toneConfig ? decorateColor : themeColor) : '' }\"\r\n v-if=\"item.chiild[1].val\"\r\n >{{ item.chiild[1].val || '标题简介' }}</span\r\n >\r\n </div>\r\n </div>\r\n <div class=\"menus\" :class=\"styleConfig == 2 ? 'on' : ''\" v-else>\r\n <div\r\n class=\"item\"\r\n :class=\"index == tabCur ? 'on' : ''\"\r\n v-if=\"styleConfig == 1\"\r\n v-for=\"(item, index) in navlist\"\r\n :key=\"index\"\r\n :style=\"{\r\n color: index == tabCur ? (toneConfig ? textColor : '#333') : '#282828',\r\n }\"\r\n >\r\n {{ item.chiild[0].val || '标题'\r\n }}<span\r\n :style=\"{\r\n background: toneConfig ? decorateColor : themeColor,\r\n }\"\r\n ></span>\r\n </div>\r\n <div\r\n class=\"item\"\r\n :class=\"index == tabCur ? 'on3' : ''\"\r\n v-if=\"styleConfig == 2\"\r\n v-for=\"(item, index) in navlist\"\r\n :key=\"index\"\r\n :style=\"{\r\n color: index == tabCur ? (toneConfig ? textColor2 : colorStyle.theme) : '#282828',\r\n }\"\r\n >\r\n {{ item.chiild[0].val || '标题'\r\n }}<span\r\n :style=\"{\r\n borderColor: toneConfig ? decorateColor2 : colorStyle.theme,\r\n }\"\r\n ></span>\r\n </div>\r\n <div\r\n class=\"item\"\r\n :class=\"index == tabCur ? 'on2' : ''\"\r\n v-if=\"styleConfig == 3\"\r\n v-for=\"(item, index) in navlist\"\r\n :key=\"index\"\r\n :style=\"{\r\n color: index == tabCur ? (toneConfig ? textColor3 : '#fff') : '#282828',\r\n background: index == tabCur ? (toneConfig ? decorateColor : themeColor) : '',\r\n }\"\r\n >\r\n {{ item.chiild[0].val || '标题' }}\r\n </div>\r\n <div class=\"item pic\" v-if=\"styleConfig == 4\" v-for=\"(item, index) in navlist\" :key=\"index\">\r\n <div\r\n class=\"pictrue acea-row row-center-wrapper\"\r\n :style=\"{ borderColor: index == tabCur ? (toneConfig ? decorateColorLeft : colorStyle.theme) : '#EEEEEE' }\"\r\n >\r\n <img class=\"img\" :src=\"item.image\" v-if=\"item.image\" />\r\n <img src=\"../../assets/images/shan.png\" v-else />\r\n </div>\r\n <div\r\n class=\"title\"\r\n :style=\"{\r\n color: index == tabCur ? (toneConfig ? textColor3 : '#fff') : '#282828',\r\n background: index == tabCur ? (toneConfig ? decorateColor : themeColor) : '',\r\n }\"\r\n >\r\n {{ item.chiild[0].val || '标题' }}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"list-wrapper\">\r\n <div class=\"item\" v-for=\"(item, index) in list\" :key=\"index\">\r\n <div class=\"img-box\">\r\n <img\r\n class=\"img\"\r\n v-if=\"item.image\"\r\n :src=\"item.image\"\r\n alt=\"\"\r\n :style=\"{\r\n borderRadius: bgRadius,\r\n }\"\r\n />\r\n <div\r\n v-else\r\n class=\"empty-box\"\r\n :style=\"{\r\n borderRadius: bgRadius,\r\n }\"\r\n >\r\n <img src=\"../../assets/images/shan.png\" />\r\n </div>\r\n </div>\r\n <div class=\"info\" :style=\"{ borderRadius: bgRadius2 }\">\r\n <div class=\"title line2\">\r\n {{ item.store_name || '这里是商品名称展示区域,商品名称展示区域,商品名称展示区域' }}\r\n </div>\r\n <div class=\"pictrue\">\r\n <img src=\"../../assets/images/goods01.png\" />\r\n </div>\r\n <div class=\"price\">\r\n <div class=\"num\">\r\n <span>￥</span>{{ item.price ? $HandlePrice(item.price, 0) : 77\r\n }}<span>{{ item.price ? $HandlePrice(item.price, 1) : '' }}</span>\r\n </div>\r\n <img src=\"../../assets/images/goods02.png\" />\r\n </div>\r\n <div class=\"sales\">已售{{ item.sales || 0 }}件</div>\r\n </div>\r\n <div\r\n class=\"jia\"\r\n v-if=\"!cartConfig\"\r\n :style=\"{\r\n background: toneCartConfig ? bntBgColor : themeColor,\r\n }\"\r\n >\r\n <div class=\"jiaCon\">\r\n <span class=\"iconfont iconjiahao1\" v-if=\"bntStyleConfig == 0\"></span>\r\n <span class=\"iconfont icongouwuche1\" v-else></span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex';\r\n// import theme from \"@/mixins/theme\";\r\nexport default {\r\n name: 'home_product',\r\n cname: '商品选项卡',\r\n configName: 'c_home_product',\r\n icon: '#iconzujian-shangpinxuanxiangka',\r\n type: 0, // 0 基础组件 1 营销组件 2工具组件\r\n defaultName: 'promotionList', // 外面匹配名称\r\n props: {\r\n index: {\r\n type: null,\r\n },\r\n num: {\r\n type: null,\r\n },\r\n colorStyle: {\r\n type: null,\r\n },\r\n },\r\n computed: {\r\n ...mapState('mobildConfig', ['defaultArray']),\r\n },\r\n watch: {\r\n pageData: {\r\n handler(nVal, oVal) {\r\n this.setConfig(nVal);\r\n },\r\n deep: true,\r\n },\r\n num: {\r\n handler(nVal, oVal) {\r\n const data = this.$store.state.mobildConfig.defaultArray[nVal];\r\n this.setConfig(data);\r\n },\r\n deep: true,\r\n },\r\n defaultArray: {\r\n handler(nVal, oVal) {\r\n const data = this.$store.state.mobildConfig.defaultArray[this.num];\r\n this.setConfig(data);\r\n },\r\n deep: true,\r\n },\r\n },\r\n // mixins: [theme],\r\n data() {\r\n return {\r\n // 默认初始化数据禁止修改\r\n defaultConfig: {\r\n cname: '商品选项卡',\r\n name: 'promotionList',\r\n timestamp: this.num,\r\n isHide: false,\r\n setUp: {\r\n tabVal: 0,\r\n },\r\n titleLeft: '展示设置',\r\n titleTab: '选项卡设置',\r\n titleRight: '选项卡样式',\r\n titleCurrency: '通用样式',\r\n titleCart: '购物车按钮',\r\n styleConfig: {\r\n title: '选择风格',\r\n tabVal: 1,\r\n tabList: [\r\n {\r\n name: '样式一',\r\n },\r\n {\r\n name: '样式二',\r\n },\r\n {\r\n name: '样式三',\r\n },\r\n {\r\n name: '样式四',\r\n },\r\n {\r\n name: '样式五',\r\n },\r\n ],\r\n },\r\n slideConfig: {\r\n title: '滑动置顶',\r\n tabVal: 1,\r\n tabList: [\r\n {\r\n name: '启用',\r\n },\r\n {\r\n name: '不启用',\r\n },\r\n ],\r\n },\r\n tabConfig: {\r\n title: '点击下方选项卡可进行编辑；鼠标拖拽版块可调整顺序',\r\n max: '',\r\n tabCur: 0,\r\n classList: [],\r\n list: [\r\n {\r\n chiild: [\r\n {\r\n title: '标题',\r\n val: '首发新品',\r\n max: 4,\r\n pla: '选填，不超过四个字',\r\n },\r\n {\r\n title: '简介',\r\n val: '最新出炉',\r\n max: 4,\r\n pla: '选填，不超过四个字',\r\n },\r\n ],\r\n image: '',\r\n tabVal: 1,\r\n brandConfig: {\r\n brandVal: [],\r\n },\r\n selectConfig: {\r\n activeValue: [],\r\n },\r\n goodsLabel: {\r\n activeValue: [],\r\n list: [],\r\n },\r\n goodsSort: 0,\r\n numConfig: {\r\n val: 6,\r\n },\r\n goodsList: {\r\n max: 20,\r\n list: [],\r\n },\r\n productList: {\r\n list: [],\r\n },\r\n },\r\n ],\r\n },\r\n cartConfig: {\r\n title: '是否显示',\r\n tabVal: 0,\r\n tabList: [\r\n {\r\n name: '显示',\r\n },\r\n {\r\n name: '隐藏',\r\n },\r\n ],\r\n },\r\n bntConfig: {\r\n title: '按钮效果',\r\n tabVal: 1,\r\n tabList: [\r\n {\r\n name: '进入商品详情页',\r\n },\r\n {\r\n name: '商品加购',\r\n },\r\n ],\r\n },\r\n bntStyleConfig: {\r\n typeFrom: 'bnt',\r\n title: '按钮样式',\r\n tabVal: 0,\r\n },\r\n toneConfig: {\r\n title: '色调',\r\n tabVal: 0,\r\n tabList: [\r\n {\r\n name: '跟随主题风格',\r\n },\r\n {\r\n name: '自定义',\r\n },\r\n ],\r\n },\r\n decorateColor: {\r\n title: '装饰元素',\r\n default: [\r\n {\r\n item: '#E93323',\r\n },\r\n {\r\n item: '#FF7931',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#E93323',\r\n },\r\n {\r\n item: '#FF7931',\r\n },\r\n ],\r\n },\r\n decorateColor2: {\r\n title: '装饰元素',\r\n default: [\r\n {\r\n item: '#E93323',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#E93323',\r\n },\r\n ],\r\n },\r\n textColor: {\r\n title: '选中文字',\r\n default: [\r\n {\r\n item: '#333333',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#333333',\r\n },\r\n ],\r\n },\r\n textColor2: {\r\n title: '选中文字',\r\n default: [\r\n {\r\n item: '#E93323',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#E93323',\r\n },\r\n ],\r\n },\r\n textColor3: {\r\n title: '选中文字',\r\n default: [\r\n {\r\n item: '#FFFFFF',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#FFFFFF',\r\n },\r\n ],\r\n },\r\n toneCartConfig: {\r\n title: '色调',\r\n tabVal: 0,\r\n tabList: [\r\n {\r\n name: '跟随主题风格',\r\n },\r\n {\r\n name: '自定义',\r\n },\r\n ],\r\n },\r\n bntBgColor: {\r\n title: '按钮颜色',\r\n name: 'bntBgColor',\r\n default: [\r\n {\r\n item: '#E93323',\r\n },\r\n {\r\n item: '#FF7931',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#E93323',\r\n },\r\n {\r\n item: '#FF7931',\r\n },\r\n ],\r\n },\r\n bottomBgColor: {\r\n title: '底部背景',\r\n default: [\r\n {\r\n item: '#f5f5f5',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#f5f5f5',\r\n },\r\n ],\r\n },\r\n topConfig: {\r\n title: '上边距',\r\n val: 0,\r\n min: 0,\r\n },\r\n bottomConfig: {\r\n title: '下边距',\r\n val: 0,\r\n min: 0,\r\n },\r\n prConfig: {\r\n title: '左右边距',\r\n val: 10,\r\n min: 0,\r\n },\r\n mbConfig: {\r\n title: '页面间距',\r\n val: 0,\r\n min: 0,\r\n },\r\n fillet: {\r\n title: '背景圆角',\r\n type: 0,\r\n list: [\r\n {\r\n val: '全部',\r\n icon: 'iconcaozuo-zhengti',\r\n },\r\n {\r\n val: '单个',\r\n icon: 'iconcaozuo-bianjiao',\r\n },\r\n ],\r\n valName: '圆角值',\r\n val: 0,\r\n min: 0,\r\n valList: [{ val: 0 }, { val: 0 }, { val: 0 }, { val: 0 }],\r\n },\r\n },\r\n navlist: [],\r\n imgStyle: '',\r\n tabCur: 0,\r\n list: [],\r\n pageData: {},\r\n styleConfig: 0,\r\n toneConfig: 0,\r\n textColor: '',\r\n textColor2: '',\r\n textColor3: '',\r\n decorateColor: '',\r\n decorateColor2: '',\r\n decorateColorLeft: '',\r\n // bgColor:'',\r\n bottomBgColor: '',\r\n mTop: 0,\r\n topConfig: 0,\r\n bottomConfig: 0,\r\n prConfig: 0,\r\n bgRadius: 0,\r\n bgRadius2: 0,\r\n themeColor: '',\r\n cartConfig: 0,\r\n toneCartConfig: 0,\r\n bntBgColor: '',\r\n bntStyleConfig: 0,\r\n };\r\n },\r\n mounted() {\r\n this.$nextTick(() => {\r\n this.pageData = this.$store.state.mobildConfig.defaultArray[this.num];\r\n this.setConfig(this.pageData);\r\n });\r\n },\r\n methods: {\r\n setConfig(data) {\r\n if (!data) return;\r\n if (data.mbConfig) {\r\n this.styleConfig = data.styleConfig.tabVal;\r\n this.cartConfig = data.cartConfig.tabVal;\r\n this.bntStyleConfig = data.bntStyleConfig.tabVal;\r\n this.toneCartConfig = data.toneCartConfig.tabVal;\r\n let bntBgColorLeft = data.bntBgColor.color[0].item;\r\n let bntBgColorRight = data.bntBgColor.color[1].item;\r\n this.bntBgColor = `linear-gradient(90deg,${bntBgColorLeft} 0%,${bntBgColorRight} 100%)`;\r\n this.toneConfig = data.toneConfig.tabVal;\r\n this.textColor = data.textColor.color[0].item;\r\n this.textColor2 = data.textColor2.color[0].item;\r\n this.textColor3 = data.textColor3.color[0].item;\r\n let decorateColorLeft = data.decorateColor.color[0].item;\r\n let decorateColorRight = data.decorateColor.color[1].item;\r\n this.decorateColorLeft = decorateColorLeft;\r\n this.decorateColor = `linear-gradient(90deg,${decorateColorLeft} 0%,${decorateColorRight} 100%)`;\r\n this.decorateColor2 = data.decorateColor2.color[0].item;\r\n this.themeColor = `linear-gradient(90deg,${this.colorStyle.theme} 0%,${this.colorStyle.gradient} 100%)`;\r\n // let bgColorLeft = data.moduleColor.color[0].item;\r\n // let bgColorRight = data.moduleColor.color[1].item;\r\n // this.bgColor = `linear-gradient(90deg,${bgColorLeft} 0%,${bgColorRight} 100%)`;\r\n this.bottomBgColor = data.bottomBgColor.color[0].item;\r\n this.mTop = data.mbConfig.val;\r\n this.topConfig = data.topConfig.val;\r\n this.bottomConfig = data.bottomConfig.val;\r\n this.prConfig = data.prConfig.val;\r\n let fillet = data.fillet.type;\r\n let filletVal = data.fillet.val;\r\n let valList = data.fillet.valList;\r\n this.bgRadius = fillet\r\n ? valList[0].val + 'px ' + valList[1].val + 'px 0 0'\r\n : filletVal + 'px ' + filletVal + 'px 0 0';\r\n this.bgRadius2 = fillet\r\n ? '0 0 ' + valList[3].val + 'px ' + valList[2].val + 'px'\r\n : '0 0 ' + filletVal + 'px ' + filletVal + 'px';\r\n this.navlist = data.tabConfig.list;\r\n this.tabCur = data.tabConfig.tabCur || 0;\r\n let goods = data.tabConfig.list[this.tabCur];\r\n if (goods.tabVal == 1 && goods.goodsList.list) {\r\n this.list = goods.goodsList.list.length ? goods.goodsList.list : 2;\r\n } else if (goods.goodsList.list) {\r\n this.list = goods.productList.list.length ? goods.productList.list : 2;\r\n } else {\r\n this.list = goods.productList.list.length ? goods.productList.list : 2;\r\n }\r\n }\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n.menus {\r\n display: flex;\r\n align-items: center;\r\n width: 10000%;\r\n cursor: pointer;\r\n padding-left: 12px;\r\n padding: 9px 0;\r\n\r\n &.on {\r\n padding-bottom: 14px;\r\n }\r\n\r\n .title {\r\n color: #333;\r\n font-size: 12px;\r\n margin-top: 4px;\r\n height: 20px;\r\n border-radius: 20px;\r\n padding: 0 5px;\r\n line-height: 20px;\r\n text-align: center;\r\n }\r\n\r\n .item {\r\n position: relative;\r\n color: #333;\r\n font-size: 14px;\r\n margin-right: 28px;\r\n z-index: 9;\r\n\r\n &.pic {\r\n margin-right: 15px;\r\n }\r\n\r\n .pictrue {\r\n width: 46px;\r\n height: 46px;\r\n border: 1px solid #eeeeee;\r\n border-radius: 50%;\r\n background: #f3f9ff;\r\n margin: 0 auto;\r\n\r\n .img {\r\n width: 42px;\r\n height: 42px;\r\n border-radius: 50%;\r\n }\r\n\r\n img {\r\n width: 27px;\r\n }\r\n }\r\n\r\n &.on {\r\n font-size: 16px;\r\n font-weight: 600;\r\n\r\n span {\r\n display: block;\r\n position: absolute;\r\n left: 50%;\r\n bottom: 4px;\r\n width: 100%;\r\n height: 4px;\r\n border-radius: 100px;\r\n transform: translateX(-50%);\r\n background: #fff;\r\n background: linear-gradient(90deg, #e93323 0%, #ff7931 100%);\r\n z-index: -1;\r\n }\r\n }\r\n\r\n &.on2 {\r\n height: 24px;\r\n text-align: center;\r\n line-height: 24px;\r\n color: #fff;\r\n background: linear-gradient(90deg, #e93323 0%, #ff7931 100%);\r\n border-radius: 50px;\r\n padding: 0 6px;\r\n }\r\n\r\n &.on3 {\r\n font-size: 16px;\r\n font-weight: 600;\r\n color: #e93323;\r\n\r\n span {\r\n position: absolute;\r\n width: 30px;\r\n height: 30px;\r\n border: 3px solid #e93323;\r\n border-left: 3px solid transparent !important;\r\n border-top: 3px solid transparent !important;\r\n border-right: 3px solid transparent !important;\r\n border-radius: 50%;\r\n bottom: -4px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n }\r\n }\r\n }\r\n}\r\n\r\n.home_product {\r\n overflow: hidden;\r\n\r\n .hd_nav {\r\n display: flex;\r\n height: 65px;\r\n overflow: hidden;\r\n padding: 10px 0;\r\n\r\n .item {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n margin-right: 37px;\r\n\r\n .title {\r\n font-size: 15px;\r\n color: #282828;\r\n text-align: center;\r\n }\r\n\r\n .label {\r\n width: 56px;\r\n height: 19px;\r\n line-height: 19px;\r\n text-align: center;\r\n background: transparent;\r\n border-radius: 10px;\r\n color: #999999;\r\n font-size: 11px;\r\n }\r\n\r\n &.active {\r\n .title {\r\n color: #ff4444;\r\n }\r\n\r\n .label {\r\n color: #fff;\r\n background: linear-gradient(270deg, rgba(255, 84, 0, 1) 0%, rgba(255, 0, 0, 1) 100%);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .list-wrapper {\r\n display: flex;\r\n flex-wrap: wrap;\r\n justify-content: space-between;\r\n\r\n .item {\r\n width: 48.5%;\r\n margin-bottom: 10px;\r\n position: relative;\r\n\r\n .jia {\r\n width: 22px;\r\n height: 22px;\r\n background-color: #e93323;\r\n border-radius: 50%;\r\n position: absolute;\r\n right: 10px;\r\n bottom: 8px;\r\n\r\n .jiaCon {\r\n width: 100%;\r\n height: 100%;\r\n text-align: center;\r\n line-height: 22px;\r\n\r\n .iconfont {\r\n color: #fff;\r\n font-size: 13px;\r\n }\r\n }\r\n }\r\n\r\n .img-box {\r\n width: 100%;\r\n height: 173px;\r\n\r\n .img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n img,\r\n .box {\r\n width: 65px;\r\n height: 50px;\r\n }\r\n\r\n .empty-box {\r\n background: #f3f9ff;\r\n }\r\n\r\n .box {\r\n background: #d8d8d8;\r\n }\r\n\r\n .label {\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n width: 46px;\r\n height: 22px;\r\n border-radius: 10px 0px 10px 0px;\r\n color: #fff;\r\n font-size: 13px;\r\n text-align: center;\r\n line-height: 22px;\r\n }\r\n }\r\n\r\n .info {\r\n padding: 7px 10px;\r\n background: #fff;\r\n border-radius: 0px 0px 10px 10px;\r\n\r\n .pictrue {\r\n // width: 99px;\r\n height: 14px;\r\n margin-top: 4px;\r\n\r\n img {\r\n // width: 100%;\r\n height: 100%;\r\n }\r\n }\r\n\r\n .title {\r\n font-size: 14px;\r\n color: #282828;\r\n }\r\n\r\n .sales {\r\n color: #999;\r\n font-size: 11px;\r\n }\r\n\r\n .price {\r\n display: flex;\r\n align-items: center;\r\n margin-top: 6px;\r\n\r\n img {\r\n width: 70px;\r\n height: 15px;\r\n }\r\n\r\n .num {\r\n font-size: 20px;\r\n margin-right: 4px;\r\n font-family: SemiBold;\r\n\r\n span {\r\n font-size: 12px;\r\n }\r\n }\r\n\r\n .label {\r\n width: 16px;\r\n height: 18px;\r\n margin-left: 5px;\r\n text-align: center;\r\n line-height: 18px;\r\n font-size: 11px;\r\n\r\n &.on {\r\n margin-left: 0;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n</style>\r\n"]}]}
|
