| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\user\\list\\handle\\userDetails.vue?vue&type=style&index=0&id=2b718961&lang=scss&scoped=true","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\user\\list\\handle\\userDetails.vue","mtime":1761614939081},{"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:DQouYXZhdGFyIHsNCiAgd2lkdGg6IDYwcHg7DQogIGhlaWdodDogNjBweDsNCiAgYm9yZGVyLXJhZGl1czogNTAlOw0KICBvdmVyZmxvdzogaGlkZGVuOw0KICBpbWcgew0KICAgIHdpZHRoOiAxMDAlOw0KICAgIGhlaWdodDogMTAwJTsNCiAgfQ0KfQ0KOjp2LWRlZXAgLmVsLWRyYXdlcl9fYm9keSB7DQogIHBhZGRpbmc6IDIwcHggMCAhaW1wb3J0YW50Ow0KfQ0KOjp2LWRlZXAgLmVsLXRhYnMtLWJvcmRlci1jYXJkID4gLmVsLXRhYnNfX2NvbnRlbnQgew0KICBwYWRkaW5nOiAwIDM1cHg7DQp9DQo6OnYtZGVlcCAuZWwtdGFicy0tYm9yZGVyLWNhcmQgPiAuZWwtdGFic19faGVhZGVyLA0KOjp2LWRlZXAgLmVsLXRhYnMtLWJvcmRlci1jYXJkID4gLmVsLXRhYnNfX2hlYWRlciAuZWwtdGFic19faXRlbTphY3RpdmUgew0KICBib3JkZXI6IG5vbmU7DQogIGhlaWdodDogNDBweDsNCn0NCjo6di1kZWVwIC5lbC10YWJzLS1ib3JkZXItY2FyZCA+IC5lbC10YWJzX19oZWFkZXIgLmVsLXRhYnNfX2l0ZW0uaXMtYWN0aXZlIHsNCiAgYm9yZGVyOiBub25lOw0KICBib3JkZXItdG9wOiAycHggc29saWQgdmFyKC0tcHJldi1jb2xvci1wcmltYXJ5KTsNCiAgZm9udC1zaXplOiAxM3B4Ow0KICBmb250LXdlaWdodDogNTAwOw0KICBjb2xvcjogIzMwMzEzMzsNCiAgbGluZS1oZWlnaHQ6IDE2cHg7DQp9DQo6OnYtZGVlcCAuZWwtdGFicy0tYm9yZGVyLWNhcmQgPiAuZWwtdGFic19faGVhZGVyIC5lbC10YWJzX19pdGVtIHsNCiAgYm9yZGVyOiBub25lOw0KfQ0KOjp2LWRlZXAgLmVsLXRhYnMtLWJvcmRlci1jYXJkID4gLmVsLXRhYnNfX2hlYWRlciAuZWwtdGFic19faXRlbSB7DQogIG1hcmdpbi10b3A6IDA7DQogIHRyYW5zaXRpb246IG5vbmU7DQogIGhlaWdodDogNDBweCAhaW1wb3J0YW50Ow0KICBsaW5lLWhlaWdodDogNDBweCAhaW1wb3J0YW50Ow0KICB3aWR0aDogOTJweCAhaW1wb3J0YW50Ow0KICBmb250LXNpemU6IDEzcHg7DQogIGZvbnQtd2VpZ2h0OiA0MDA7DQogIGNvbG9yOiAjMzAzMTMzOw0KICBsaW5lLWhlaWdodDogMTZweDsNCn0NCjo6di1kZWVwIC5lbC10YWJzLS1ib3JkZXItY2FyZCB7DQogIGJvcmRlcjogbm9uZTsNCiAgYm94LXNoYWRvdzogbm9uZTsNCn0NCi5oZWFkIHsNCiAgcG9zaXRpb246IHJlbGF0aXZlOw0KICBwYWRkaW5nOiAwIDE1cHg7DQogIC5lZGl0LWJ0biB7DQogICAgcG9zaXRpb246IGFic29sdXRlOw0KICAgIHJpZ2h0OiAyMHB4Ow0KICAgIHRvcDogMHB4Ow0KICAgIGRpc3BsYXk6IGZsZXg7DQogICAgYWxpZ24taXRlbXM6IGNlbnRlcjsNCiAgfQ0KfQ0KLmRhc2hib2FyZC13b3JrcGxhY2Ugew0KICAmLWhlYWRlciB7DQogICAgJi1hdmF0YXIgew0KICAgICAgd2lkdGg6IDY0cHg7DQogICAgICBoZWlnaHQ6IDY0cHg7DQogICAgICBib3JkZXItcmFkaXVzOiA1MCU7DQogICAgICBtYXJnaW4tcmlnaHQ6IDE2cHg7DQogICAgICBmb250LXdlaWdodDogNjAwOw0KICAgIH0NCg0KICAgICYtdGlwIHsNCiAgICAgIHdpZHRoOiA4MiU7DQogICAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7DQogICAgICB2ZXJ0aWNhbC1hbGlnbjogbWlkZGxlOw0KDQogICAgICAmLXRpdGxlIHsNCiAgICAgICAgZm9udC1zaXplOiAxM3B4Ow0KICAgICAgICBjb2xvcjogIzAwMDAwMDsNCiAgICAgICAgbWFyZ2luLWJvdHRvbTogMTJweDsNCiAgICAgIH0NCg0KICAgICAgJi1kZXNjIHsNCiAgICAgICAgJi1zcCB7DQogICAgICAgICAgd2lkdGg6IDMzLjMzJTsNCiAgICAgICAgICBjb2xvcjogIzE3MjMzZDsNCiAgICAgICAgICBmb250LXNpemU6IDEzcHg7DQogICAgICAgICAgZGlzcGxheTogaW5saW5lLWJsb2NrOw0KICAgICAgICB9DQogICAgICB9DQogICAgfQ0KDQogICAgJi1leHRyYSB7DQogICAgICAuaXZ1LWNvbCB7DQogICAgICAgIHAgew0KICAgICAgICAgIHRleHQtYWxpZ246IHJpZ2h0Ow0KICAgICAgICB9DQoNCiAgICAgICAgcDpmaXJzdC1jaGlsZCB7DQogICAgICAgICAgc3BhbjpmaXJzdC1jaGlsZCB7DQogICAgICAgICAgICBtYXJnaW4tcmlnaHQ6IDRweDsNCiAgICAgICAgICB9DQoNCiAgICAgICAgICBzcGFuOmxhc3QtY2hpbGQgew0KICAgICAgICAgICAgY29sb3I6ICM4MDg2OTU7DQogICAgICAgICAgfQ0KICAgICAgICB9DQoNCiAgICAgICAgcDpsYXN0LWNoaWxkIHsNCiAgICAgICAgICBmb250LXNpemU6IDIycHg7DQogICAgICAgIH0NCiAgICAgIH0NCiAgICB9DQogIH0NCn0NCg=="},{"version":3,"sources":["userDetails.vue"],"names":[],"mappings":";AA4VA;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;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA","file":"userDetails.vue","sourceRoot":"src/pages/user/list/handle","sourcesContent":["<template>\r\n <div style=\"width: 100%\">\r\n <el-drawer :visible.sync=\"modals\" title=\"用户详情\" :wrapperClosable=\"false\" :size=\"1100\" @closed=\"draChange\">\r\n <div class=\"acea-row head\">\r\n <div class=\"avatar mr15\"><img :src=\"psInfo.avatar\" /></div>\r\n <div class=\"dashboard-workplace-header-tip\">\r\n <p class=\"dashboard-workplace-header-tip-title f-w-b\" v-text=\"psInfo.nickname || '-'\"></p>\r\n <div class=\"dashboard-workplace-header-tip-desc\">\r\n <span class=\"dashboard-workplace-header-tip-desc-sp\" v-for=\"(item, index) in detailsData\" :key=\"index\">{{\r\n item.title + '：' + item.value\r\n }}</span>\r\n </div>\r\n </div>\r\n <div class=\"edit-btn\" v-if=\"!this.psInfo.is_del\">\r\n <el-button v-if=\"!isEdit\" type=\"primary\" v-db-click @click=\"edit\">编辑</el-button>\r\n <el-button v-if=\"isEdit\" v-db-click @click=\"edit\">取消</el-button>\r\n <el-button v-if=\"isEdit\" type=\"primary\" v-db-click @click=\"editSave\">保存</el-button>\r\n </div>\r\n </div>\r\n <el-row justify=\"space-between\" class=\"mt14\">\r\n <el-col :span=\"24\">\r\n <el-tabs type=\"border-card\" v-model=\"activeName\" @tab-click=\"changeTab\">\r\n <el-tab-pane name=\"user\" label=\"用户信息\">\r\n <userEditForm ref=\"editForm\" :userId=\"userId\" @success=\"getDetails(userId)\" v-if=\"isEdit\"></userEditForm>\r\n <user-info :ps-info=\"psInfo\" v-else></user-info>\r\n </el-tab-pane>\r\n <el-tab-pane :name=\"item.val\" v-for=\"(item, index) in list\" :key=\"index\" :label=\"item.label\">\r\n <template>\r\n <el-table\r\n class=\"mt20\"\r\n :data=\"userLists\"\r\n max-height=\"400\"\r\n ref=\"table\"\r\n v-loading=\"loading\"\r\n no-userFrom-text=\"暂无数据\"\r\n no-filtered-userFrom-text=\"暂无筛选结果\"\r\n >\r\n <el-table-column :label=\"item.title\" min-width=\"120\" v-for=\"(item, index) in columns\" :key=\"index\">\r\n <template slot-scope=\"scope\">\r\n <template v-if=\"item.key\">\r\n <div>\r\n <span>{{ scope.row[item.key] }}</span>\r\n </div>\r\n </template>\r\n <template v-else-if=\"item.slot === 'number'\">\r\n <div :class=\"scope.row.pm ? 'plusColor' : 'reduceColor'\">\r\n {{ scope.row.pm ? '+' + scope.row.number : '-' + scope.row.number }}\r\n </div>\r\n </template>\r\n </template>\r\n </el-table-column>\r\n </el-table>\r\n <div class=\"acea-row row-right page\">\r\n <pagination\r\n v-if=\"total\"\r\n :total=\"total\"\r\n :page.sync=\"userFrom.page\"\r\n :limit.sync=\"userFrom.limit\"\r\n @pagination=\"changeType\"\r\n />\r\n </div>\r\n </template>\r\n </el-tab-pane>\r\n </el-tabs>\r\n </el-col>\r\n\r\n <!-- <el-col :span=\"24\">\r\n \r\n </el-col> -->\r\n </el-row>\r\n </el-drawer>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { detailsApi, infoApi } from '@/api/user';\r\nimport userInfo from './userInfo';\r\nimport userEditForm from './userEditForm';\r\n\r\nexport default {\r\n name: 'userDetails',\r\n components: { userInfo, userEditForm },\r\n data() {\r\n return {\r\n isEdit: false,\r\n theme2: 'light',\r\n list: [\r\n { val: 'order', label: '消费记录' },\r\n { val: 'integral', label: '积分明细' },\r\n { val: 'sign', label: '签到记录' },\r\n { val: 'coupon', label: '持有优惠券' },\r\n { val: 'balance_change', label: '余额变动' },\r\n { val: 'spread', label: '好友关系' },\r\n ],\r\n modals: false,\r\n spinShow: false,\r\n detailsData: [],\r\n userId: 0,\r\n loading: false,\r\n userFrom: {\r\n type: 'order',\r\n page: 1, // 当前页\r\n limit: 20, // 每页显示条数\r\n },\r\n total: 0,\r\n columns: [],\r\n userLists: [],\r\n psInfo: {},\r\n activeName: 'user',\r\n };\r\n },\r\n created() {},\r\n methods: {\r\n edit() {\r\n this.activeName = 'user';\r\n this.isEdit = !this.isEdit;\r\n },\r\n editSave() {\r\n this.$refs.editForm.setUser();\r\n },\r\n draChange() {\r\n this.isEdit = false;\r\n },\r\n // 会员详情\r\n getDetails(id) {\r\n this.activeName = 'user';\r\n this.userId = id;\r\n this.spinShow = true;\r\n this.isEdit = false;\r\n detailsApi(id)\r\n .then(async (res) => {\r\n if (res.status === 200) {\r\n let data = res.data;\r\n this.detailsData = data.headerList;\r\n this.psInfo = data.ps_info;\r\n // this.changeType('user');\r\n this.spinShow = false;\r\n } else {\r\n this.spinShow = false;\r\n this.$message.error(res.msg);\r\n }\r\n })\r\n .catch((res) => {\r\n this.spinShow = false;\r\n this.$message.error(res.msg);\r\n });\r\n },\r\n changeTab(tab) {\r\n this.activeName = tab.name;\r\n this.changeType();\r\n },\r\n // tab选项\r\n changeType() {\r\n this.loading = true;\r\n this.userFrom.type = this.activeName;\r\n this.isEdit = false;\r\n if (this.activeName == 'user') return;\r\n if (this.userFrom.type === '') {\r\n this.userFrom.type = 'order';\r\n }\r\n let data = {\r\n id: this.userId,\r\n datas: this.userFrom,\r\n };\r\n infoApi(data)\r\n .then(async (res) => {\r\n if (res.status === 200) {\r\n switch (this.userFrom.type) {\r\n case 'order':\r\n this.columns = [\r\n {\r\n title: '订单ID',\r\n key: 'order_id',\r\n minWidth: 160,\r\n },\r\n {\r\n title: '收货人',\r\n key: 'real_name',\r\n minWidth: 100,\r\n },\r\n {\r\n title: '商品数量',\r\n key: 'total_num',\r\n minWidth: 90,\r\n },\r\n {\r\n title: '实付金额',\r\n key: 'pay_price',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '交易完成时间',\r\n key: 'pay_time',\r\n minWidth: 120,\r\n },\r\n ];\r\n break;\r\n case 'integral':\r\n this.columns = [\r\n {\r\n title: '来源/用途',\r\n key: 'title',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '积分变化',\r\n slot: 'number',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '变化后积分',\r\n key: 'balance',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '日期',\r\n key: 'add_time',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '备注',\r\n key: 'mark',\r\n minWidth: 120,\r\n },\r\n ];\r\n break;\r\n case 'sign':\r\n this.columns = [\r\n {\r\n title: '动作',\r\n key: 'title',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '获得积分',\r\n key: 'number',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '签到时间',\r\n key: 'add_time',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '备注',\r\n key: 'mark',\r\n minWidth: 120,\r\n },\r\n ];\r\n break;\r\n case 'coupon':\r\n this.columns = [\r\n {\r\n title: '优惠券名称',\r\n key: 'coupon_title',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '面值',\r\n key: 'coupon_price',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '有效期(天)',\r\n key: 'coupon_time',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '领取时间',\r\n key: '_add_time',\r\n minWidth: 120,\r\n },\r\n ];\r\n break;\r\n case 'balance_change':\r\n this.columns = [\r\n {\r\n title: '动作',\r\n key: 'title',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '余额变动',\r\n slot: 'number',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '当前余额',\r\n key: 'balance',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '创建时间',\r\n key: 'add_time',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '备注',\r\n key: 'mark',\r\n minWidth: 120,\r\n },\r\n ];\r\n break;\r\n default:\r\n this.columns = [\r\n {\r\n title: 'ID',\r\n key: 'uid',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '昵称',\r\n key: 'nickname',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '等级',\r\n key: 'type',\r\n minWidth: 120,\r\n },\r\n {\r\n title: '加入时间',\r\n key: 'add_time',\r\n minWidth: 120,\r\n },\r\n ];\r\n }\r\n this.$nextTick((e) => {\r\n let data = res.data;\r\n this.userLists = data.list;\r\n this.total = data.count;\r\n });\r\n this.loading = false;\r\n } else {\r\n this.loading = false;\r\n this.$message.error(res.msg);\r\n }\r\n })\r\n .catch((res) => {\r\n this.loading = false;\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.avatar {\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n overflow: hidden;\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n}\r\n::v-deep .el-drawer__body {\r\n padding: 20px 0 !important;\r\n}\r\n::v-deep .el-tabs--border-card > .el-tabs__content {\r\n padding: 0 35px;\r\n}\r\n::v-deep .el-tabs--border-card > .el-tabs__header,\r\n::v-deep .el-tabs--border-card > .el-tabs__header .el-tabs__item:active {\r\n border: none;\r\n height: 40px;\r\n}\r\n::v-deep .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {\r\n border: none;\r\n border-top: 2px solid var(--prev-color-primary);\r\n font-size: 13px;\r\n font-weight: 500;\r\n color: #303133;\r\n line-height: 16px;\r\n}\r\n::v-deep .el-tabs--border-card > .el-tabs__header .el-tabs__item {\r\n border: none;\r\n}\r\n::v-deep .el-tabs--border-card > .el-tabs__header .el-tabs__item {\r\n margin-top: 0;\r\n transition: none;\r\n height: 40px !important;\r\n line-height: 40px !important;\r\n width: 92px !important;\r\n font-size: 13px;\r\n font-weight: 400;\r\n color: #303133;\r\n line-height: 16px;\r\n}\r\n::v-deep .el-tabs--border-card {\r\n border: none;\r\n box-shadow: none;\r\n}\r\n.head {\r\n position: relative;\r\n padding: 0 15px;\r\n .edit-btn {\r\n position: absolute;\r\n right: 20px;\r\n top: 0px;\r\n display: flex;\r\n align-items: center;\r\n }\r\n}\r\n.dashboard-workplace {\r\n &-header {\r\n &-avatar {\r\n width: 64px;\r\n height: 64px;\r\n border-radius: 50%;\r\n margin-right: 16px;\r\n font-weight: 600;\r\n }\r\n\r\n &-tip {\r\n width: 82%;\r\n display: inline-block;\r\n vertical-align: middle;\r\n\r\n &-title {\r\n font-size: 13px;\r\n color: #000000;\r\n margin-bottom: 12px;\r\n }\r\n\r\n &-desc {\r\n &-sp {\r\n width: 33.33%;\r\n color: #17233d;\r\n font-size: 13px;\r\n display: inline-block;\r\n }\r\n }\r\n }\r\n\r\n &-extra {\r\n .ivu-col {\r\n p {\r\n text-align: right;\r\n }\r\n\r\n p:first-child {\r\n span:first-child {\r\n margin-right: 4px;\r\n }\r\n\r\n span:last-child {\r\n color: #808695;\r\n }\r\n }\r\n\r\n p:last-child {\r\n font-size: 22px;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n</style>\r\n<style lang=\"scss\" scoped>\r\n.user_menu ::v-deep .ivu-menu {\r\n width: 100% !important;\r\n}\r\n</style>\r\n"]}]}
|
