| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\components\\newsCategory\\index.vue?vue&type=style&index=0&id=5e8ffa44&lang=scss&scoped=true","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\components\\newsCategory\\index.vue","mtime":1761614938982},{"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:DQouY29udGVudEJveCB7DQogIGhlaWdodDogNjAwcHg7DQogIHdpZHRoOiAxMDAlOw0KICBwb3NpdGlvbjogcmVsYXRpdmU7DQogICNjb250ZW50IHsNCiAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgLyogdG9wOiAyODBweDsgKi8NCiAgICBib3R0b206IDA7DQogICAgd2lkdGg6IDg2JTsNCiAgICAvKiBoZWlnaHQgMTAwMHB4OyAqLw0KICB9DQp9DQouY29udGVudEJveCA6OnYtZGVlcCAudnVlLXdhdGVyZmFsbC1lYXN5IHsNCiAgd2lkdGg6IDEwMCUgIWltcG9ydGFudDsNCiAgbGVmdDogMCAhaW1wb3J0YW50Ow0KICBtYXJnaW4tbGVmdDogMCAhaW1wb3J0YW50Ow0KfQ0KLmNvbnRlbnRCb3ggOjp2LWRlZXAgLnZ1ZS13YXRlcmZhbGwtZWFzeS1zY3JvbGw6Oi13ZWJraXQtc2Nyb2xsYmFyIHsNCiAgZGlzcGxheTogbm9uZTsNCn0NCi5jb250ZW50Qm94IDo6di1kZWVwIC52dWUtd2F0ZXJmYWxsLWVhc3ktc2Nyb2xsIHsNCiAgc2Nyb2xsYmFyLXdpZHRoOiBub25lOyAvKiBmaXJlZm94ICovDQogIC1tcy1vdmVyZmxvdy1zdHlsZTogbm9uZTsgLyogSUUgMTArICovDQogIG92ZXJmbG93LXg6IGhpZGRlbjsNCiAgb3ZlcmZsb3cteTogYXV0bzsNCn0NCi5zb21lLWluZm8gew0KICBwYWRkaW5nOiA3cHg7DQogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7DQogIHRleHQtYWxpZ246IGNlbnRlcjsNCiAgd2hpdGUtc3BhY2U6IG5vd3JhcDsNCiAgb3ZlcmZsb3c6IGhpZGRlbjsNCiAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7DQp9DQouUmVmcmVzaCB7DQogIGZvbnQtc2l6ZTogMTJweDsNCiAgY29sb3I6IHZhcigtLXByZXYtY29sb3ItcHJpbWFyeSk7DQogIGN1cnNvcjogcG9pbnRlcjsNCiAgbGluZS1oZWlnaHQ6IDM1cHg7DQogIGRpc3BsYXk6IGlubGluZS1ibG9jazsNCn0NCi5uZXdzX3BpYyB7DQogIHdpZHRoOiAxMDAlOw0KICBoZWlnaHQ6IDE1MHB4Ow0KICBvdmVyZmxvdzogaGlkZGVuOw0KICBwb3NpdGlvbjogcmVsYXRpdmU7DQogIGJhY2tncm91bmQtc2l6ZTogY292ZXI7DQogIGJvcmRlci1yYWRpdXM6IDVweCA1cHggMCAwOw0KICBwYWRkaW5nOiAxMHB4Ow0KICBib3gtc2l6aW5nOiBib3JkZXItYm94Ow0KICBkaXNwbGF5OiBmbGV4Ow0KICBmbGV4LWRpcmVjdGlvbjogY29sdW1uOw0KICBhbGlnbi1pdGVtczogZmxleC1lbmQ7DQp9DQoubmV3c19zcCB7DQogIGZvbnQtc2l6ZTogMTJweDsNCiAgY29sb3I6ICMwMDAwMDA7DQogIGJhY2tncm91bmQ6ICNmZmY7DQogIHdpZHRoOiAxMDAlOw0KICBoZWlnaHQ6IDM4cHg7DQogIGxpbmUtaGVpZ2h0OiAzOHB4Ow0KICBwYWRkaW5nOiAwIDEycHg7DQogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7DQogIGRpc3BsYXk6IGJsb2NrOw0KfQ0KLm5ld3NfY2VudCB7DQogIHdpZHRoOiAxMDAlOw0KICBoZWlnaHQ6IGF1dG87DQogIGJhY2tncm91bmQ6ICNmZmY7DQogIGJvcmRlci10b3A6IDFweCBkYXNoZWQgI2VlZTsNCiAgZGlzcGxheTogZmxleDsNCiAgcGFkZGluZzogMTBweDsNCiAgYm94LXNpemluZzogYm9yZGVyLWJveDsNCiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuOw0KICAubmV3c19zcDEgew0KICAgIGZvbnQtc2l6ZTogMTJweDsNCiAgICBjb2xvcjogIzAwMDAwMDsNCiAgICB3aWR0aDogNzElOw0KICB9DQogIC5uZXdzX2NlbnRfaW1nIHsNCiAgICB3aWR0aDogODFweDsNCiAgICBoZWlnaHQ6IDQ2cHg7DQogICAgYm9yZGVyLXJhZGl1czogNnB4Ow0KICAgIG92ZXJmbG93OiBoaWRkZW47DQoNCiAgICBpbWcgew0KICAgICAgd2lkdGg6IDEwMCU7DQogICAgICBoZWlnaHQ6IDEwMCU7DQogICAgfQ0KICB9DQp9DQoubmV3c19waWMgOjp2LWRlZXAgLml2dS1idG4tZXJyb3Igew0KICB3aWR0aDogMjRweCAhaW1wb3J0YW50Ow0KICBoZWlnaHQ6IDI0cHggIWltcG9ydGFudDsNCiAgYmFja2dyb3VuZDogI2ZmNWQ1ZiAhaW1wb3J0YW50Ow0KICBjb2xvcjogI2ZmZiAhaW1wb3J0YW50Ow0KICBib3JkZXI6IDFweCBzb2xpZCAjZWVlICFpbXBvcnRhbnQ7DQp9DQoubmV3c19waWMgOjp2LWRlZXAgLml2dS1idG4tZXJyb3I6aG92ZXIgew0KICBiYWNrZ3JvdW5kOiAjZmY1ZDVmICFpbXBvcnRhbnQ7DQogIGJvcmRlcjogMXB4IHNvbGlkICNmZmYgIWltcG9ydGFudDsNCiAgY29sb3I6ICNmZmYgIWltcG9ydGFudDsNCn0NCi5uZXdzX3BpYyA6OnYtZGVlcCAuaXZ1LWJ0bi1zdWNjZXNzIHsNCiAgd2lkdGg6IDI0cHggIWltcG9ydGFudDsNCiAgaGVpZ2h0OiAyNHB4ICFpbXBvcnRhbnQ7DQogIGJvcmRlcjogMXB4IHNvbGlkICNlZWUgIWltcG9ydGFudDsNCn0NCg=="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AA+RA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/newsCategory","sourcesContent":["<template>\r\n <div :style=\"{ height: scrollerHeight + 'px' || '' }\">\r\n <div>\r\n <el-form\r\n ref=\"formValidate\"\r\n inline\r\n :model=\"formValidate\"\r\n label-width=\"80px\"\r\n label-position=\"right\"\r\n class=\"tabform\"\r\n >\r\n <el-form-item label=\"图文搜索：\" prop=\"cate_name\" label-for=\"cate_name\">\r\n <el-input clearable placeholder=\"请输入\" v-model=\"formValidate.cate_name\" class=\"form_content_width\" />\r\n </el-form-item>\r\n <el-form-item>\r\n <el-button type=\"primary\" v-db-click @click=\"userSearchs\">查询</el-button>\r\n <router-link :to=\"routePre + '/app/wechat/news_category/save/0'\">\r\n <el-button type=\"primary\" class=\"bnt ml15\">添加图文消息</el-button>\r\n </router-link>\r\n </el-form-item>\r\n </el-form>\r\n </div>\r\n <div class=\"contentBox\">\r\n <div id=\"content\" :style=\"{ top: contentTop + 'px' || '', width: contentWidth }\" ref=\"content\">\r\n <vue-waterfall-easy\r\n :imgsArr=\"imgsArr\"\r\n :maxCols=\"maxCol\"\r\n :width=\"screenWidth\"\r\n v-db-click\r\n @click=\"clickFn\"\r\n @scrollReachBottom=\"getData\"\r\n ref=\"waterfall\"\r\n :reachBottomDistance=\"30\"\r\n >\r\n <div class=\"img-info\" slot-scope=\"props\" v-if=\"props.value.new.length !== 0\">\r\n <div v-for=\"(j, i) in props.value.new\" :key=\"i\">\r\n <div v-if=\"i === 0\">\r\n <div\r\n class=\"news_pic\"\r\n :style=\"{\r\n backgroundImage: 'url(' + j.image_input[0] + ')',\r\n backgroundSize: '100% 100%',\r\n }\"\r\n @mouseenter=\"mouseenterOut(j)\"\r\n @mouseleave=\"mouseenterOver(j)\"\r\n >\r\n <el-button\r\n type=\"success\"\r\n icon=\"el-icon-edit\"\r\n v-show=\"props.value.new[i].isDel && isShow\"\r\n v-db-click\r\n @click=\"clkk(props.value)\"\r\n ></el-button>\r\n <el-button\r\n type=\"error\"\r\n icon=\"el-icon-delete\"\r\n v-show=\"props.value.new[i].isDel && isShow\"\r\n v-db-click\r\n @click=\"del(props.value, '删除图文', i)\"\r\n style=\"margin-top: 5px\"\r\n ></el-button>\r\n <el-button\r\n type=\"primary\"\r\n icon=\"el-icon-s-promotion\"\r\n v-show=\"props.value.new[i].isDel && isShowSend\"\r\n v-db-click\r\n @click=\"send(props.value, '发送', i)\"\r\n >推送</el-button\r\n >\r\n </div>\r\n <span class=\"news_sp\">{{ j.title }}</span>\r\n </div>\r\n <div v-else class=\"news_cent\">\r\n <span class=\"news_sp1\" v-if=\"j.synopsis\">{{ j.title }}</span>\r\n <div class=\"news_cent_img\" v-if=\"j.image_input.length !== 0\">\r\n <img :src=\"j.image_input[0]\" />\r\n </div>\r\n </div>\r\n </div>\r\n <p class=\"some-info\">{{ props.value.id }}</p>\r\n </div>\r\n <div slot=\"waterfall-over\"></div>\r\n </vue-waterfall-easy>\r\n </div>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport vueWaterfallEasy from 'vue-waterfall-easy';\r\nimport { wechatNewsListApi } from '@/api/app';\r\nimport { mapState } from 'vuex';\r\nimport settings from '@/setting';\r\nexport default {\r\n name: 'newsCategory',\r\n props: {\r\n scrollerHeight: {\r\n type: String,\r\n default: '100%',\r\n },\r\n contentTop: {\r\n type: String,\r\n default: '0',\r\n },\r\n contentWidth: {\r\n type: String,\r\n default: '100%',\r\n },\r\n maxCols: {\r\n type: Number,\r\n default: 5,\r\n },\r\n isShow: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n isShowSend: {\r\n type: Boolean,\r\n default: false,\r\n },\r\n userIds: {\r\n type: Array,\r\n default: () => {\r\n [];\r\n },\r\n },\r\n },\r\n components: {\r\n vueWaterfallEasy,\r\n },\r\n data() {\r\n return {\r\n routePre: settings.routePre,\r\n isDel: false,\r\n imgsArr: [],\r\n group: 0, // 当前加载的加载图片的次数\r\n fetchImgsArr: [], // 存放每次滚动时下一批要加载的图片的数组\r\n orderData: {},\r\n cols: NaN, // 需要根据窗口宽度初始化\r\n gridPic: {\r\n xl: 6,\r\n lg: 8,\r\n md: 8,\r\n sm: 24,\r\n xs: 24,\r\n },\r\n grid: {\r\n xl: 8,\r\n lg: 8,\r\n md: 8,\r\n sm: 24,\r\n xs: 24,\r\n },\r\n formValidate: {\r\n cate_name: '',\r\n page: 1,\r\n limit: 10,\r\n },\r\n screenWidth: document.body.clientWidth - 200,\r\n maxCol: 1,\r\n };\r\n },\r\n created() {\r\n if (this.maxCols === 5) {\r\n this.$set(this, 'maxCol', this.screenWidth / 240);\r\n } else {\r\n this.maxCol = this.maxCols;\r\n }\r\n this.getData();\r\n },\r\n mounted() {},\r\n computed: {},\r\n methods: {\r\n // 发送图文消息\r\n send(row, tit, num) {\r\n let delfromData = {\r\n title: tit,\r\n num: num,\r\n url: `app/wechat/push`,\r\n method: 'post',\r\n ids: {\r\n id: row.id,\r\n user_ids: this.userIds,\r\n },\r\n };\r\n this.$modalSure(delfromData)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n })\r\n .catch((res) => {\r\n this.$message.error(res.msg);\r\n });\r\n },\r\n clickFn(event, { index, value }) {\r\n event.preventDefault();\r\n if (event.target.tagName.toLowerCase() === 'div') {\r\n this.$emit('getCentList', value);\r\n }\r\n },\r\n // 删除\r\n del(row, tit, num) {\r\n let delfromData = {\r\n title: tit,\r\n num: num,\r\n url: `app/wechat/news/${row.id}`,\r\n method: 'DELETE',\r\n ids: '',\r\n };\r\n this.$modalSure(delfromData)\r\n .then((res) => {\r\n this.$message.success(res.msg);\r\n this.$nextTick(() => {\r\n this.imgsArr = [];\r\n });\r\n this.formValidate.page = 1;\r\n this.getData();\r\n })\r\n .catch((res) => {\r\n this.$message.error(res.msg);\r\n });\r\n },\r\n // 删除成功\r\n // submitModel () {\r\n // if (this.delfromData.title === '删除图文') {\r\n // // this.imgsArr.splice(this.delfromData.num, 1)\r\n // this.$nextTick(() => {\r\n // this.imgsArr = [];\r\n // })\r\n // this.formValidate.page = 1;\r\n // this.getData();\r\n // }\r\n // },\r\n // 编辑\r\n clkk(item) {\r\n this.$router.push({\r\n path: this.routePre + '/app/wechat/news_category/save/' + item.id,\r\n });\r\n },\r\n // 鼠标移进\r\n mouseenterOut(item) {\r\n this.$set(item, 'isDel', true);\r\n },\r\n // 鼠标移出\r\n mouseenterOver(item) {\r\n this.$set(item, 'isDel', false);\r\n },\r\n // 搜索\r\n userSearchs() {\r\n this.$nextTick(() => {\r\n this.imgsArr = [];\r\n });\r\n this.formValidate.page = 1;\r\n this.getData();\r\n },\r\n // 瀑布流数据\r\n getData() {\r\n wechatNewsListApi(this.formValidate)\r\n .then(async (res) => {\r\n if (res.data.list.length === 0) {\r\n // 模拟已经无新数据，显示 slot=\"waterfall-over\"\r\n this.imgsArr = [];\r\n this.$nextTick(() => {\r\n this.$refs.waterfall.waterfallOver();\r\n });\r\n } else {\r\n let num = Math.ceil(res.data.count / this.formValidate.limit) + 1;\r\n res.data.list.map((item) => {\r\n item.isDel = false;\r\n });\r\n this.imgsArr = this.imgsArr.concat(res.data.list) || [];\r\n this.formValidate.page++;\r\n if (this.formValidate.page === num) {\r\n // 模拟已经无新数据，显示 slot=\"waterfall-over\"\r\n this.$refs.waterfall.waterfallOver();\r\n return;\r\n }\r\n }\r\n })\r\n .catch((res) => {\r\n this.$message.error(res.msg);\r\n });\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.contentBox {\r\n height: 600px;\r\n width: 100%;\r\n position: relative;\r\n #content {\r\n position: absolute;\r\n /* top: 280px; */\r\n bottom: 0;\r\n width: 86%;\r\n /* height 1000px; */\r\n }\r\n}\r\n.contentBox ::v-deep .vue-waterfall-easy {\r\n width: 100% !important;\r\n left: 0 !important;\r\n margin-left: 0 !important;\r\n}\r\n.contentBox ::v-deep .vue-waterfall-easy-scroll::-webkit-scrollbar {\r\n display: none;\r\n}\r\n.contentBox ::v-deep .vue-waterfall-easy-scroll {\r\n scrollbar-width: none; /* firefox */\r\n -ms-overflow-style: none; /* IE 10+ */\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n}\r\n.some-info {\r\n padding: 7px;\r\n box-sizing: border-box;\r\n text-align: center;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n}\r\n.Refresh {\r\n font-size: 12px;\r\n color: var(--prev-color-primary);\r\n cursor: pointer;\r\n line-height: 35px;\r\n display: inline-block;\r\n}\r\n.news_pic {\r\n width: 100%;\r\n height: 150px;\r\n overflow: hidden;\r\n position: relative;\r\n background-size: cover;\r\n border-radius: 5px 5px 0 0;\r\n padding: 10px;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n}\r\n.news_sp {\r\n font-size: 12px;\r\n color: #000000;\r\n background: #fff;\r\n width: 100%;\r\n height: 38px;\r\n line-height: 38px;\r\n padding: 0 12px;\r\n box-sizing: border-box;\r\n display: block;\r\n}\r\n.news_cent {\r\n width: 100%;\r\n height: auto;\r\n background: #fff;\r\n border-top: 1px dashed #eee;\r\n display: flex;\r\n padding: 10px;\r\n box-sizing: border-box;\r\n justify-content: space-between;\r\n .news_sp1 {\r\n font-size: 12px;\r\n color: #000000;\r\n width: 71%;\r\n }\r\n .news_cent_img {\r\n width: 81px;\r\n height: 46px;\r\n border-radius: 6px;\r\n overflow: hidden;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n }\r\n}\r\n.news_pic ::v-deep .ivu-btn-error {\r\n width: 24px !important;\r\n height: 24px !important;\r\n background: #ff5d5f !important;\r\n color: #fff !important;\r\n border: 1px solid #eee !important;\r\n}\r\n.news_pic ::v-deep .ivu-btn-error:hover {\r\n background: #ff5d5f !important;\r\n border: 1px solid #fff !important;\r\n color: #fff !important;\r\n}\r\n.news_pic ::v-deep .ivu-btn-success {\r\n width: 24px !important;\r\n height: 24px !important;\r\n border: 1px solid #eee !important;\r\n}\r\n</style>\r\n"]}]}
|
