| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\components\\mobilePage\\home_menu.vue?vue&type=style&index=0&id=5ac953de&scoped=true&lang=scss","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\components\\mobilePage\\home_menu.vue","mtime":1761614938971},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\css-loader\\index.js","mtime":1761614929364},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1761614937403},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\postcss-loader\\src\\index.js","mtime":1761614935133},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":1761614936391},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQoubGlzdF9tZW51IHsNCiAgcGFkZGluZzogMCAxMnB4IDEycHg7DQogIGRpc3BsYXk6IGZsZXg7DQogIGZsZXgtd3JhcDogd3JhcDsNCg0KICAuaXRlbSB7DQogICAgbWFyZ2luLXRvcDogMTJweDsNCiAgICBmb250LXNpemU6IDEycHg7DQogICAgY29sb3I6ICMzMzM7DQogICAgdGV4dC1hbGlnbjogY2VudGVyOw0KICAgIHdpZHRoOiAzMy4zMzMzJTsNCg0KICAgICYuZm91ciB7DQogICAgICB3aWR0aDogMjUlOw0KICAgIH0NCg0KICAgICYuZml2ZSB7DQogICAgICB3aWR0aDogMjAlOw0KICAgIH0NCg0KICAgIC5pbWctYm94IHsNCiAgICAgIHdpZHRoOiA0NXB4Ow0KICAgICAgaGVpZ2h0OiA0NXB4Ow0KICAgICAgbWFyZ2luOiAwIGF1dG8gOHB4IGF1dG87DQoNCiAgICAgICYub24gew0KICAgICAgICBtYXJnaW4tYm90dG9tOiAwOw0KICAgICAgfQ0KDQogICAgICBpbWcgew0KICAgICAgICB3aWR0aDogMTAwJTsNCiAgICAgICAgaGVpZ2h0OiAxMDAlOw0KICAgICAgfQ0KICAgIH0NCiAgfQ0KDQogIC5pY29udHVwaWFuIHsNCiAgICBmb250LXNpemU6IDE2cHg7DQogIH0NCn0NCg0KLmhvbWVfbWVudSB7DQogIHBhZGRpbmc6IDAgMTJweCAxMnB4Ow0KICBkaXNwbGF5OiBmbGV4Ow0KICBvdmVyZmxvdzogaGlkZGVuOw0KDQogIC5tZW51LWl0ZW0gew0KICAgIG1hcmdpbi10b3A6IDEycHg7DQogICAgZm9udC1zaXplOiAxMXB4Ow0KICAgIGNvbG9yOiAjMjgyODI4Ow0KICAgIHRleHQtYWxpZ246IGNlbnRlcjsNCiAgICBtYXJnaW4tcmlnaHQ6IDI3cHg7DQoNCiAgICAuaW1nLWJveCB7DQogICAgICB3aWR0aDogNTBweDsNCiAgICAgIGhlaWdodDogNTBweDsNCg0KICAgICAgJi5vbiB7DQogICAgICAgIGJvcmRlci1yYWRpdXM6IDUwJTsNCg0KICAgICAgICBpbWcsDQogICAgICAgIC5lbXB0eS1ib3ggew0KICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDUwJTsNCiAgICAgICAgfQ0KICAgICAgfQ0KICAgIH0NCg0KICAgIC5ib3gsDQogICAgaW1nIHsNCiAgICAgIHdpZHRoOiAxMDAlOw0KICAgICAgaGVpZ2h0OiAxMDAlOw0KICAgIH0NCg0KICAgIC5ib3ggew0KICAgICAgYmFja2dyb3VuZDogI2Q4ZDhkODsNCiAgICB9DQoNCiAgICBwIHsNCiAgICAgIG1hcmdpbi10b3A6IDVweDsNCiAgICB9DQogIH0NCg0KICAmLm9uIHsNCiAgICAubWVudS1pdGVtIHsNCiAgICAgIG1hcmdpbi1yaWdodDogNTFweDsNCg0KICAgICAgJjpudGgtY2hpbGQoNW4pIHsNCiAgICAgICAgbWFyZ2luLXJpZ2h0OiA1MXB4Ow0KICAgICAgfQ0KDQogICAgICAmOm50aC1jaGlsZCg0bikgew0KICAgICAgICBtYXJnaW4tcmlnaHQ6IDA7DQogICAgICB9DQogICAgfQ0KICB9DQoNCiAgLmljb250dXBpYW4gew0KICAgIGZvbnQtc2l6ZTogMTZweDsNCiAgfQ0KfQ0KDQouZG90IHsNCiAgZGlzcGxheTogZmxleDsNCiAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7DQogIHBhZGRpbmctYm90dG9tOiAxMHB4Ow0KDQogICYubnVtYmVyIHsNCiAgICBib3R0b206IDE1cHg7DQogIH0NCg0KICAubnVtIHsNCiAgICB3aWR0aDogMjVweDsNCiAgICBoZWlnaHQ6IDE4cHg7DQogICAgbGluZS1oZWlnaHQ6IDE4cHg7DQogICAgYmFja2dyb3VuZC1jb2xvcjogIzAwMDsNCiAgICBjb2xvcjogI2ZmZjsNCiAgICBvcGFjaXR5OiAwLjM7DQogICAgYm9yZGVyLXJhZGl1czogOHB4Ow0KICAgIGZvbnQtc2l6ZTogMTJweDsNCiAgICB0ZXh0LWFsaWduOiBjZW50ZXI7DQogIH0NCg0KICAuZG90LWl0ZW0gew0KICAgIHdpZHRoOiAxMHB4Ow0KICAgIGhlaWdodDogM3B4Ow0KICAgIGJhY2tncm91bmQ6ICNkZGRkZGQ7DQogICAgYm9yZGVyLXJhZGl1czogNTAlOw0KICAgIG1hcmdpbjogMCAzcHg7DQogIH0NCn0NCg0KLmVtcHR5LWJveCB7DQogIGJhY2tncm91bmQ6ICNmM2Y5ZmY7DQoNCiAgaW1nIHsNCiAgICB3aWR0aDogMjZweCAhaW1wb3J0YW50Ow0KICAgIGhlaWdodDogMjBweCAhaW1wb3J0YW50Ow0KICB9DQp9DQo="},{"version":3,"sources":["home_menu.vue"],"names":[],"mappings":";AAqgBA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA","file":"home_menu.vue","sourceRoot":"src/components/mobilePage","sourcesContent":["<template>\r\n <div\r\n :style=\"{\r\n background: bottomBgColor,\r\n marginTop: slider + '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\r\n :style=\"{\r\n background: `linear-gradient(90deg,${bgColorLeft} 0%,${bgColorRight} 100%)`,\r\n borderRadius: fillet\r\n ? valList[0].val + 'px ' + valList[1].val + 'px ' + valList[3].val + 'px ' + valList[2].val + 'px'\r\n : filletVal + 'px',\r\n }\"\r\n >\r\n <div class=\"mobile-page\">\r\n <div class=\"list_menu\">\r\n <div\r\n class=\"item\"\r\n :class=\"number === 1 ? 'four' : number === 2 ? 'five' : ''\"\r\n v-for=\"(item, index) in vuexMenu\"\r\n :key=\"index\"\r\n v-if=\"item.show\"\r\n >\r\n <div class=\"img-box\" :class=\"menuStyleConfig == 1 ? 'on' : ''\" v-if=\"menuStyleConfig != 2\">\r\n <img\r\n :src=\"item.img\"\r\n alt=\"\"\r\n v-if=\"item.img\"\r\n :style=\"{\r\n borderRadius: filletImg\r\n ? valListImg[0].val +\r\n 'px ' +\r\n valListImg[1].val +\r\n 'px ' +\r\n valListImg[3].val +\r\n 'px ' +\r\n valListImg[2].val +\r\n 'px'\r\n : filletValImg + 'px',\r\n }\"\r\n />\r\n <div\r\n class=\"empty-box on\"\r\n :style=\"{\r\n borderRadius: filletImg\r\n ? valListImg[0].val +\r\n 'px ' +\r\n valListImg[1].val +\r\n 'px ' +\r\n valListImg[3].val +\r\n 'px ' +\r\n valListImg[2].val +\r\n 'px'\r\n : filletValImg + 'px',\r\n }\"\r\n v-else\r\n >\r\n <img src=\"../../assets/images/shan.png\" />\r\n </div>\r\n </div>\r\n <p v-if=\"menuStyleConfig != 1\" :style=\"'color:' + textColor\">{{ item.info[0].value }}</p>\r\n </div>\r\n </div>\r\n </div>\r\n <!--单行展示-->\r\n <!-- <div class=\"mobile-page\" v-else>\r\n\t\t <div class=\"home_menu\">\r\n\t\t <div class=\"menu-item\" v-for=\"(item,index) in vuexMenu\" :key=\"index\">\r\n\t\t <div class=\"img-box\" :class=\"menuStyle?'on':''\">\r\n\t\t <img :src=\"item.img\" alt=\"\" v-if=\"item.img\">\r\n\t\t <div class=\"empty-box on\" v-else> <span class=\"iconfont-diy icontupian\"></span> </div>\r\n\t\t </div>\r\n\t\t <p :style=\"{color:txtColor}\">{{item.info[0].value}}</p>\r\n\t\t </div>\r\n\t\t </div>\r\n\t\t </div> -->\r\n <div class=\"dot\" v-if=\"showConfig\">\r\n <div class=\"dot-item\" :style=\"{ background: toneConfig ? `${pointerColor}` : `${colorStyle.theme}` }\"></div>\r\n <div class=\"dot-item\" :style=\"{ background: toneConfig ? `${pointerBgColor}` : '' }\" v-for=\"item in 2\"></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_menu',\r\n cname: '导航组',\r\n icon: '#iconzujian-daohangzu',\r\n configName: 'c_home_menu',\r\n type: 0, // 0 基础组件 1 营销组件 2工具组件\r\n defaultName: 'menus', // 外面匹配名称\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 let 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 let 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: 'menus',\r\n timestamp: this.num,\r\n isHide: false,\r\n setUp: {\r\n tabVal: 0,\r\n },\r\n titleLeft: '展示设置',\r\n titleContent: '内容设置',\r\n titleRight: '图片样式',\r\n titlePointer: '指示器设置',\r\n titleCurrency: '通用样式',\r\n menuStyleConfig: {\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 name: '文字',\r\n },\r\n ],\r\n },\r\n number: {\r\n title: '单行显示',\r\n tabVal: 1,\r\n tabList: [\r\n {\r\n name: '3个',\r\n },\r\n {\r\n name: '4个',\r\n },\r\n {\r\n name: '5个',\r\n },\r\n ],\r\n },\r\n showConfig: {\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 rowsNum: {\r\n title: '显示行数',\r\n tabVal: 0,\r\n tabList: [\r\n {\r\n name: '1行',\r\n },\r\n {\r\n name: '2行',\r\n },\r\n {\r\n name: '3行',\r\n },\r\n {\r\n name: '4行',\r\n },\r\n ],\r\n },\r\n filletImg: {\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 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 pointerBgColor: {\r\n title: '常规样式',\r\n default: [\r\n {\r\n item: '#DDDDDD',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#DDDDDD',\r\n },\r\n ],\r\n },\r\n pointerColor: {\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 bgColor: {\r\n title: '组件背景',\r\n default: [\r\n {\r\n item: '#fff',\r\n },\r\n {\r\n item: '#fff',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#fff',\r\n },\r\n {\r\n item: '#fff',\r\n },\r\n ],\r\n },\r\n textColor: {\r\n title: '文字颜色',\r\n default: [\r\n {\r\n item: '#333',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#333',\r\n },\r\n ],\r\n },\r\n bottomBgColor: {\r\n title: '底部背景',\r\n default: [\r\n {\r\n item: '#fff',\r\n },\r\n ],\r\n color: [\r\n {\r\n item: '#fff',\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: 0,\r\n min: 0,\r\n },\r\n // 页面间距\r\n mbConfig: {\r\n title: '页面上间距',\r\n val: 0,\r\n min: 0,\r\n },\r\n menuConfig: {\r\n title: '最多可添加1张图片,建议宽度90 * 90px',\r\n bnt: '添加',\r\n type: 1,\r\n maxList: 100,\r\n list: [\r\n {\r\n img: '',\r\n show: true,\r\n info: [\r\n {\r\n title: '标题',\r\n value: '标题',\r\n tips: '选填,不超过4个字',\r\n max: 4,\r\n },\r\n {\r\n title: '链接',\r\n value: '',\r\n tips: '请输入链接',\r\n max: 100,\r\n },\r\n ],\r\n },\r\n {\r\n img: '',\r\n show: true,\r\n info: [\r\n {\r\n title: '标题',\r\n value: '标题',\r\n tips: '选填,不超过4个字',\r\n max: 4,\r\n },\r\n {\r\n title: '链接',\r\n value: '',\r\n tips: '请输入链接',\r\n max: 100,\r\n },\r\n ],\r\n },\r\n {\r\n img: '',\r\n show: true,\r\n info: [\r\n {\r\n title: '标题',\r\n value: '标题',\r\n tips: '选填,不超过4个字',\r\n max: 4,\r\n },\r\n {\r\n title: '链接',\r\n value: '',\r\n tips: '请输入链接',\r\n max: 100,\r\n },\r\n ],\r\n },\r\n {\r\n img: '',\r\n show: true,\r\n info: [\r\n {\r\n title: '标题',\r\n value: '标题',\r\n tips: '选填,不超过4个字',\r\n max: 4,\r\n },\r\n {\r\n title: '链接',\r\n value: '',\r\n tips: '请输入链接',\r\n max: 100,\r\n },\r\n ],\r\n },\r\n ],\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 vuexMenu: [],\r\n boxStyle: '',\r\n slider: '',\r\n bgColorLeft: '',\r\n bgColorRight: '',\r\n bottomBgColor: '',\r\n number: 0,\r\n rowsNum: 0,\r\n textColor: '',\r\n pointerColor: '',\r\n pointerBgColor: '',\r\n pageData: {},\r\n prConfig: 0,\r\n menuStyleConfig: 0,\r\n showConfig: 0,\r\n filletImg: 0,\r\n filletValImg: 0,\r\n valListImg: [],\r\n fillet: 0,\r\n filletVal: 0,\r\n valList: [],\r\n toneConfig: 0,\r\n topConfig: 0,\r\n bottomConfig: 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 // 对象转数组\r\n objToArr(data) {\r\n let obj = Object.keys(data);\r\n let m = obj.map((key) => data[key]);\r\n return m;\r\n },\r\n setConfig(data) {\r\n if (!data) return;\r\n if (data.mbConfig) {\r\n this.menuStyleConfig = data.menuStyleConfig.tabVal;\r\n this.showConfig = data.showConfig.tabVal;\r\n this.filletImg = data.filletImg.type;\r\n this.filletValImg = data.filletImg.val;\r\n this.valListImg = data.filletImg.valList;\r\n this.fillet = data.fillet.type;\r\n this.filletVal = data.fillet.val;\r\n this.valList = data.fillet.valList;\r\n this.toneConfig = data.toneConfig.tabVal;\r\n this.pointerColor = data.pointerColor.color[0].item;\r\n this.pointerBgColor = data.pointerBgColor.color[0].item;\r\n this.bottomBgColor = data.bottomBgColor.color[0].item;\r\n this.textColor = data.textColor.color[0].item;\r\n this.slider = data.mbConfig.val;\r\n this.prConfig = data.prConfig.val;\r\n this.topConfig = data.topConfig.val;\r\n this.bottomConfig = data.bottomConfig.val;\r\n this.bgColorLeft = data.bgColor.color[0].item;\r\n this.bgColorRight = data.bgColor.color[1].item;\r\n let rowsNum = data.rowsNum.tabVal;\r\n let number = data.number.tabVal;\r\n let lists = this.objToArr(data.menuConfig.list);\r\n let list = [];\r\n lists.forEach((item) => {\r\n if (item.show) {\r\n list.push(item);\r\n }\r\n });\r\n this.number = number;\r\n this.rowsNum = rowsNum;\r\n if (this.showConfig) {\r\n this.vuexMenu = list.splice(0, (rowsNum + 1) * (number + 3));\r\n } else {\r\n this.vuexMenu = lists;\r\n }\r\n }\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style scoped lang=\"scss\">\r\n.list_menu {\r\n padding: 0 12px 12px;\r\n display: flex;\r\n flex-wrap: wrap;\r\n\r\n .item {\r\n margin-top: 12px;\r\n font-size: 12px;\r\n color: #333;\r\n text-align: center;\r\n width: 33.3333%;\r\n\r\n &.four {\r\n width: 25%;\r\n }\r\n\r\n &.five {\r\n width: 20%;\r\n }\r\n\r\n .img-box {\r\n width: 45px;\r\n height: 45px;\r\n margin: 0 auto 8px auto;\r\n\r\n &.on {\r\n margin-bottom: 0;\r\n }\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n }\r\n }\r\n\r\n .icontupian {\r\n font-size: 16px;\r\n }\r\n}\r\n\r\n.home_menu {\r\n padding: 0 12px 12px;\r\n display: flex;\r\n overflow: hidden;\r\n\r\n .menu-item {\r\n margin-top: 12px;\r\n font-size: 11px;\r\n color: #282828;\r\n text-align: center;\r\n margin-right: 27px;\r\n\r\n .img-box {\r\n width: 50px;\r\n height: 50px;\r\n\r\n &.on {\r\n border-radius: 50%;\r\n\r\n img,\r\n .empty-box {\r\n border-radius: 50%;\r\n }\r\n }\r\n }\r\n\r\n .box,\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n .box {\r\n background: #d8d8d8;\r\n }\r\n\r\n p {\r\n margin-top: 5px;\r\n }\r\n }\r\n\r\n &.on {\r\n .menu-item {\r\n margin-right: 51px;\r\n\r\n &:nth-child(5n) {\r\n margin-right: 51px;\r\n }\r\n\r\n &:nth-child(4n) {\r\n margin-right: 0;\r\n }\r\n }\r\n }\r\n\r\n .icontupian {\r\n font-size: 16px;\r\n }\r\n}\r\n\r\n.dot {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding-bottom: 10px;\r\n\r\n &.number {\r\n bottom: 15px;\r\n }\r\n\r\n .num {\r\n width: 25px;\r\n height: 18px;\r\n line-height: 18px;\r\n background-color: #000;\r\n color: #fff;\r\n opacity: 0.3;\r\n border-radius: 8px;\r\n font-size: 12px;\r\n text-align: center;\r\n }\r\n\r\n .dot-item {\r\n width: 10px;\r\n height: 3px;\r\n background: #dddddd;\r\n border-radius: 50%;\r\n margin: 0 3px;\r\n }\r\n}\r\n\r\n.empty-box {\r\n background: #f3f9ff;\r\n\r\n img {\r\n width: 26px !important;\r\n height: 20px !important;\r\n }\r\n}\r\n</style>\r\n"]}]}
|