no message

2023-07-05 22:34:51 +08:00 · 2023-07-05 22:34:51 +08:00 · 3431ba8ece
commit 3431ba8ece
parent a459a9d4d2
15 changed files with 230 additions and 298 deletions
--- a/src/components/Flexbox/Flexbox.vue
+++ b/src/components/Flexbox/Flexbox.vue
@ -1,81 +0,0 @@
-<template>
-  <div
-    :class="{
-      'vux-flex-col': orient === 'vertical',
-      'vux-flex-row': orient === 'horizontal'
-    }"
-    :style="styles"
-    class="vux-flexbox">
-    <slot/>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Flexbox',
-  props: {
-    gutter: {
-      type: Number,
-      default: 8
-    },
-    orient: {
-      type: String,
-      default: 'horizontal'
-    },
-    justify: String,
-    align: String,
-    wrap: String,
-    direction: String
-  },
-  computed: {
-    styles() {
-      const styles = {
-        'justify-content': this.justify,
-        '-webkit-justify-content': this.justify,
-        'align-items': this.align,
-        '-webkit-align-items': this.align,
-        'flex-wrap': this.wrap,
-        '-webkit-flex-wrap': this.wrap,
-        'flex-direction': this.direction,
-        '-webkit-flex-direction': this.direction
-      }
-      return styles
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.vux-flexbox {
-  width: 100%;
-  text-align: left;
-  display: flex;
-  display: -webkit-flex;
-  box-align: center;
-  align-items: center;
-  .vux-flexbox-item {
-    flex: 1;
-    -webkit-flex: 1;
-    min-width: 20px;
-    width: 0%;
-    &:first-child {
-      margin-left: 0 !important;
-      margin-top: 0 !important;
-    }
-  }
-}
-
-.vux-flex-row {
-  box-direction: row;
-  box-orient: horizontal;
-  flex-direction: row;
-}
-
-.vux-flex-col {
-  box-orient: vertical;
-  flex-direction: column;
-  > .vux-flexbox-item {
-    width: 100%;
-  }
-}
-</style>
--- a/src/components/Flexbox/FlexboxItem.vue
+++ b/src/components/Flexbox/FlexboxItem.vue
@ -1,62 +0,0 @@
-<template>
-  <div
-    :style="style"
-    class="vux-flexbox-item">
-    <slot/>
-  </div>
-</template>
-
-<script>
-const prefixList = ['-moz-box-', '-webkit-box-', '']
-
-export default {
-  name: 'FlexboxItem',
-  props: {
-    span: [Number, String],
-    order: [Number, String]
-  },
-  data() {
-    return {
-      bodyWidth: 0
-    }
-  },
-  computed: {
-    style() {
-      const styles = {}
-      const marginName =
-        this.$parent.orient === 'horizontal' ? 'marginLeft' : 'marginTop'
-
-      if (this.$parent.gutter * 1 !== 0) {
-        styles[marginName] = `${this.$parent.gutter}px`
-      }
-
-      if (this.span) {
-        for (let i = 0; i < prefixList.length; i++) {
-          styles[`${prefixList[i]}flex`] = `0 0 ${this.buildWidth(this.span) *
-            100}%`
-        }
-      }
-      if (typeof this.order !== 'undefined') {
-        styles.order = this.order
-      }
-      return styles
-    }
-  },
-  beforeMount() {
-    this.bodyWidth = document.documentElement.offsetWidth
-  },
-  methods: {
-    buildWidth(width) {
-      if (typeof width === 'number') {
-        if (width < 1) {
-          return width
-        } else {
-          return width / 12
-        }
-      } else if (typeof width === 'string') {
-        return width.replace('px', '') / this.bodyWidth
-      }
-    }
-  }
-}
-</script>
--- a/src/components/Flexbox/index.js
+++ b/src/components/Flexbox/index.js
@ -1,7 +0,0 @@
-import Flexbox from './Flexbox'
-import FlexboxItem from './FlexboxItem'
-
-export {
-  Flexbox,
-  FlexboxItem
-}
--- a/src/components/scFilterBar/index.vue
+++ b/src/components/scFilterBar/index.vue
@ -49,7 +49,7 @@
 						<td>
 							<x-item v-model="data" :item="item"></x-item>
 						</td>
-						<td v-if="item.operators">
+						<td v-if="item.operators.length>0">
 							<el-select v-model="item.operator" placeholder="运算符">
 								<el-option v-for="ope in item.operators || operator" :key="ope.value" v-bind="ope"></el-option>
 							</el-select>
--- a/src/components/scPageHeader/index.vue
+++ b/src/components/scPageHeader/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: 页面头部样式组件
- * @version: 1.0
- * @Author: sakuya
- * @Date: 2021年7月20日08:49:07
- * @LastEditors:
- * @LastEditTime:
 -->

 <template>
--- a/src/components/scQrCode/index.vue
+++ b/src/components/scQrCode/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: 生成二维码组件
- * @version: 1.0
- * @Author: sakuya
- * @Date: 2021年12月20日14:22:20
- * @LastEditors:
- * @LastEditTime:
 -->

 <template>
--- a/src/components/scSelectFilter/index.vue
+++ b/src/components/scSelectFilter/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: 分类筛选器
- * @version: 1.0
- * @Author: sakuya
- * @Date: 2022年5月26日15:59:52
- * @LastEditors:
- * @LastEditTime:
 -->

 <template>
--- a/src/components/scTable/index.vue
+++ b/src/components/scTable/index.vue
@ -7,7 +7,7 @@
 					<el-table-column v-if="!item.hide && item.name" :column-key="item.name" :label="item.label" :prop="item.name" :width="item.width || 'auto'" :min-width="item.minWidth || 'auto'" :sortable="item.sortable" :fixed="item.fixed" :filters="item.filters" :filter-method="remoteFilter||!item.filters?null:filterHandler" :show-overflow-tooltip="item.showOverflowTooltip">
 						<template #default="scope">

-							<div style="display: flex;align-items: center;" v-if="item.columntype=='avatar' || item.component=='avatar'">
+							<div style="display: flex;align-items: center;" @click="getUser(scope.row, scope.row[item.options.subfield])" v-if="item.columntype=='avatar' || item.component=='avatar'">
 								<el-avatar v-if="scope.row.anonymous" title="匿名发布" size="small">匿</el-avatar>
 								<el-avatar v-else :src="scope.row[item.name]" size="small"></el-avatar>
 								<label v-if="item.options.subfield" style="position: absolute;left: 42px;">
@ -86,8 +86,25 @@
 			</div>
 		</div>
 	</div>
+
+	<el-drawer type="primary" :with-header="false" append-to-body="true" v-model="visible" :size="1000" :show-close="false" style="overflow: initial;" destroy-on-close @closed="$emit('closed')">
+	    <el-button type="danger" @click="closeUser" class="userdrawerclose" icon="el-icon-close"> </el-button>
+		<x-user v-model="visibleInfo"></x-user>
+	</el-drawer>
 </template>

+
+<style scoped>
+	.userdrawerclose {position: absolute; position: absolute; top: 148px; left: -36px; z-index: 10000; border-top-right-radius: 0px; border-bottom-right-radius: 0px; padding: 6px; font-size: 22px; font-weight: bolder;} 
+	.scTable {}
+	.scTable-table {height: calc(100% - 50px);}
+	.scTable-page {height:50px;display: flex;align-items: center;justify-content: space-between;padding:0 15px;}
+	.scTable-do {white-space: nowrap;}
+	.scTable:deep(.el-table__footer) .cell {font-weight: bold;}
+	.scTable:deep(.el-table__body-wrapper) .el-scrollbar__bar.is-horizontal {height: 12px;border-radius: 12px;}
+	.scTable:deep(.el-table__body-wrapper) .el-scrollbar__bar.is-vertical {width: 12px;border-radius: 12px;}
+</style>
+
 <script>
 	import config from "@/config/table";
 	import columnSetting from './columnSetting'
@ -161,11 +178,13 @@
 				prop: null,
 				order: null,
 				loading: false,
+				visible: false,
 				tableHeight:'100%',
 				tableParams: this.params,
 				column: [],
 				customColumnShow: false,
 				summary: {},
+				visibleInfo: {},
 				config: {
 					size: this.size,
 					border: this.border,
@ -192,12 +211,22 @@
 			this.isActivat = false;
 		},
 		methods: {
-
+			closeUser(){
+				this.visible = false;
+			},
+			getUser(o){
+				this.visible = true
+				this.visibleInfo = {
+					uid:o.uid,
+					avatar:o.avatar,
+					nickname:o.nickname,
+					username:o.username,
+				}
+			},
 			getNameByValue (value, degrees) {
 			    const degree = degrees.find(degree => degree.value === value);
 			    return degree ? (degree.name?degree.name:degree.label) : value;
 			},
-
 			getImg(o){
 				if (!o) {
 					return ;
@ -432,13 +461,3 @@
 		}
 	}
 </script>
-
-<style scoped>
-	.scTable {}
-	.scTable-table {height: calc(100% - 50px);}
-	.scTable-page {height:50px;display: flex;align-items: center;justify-content: space-between;padding:0 15px;}
-	.scTable-do {white-space: nowrap;}
-	.scTable:deep(.el-table__footer) .cell {font-weight: bold;}
-	.scTable:deep(.el-table__body-wrapper) .el-scrollbar__bar.is-horizontal {height: 12px;border-radius: 12px;}
-	.scTable:deep(.el-table__body-wrapper) .el-scrollbar__bar.is-vertical {width: 12px;border-radius: 12px;}
-</style>
--- a/src/components/scVideo/index.vue
+++ b/src/components/scVideo/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: xgplayer二次封装
- * @version: 1.1
- * @Author: sakuya
- * @Date: 2021年11月29日12:10:06
- * @LastEditors: sakuya
- * @LastEditTime: 2022年5月30日21:02:50
 -->

 <template>
--- a/src/components/scWaterMark/index.vue
+++ b/src/components/scWaterMark/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: 局部水印组件
- * @version: 1.1
- * @Author: sakuya
- * @Date: 2021年12月18日12:16:16
- * @LastEditors: sakuya
- * @LastEditTime: 2022年1月5日09:52:59
 -->

 <template>
--- a/src/components/scWorkflow/index.vue
+++ b/src/components/scWorkflow/index.vue
@ -1,10 +1,5 @@
 <!--
 * @Descripttion: 仿钉钉流程设计器
- * @version: 1.3
- * @Author: sakuya
- * @Date: 2021年9月14日08:38:35
- * @LastEditors: sakuya
- * @LastEditTime: 2022年5月14日19:43:46
 -->

 <template>
--- a/src/components/scWorkflow/nodeWrap.vue
+++ b/src/components/scWorkflow/nodeWrap.vue
@ -1,18 +1,13 @@
 <template>
 	<promoter v-if="nodeConfig.type==0" v-model="nodeConfig"></promoter>
-
 	<approver v-if="nodeConfig.type==1" v-model="nodeConfig"></approver>
-
 	<send v-if="nodeConfig.type==2" v-model="nodeConfig"></send>
-
 	<branch v-if="nodeConfig.type==4" v-model="nodeConfig">
 		<template v-slot="slot">
 			<node-wrap v-if="slot.node" v-model="slot.node.childNode"></node-wrap>
 		</template>
 	</branch>
-
 	<node-wrap v-if="nodeConfig.childNode" v-model="nodeConfig.childNode"></node-wrap>
-
 </template>

 <script>
--- a/src/components/xUser/index.vue
+++ b/src/components/xUser/index.vue
@ -0,0 +1,142 @@
+<template>
+	<el-container class="page-user">
+		<el-aside style="width: 160px;">
+			<el-container>
+				<el-header style="height: auto;display: block;">
+					<div class="user-info-top">
+						<el-avatar :size="70" :src="user.avatar"></el-avatar>
+						<h2>{{ user.nickname || user.username }}</h2>
+						<p><el-tag effect="dark" round size="large" disable-transitions>{{ user.role }}</el-tag></p>
+					</div>
+				</el-header>
+				<el-main class="nopadding">
+					<el-menu class="menu" :default-active="page">
+						<el-menu-item-group v-for="group in menu" :key="group.groupName" :title="group.groupName">
+							<el-menu-item v-for="item in group.list" :key="item.component" :index="item.component" @click="openPage">
+								<el-icon v-if="item.icon"><component :is="item.icon"/></el-icon>
+								<template #title>
+									<span>{{item.title}}</span>
+								</template>
+							</el-menu-item>
+						</el-menu-item-group>
+					</el-menu>
+				</el-main>
+			</el-container>
+		</el-aside>
+		<el-main>
+			<Suspense>
+				<template #default>
+					<component :data="user" :is="page"/>
+				</template>
+				<template #fallback>
+					<el-skeleton :rows="3" />
+				</template>
+			</Suspense>
+		</el-main>
+	</el-container>
+</template>
+
+<script>
+	import { defineAsyncComponent } from 'vue'
+
+	export default {
+		name: 'userCenter',
+		components: {
+			account: defineAsyncComponent(() => import('@/views/userCenter/user/account')),
+			seting: defineAsyncComponent(() => import('@/views/userCenter/user/seting')),
+			pushSettings: defineAsyncComponent(() => import('@/views/userCenter/user/pushSettings')),
+			password: defineAsyncComponent(() => import('@/views/userCenter/user/password')),
+			space: defineAsyncComponent(() => import('@/views/userCenter/user/space')),
+			logs: defineAsyncComponent(() => import('@/views/userCenter/user/logs')),
+		},
+		props: {
+			modelValue: { type: Object, default: () => {} },
+			type: { type: String, default: "" }
+		},
+		data() {
+			return {
+				menu: [
+					{
+						groupName: "基本设置",
+						list: [
+							{
+								icon: "el-icon-postcard",
+								title: "账号信息",
+								component: "account"
+							},
+							{
+								icon: "el-icon-operation",
+								title: "个人设置",
+								component: "seting"
+							},
+							{
+								icon: "el-icon-lock",
+								title: "密码",
+								component: "password"
+							},
+							{
+								icon: "el-icon-bell",
+								title: "通知设置",
+								component: "pushSettings"
+							}
+						]
+					},
+					{
+						groupName: "数据管理",
+						list: [
+							{
+								icon: "el-icon-coin",
+								title: "存储空间信息",
+								component: "space"
+							},
+							{
+								icon: "el-icon-clock",
+								title: "Offer",
+								component: "logs"
+							},
+							{
+								icon: "el-icon-clock",
+								title: "租房",
+								component: "logs"
+							},
+							{
+								icon: "el-icon-clock",
+								title: "我的附件",
+								component: "logs"
+							}
+						]
+					},
+				],
+				user: this.modelValue,
+				page: "account"
+			}
+		},
+		//路由跳转进来 判断from是否有特殊标识做特殊处理
+		beforeRouteEnter (to, from, next){
+			next((vm)=>{
+				if(from.is){
+					//删除特殊标识，防止标签刷新重复执行
+					delete from.is
+					//执行特殊方法
+					vm.$alert('路由跳转过来后含有特殊标识，做特殊处理', '提示', {
+						type: 'success',
+						center: true
+					}).then(() => {}).catch(() => {})
+				}
+			})
+		},
+		created() {
+			// var userInfo = this.$tool.data.get('user');
+			this.user = this.modelValue
+		},
+		methods: {
+			updateValue(event) {
+		      	const newValue = event.target.value;
+		      	this.$emit('update:modelValue', newValue);
+		    },
+			openPage(item){
+				this.page = item.index
+			}
+		}
+	}
+</script>
--- a/src/views/userCenter/index.vue
+++ b/src/views/userCenter/index.vue
@ -1,39 +1,5 @@
 <template>
-	<el-container class="page-user">
-		<el-aside style="width: 160px;">
-			<el-container>
-				<el-header style="height: auto;display: block;">
-					<div class="user-info-top">
-						<el-avatar :size="70" :src="user.avatar"></el-avatar>
-						<h2>{{ user.nickname || user.username }}</h2>
-						<p><el-tag effect="dark" round size="large" disable-transitions>{{ user.role }}</el-tag></p>
-					</div>
-				</el-header>
-				<el-main class="nopadding">
-					<el-menu class="menu" :default-active="page">
-						<el-menu-item-group v-for="group in menu" :key="group.groupName" :title="group.groupName">
-							<el-menu-item v-for="item in group.list" :key="item.component" :index="item.component" @click="openPage">
-								<el-icon v-if="item.icon"><component :is="item.icon"/></el-icon>
-								<template #title>
-									<span>{{item.title}}</span>
-								</template>
-							</el-menu-item>
-						</el-menu-item-group>
-					</el-menu>
-				</el-main>
-			</el-container>
-		</el-aside>
-		<el-main>
-			<Suspense>
-				<template #default>
-					<component :data="user" :is="page"/>
-				</template>
-				<template #fallback>
-					<el-skeleton :rows="3" />
-				</template>
-			</Suspense>
-		</el-main>
-	</el-container>
+	<x-user></x-user>
 </template>

 <script>
--- a/src/x.js
+++ b/src/x.js
@ -2,8 +2,10 @@ import config from "./config"
 import api from './api'
 import tool from './utils/tool'
 import http from "./utils/request"
-import { permission, rolePermission } from './utils/permission'
-
+import {
+    permission,
+    rolePermission
+} from './utils/permission'
 import scTable from './components/scTable'
 import scTableColumn from './components/scTable/column.js'
 import scFilterBar from './components/scFilterBar'
@ -17,14 +19,12 @@ import scSelect from './components/scSelect'
 import scDialog from './components/scDialog'
 import scForm from './components/scForm'
 import XItem from './components/scForm/item'
+import xUser from './components/xUser'
 import scTitle from './components/scTitle'
 import scWaterMark from './components/scWaterMark'
 import scQrCode from './components/scQrCode'
-import { Flexbox,  FlexboxItem } from './components/Flexbox'
-
 import scStatusIndicator from './components/scMini/scStatusIndicator'
 import scTrend from './components/scMini/scTrend'
-
 import auth from './directives/auth'
 import auths from './directives/auths'
 import authsAll from './directives/authsAll'
@ -32,65 +32,55 @@ import role from './directives/role'
 import time from './directives/time'
 import copy from './directives/copy'
 import errorHandler from './utils/errorHandler'
-
 import * as elIcons from '@element-plus/icons-vue'
 import * as scIcons from './assets/icons'
-
 export default {
-	install(app) {
-
-		//挂载全局对象
-		app.config.globalProperties.$config = config;
-		app.config.globalProperties.$tool = tool;
-		app.config.globalProperties.$http = http;
-		app.config.globalProperties.$api = api;
-		app.config.globalProperties.$auth = permission;
-		app.config.globalProperties.$role = rolePermission;
-
-		//注册全局组件
-		app.component('XItem', XItem);
-		app.component('flexbox', Flexbox);
-		app.component('flexbox-item', FlexboxItem);
-		app.component('scTable', scTable);
-		app.component('scTableColumn', scTableColumn);
-		app.component('scFilterBar', scFilterBar);
-		app.component('scUpload', scUpload);
-		app.component('scUploadMultiple', scUploadMultiple);
-		app.component('scUploadFile', scUploadFile);
-		app.component('scFormTable', scFormTable);
-		app.component('scTableSelect', scTableSelect);
-		app.component('scPageHeader', scPageHeader);
-		app.component('scSelect', scSelect);
-		app.component('scDialog', scDialog);
-		app.component('scForm', scForm);
-		app.component('scTitle', scTitle);
-		app.component('scWaterMark', scWaterMark);
-		app.component('scQrCode', scQrCode);
-		app.component('scStatusIndicator', scStatusIndicator);
-		app.component('scTrend', scTrend);
-
-		//注册全局指令
-		app.directive('auth', auth)
-		app.directive('auths', auths)
-		app.directive('auths-all', authsAll)
-		app.directive('role', role)
-		app.directive('time', time)
-		app.directive('copy', copy)
-
-		//统一注册el-icon图标
-		for(let icon in elIcons){
-			app.component(`ElIcon${icon}`, elIcons[icon])
-		}
-		
-		//统一注册sc-icon图标
-		for(let icon in scIcons){
-			app.component(`ScIcon${icon}`, scIcons[icon])
-		}
-
-		//关闭async-validator全局控制台警告
-		window.ASYNC_VALIDATOR_NO_WARNING = 1
-
-		//全局代码错误捕捉
-		app.config.errorHandler = errorHandler
-	}
-}
+    install(app) {
+        //挂载全局对象
+        app.config.globalProperties.$config = config;
+        app.config.globalProperties.$tool = tool;
+        app.config.globalProperties.$http = http;
+        app.config.globalProperties.$api = api;
+        app.config.globalProperties.$auth = permission;
+        app.config.globalProperties.$role = rolePermission;
+        //注册全局组件
+        app.component('XItem', XItem);
+        app.component('xUser', xUser);
+        app.component('scTable', scTable);
+        app.component('scTableColumn', scTableColumn);
+        app.component('scFilterBar', scFilterBar);
+        app.component('scUpload', scUpload);
+        app.component('scUploadMultiple', scUploadMultiple);
+        app.component('scUploadFile', scUploadFile);
+        app.component('scFormTable', scFormTable);
+        app.component('scTableSelect', scTableSelect);
+        app.component('scPageHeader', scPageHeader);
+        app.component('scSelect', scSelect);
+        app.component('scDialog', scDialog);
+        app.component('scForm', scForm);
+        app.component('scTitle', scTitle);
+        app.component('scWaterMark', scWaterMark);
+        app.component('scQrCode', scQrCode);
+        app.component('scStatusIndicator', scStatusIndicator);
+        app.component('scTrend', scTrend);
+        //注册全局指令
+        app.directive('auth', auth)
+        app.directive('auths', auths)
+        app.directive('auths-all', authsAll)
+        app.directive('role', role)
+        app.directive('time', time)
+        app.directive('copy', copy)
+        //统一注册el-icon图标
+        for (let icon in elIcons) {
+            app.component(`ElIcon${icon}`, elIcons[icon])
+        }
+        //统一注册sc-icon图标
+        for (let icon in scIcons) {
+            app.component(`ScIcon${icon}`, scIcons[icon])
+        }
+        //关闭async-validator全局控制台警告
+        window.ASYNC_VALIDATOR_NO_WARNING = 1
+        //全局代码错误捕捉
+        app.config.errorHandler = errorHandler
+    }
+}