sh-view 2.0.8 → 2.1.0

package/packages/components/other-components/sh-menu/menu-item-content.vue

@@ -1,61 +1,61 @@
-<template>
-	<div ref="shMenuItem" class="sh-menu-item" :class="itemClass" :style="itemStyle">
-		<sh-icon v-if="iconType" class="sh-menu-item-icon" :type="iconType"></sh-icon>
-		<span class="sh-menu-item-title">{{ formatTitle(menuItem) }}</span>
-		<sh-icon v-if="arrow" class="sh-menu-item-arrow" type="ios-arrow-forward"></sh-icon>
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'MenuItemBox',
-	inject: {
-		MenuInstance: {
-			default: null
-		}
-	},
-	props: {
-		arrow: Boolean,
-		menuLevel: {
-			type: Number
-		},
-		menuItem: {
-			type: Object,
-			default() {
-				return {}
-			}
-		}
-	},
-	computed: {
-		defaultIcon() {
-			if (!this.menuLevel || this.menuLevel < 2) return 'md-folder'
-			else if (this.menuLevel === 2) return 'md-bookmark'
-			else return ''
-		},
-		iconType() {
-			return this.menuItem.meta?.icon || this.menuItem.icon || this.defaultIcon
-		},
-		itemClass() {
-			return {
-				'sh-menu-item-level': !this.menuLevel,
-				'sh-menu-item-active': this.MenuInstance.activeName === this.menuItem.name
-			}
-		},
-		itemStyle() {
-			let result = {}
-			const { mode, collapsed, indent } = this.MenuInstance
-			if (mode === 'vertical' && !collapsed && this.menuLevel) {
-				result.paddingLeft = `${indent * this.menuLevel}px`
-			}
-			return result
-		},
-		itemTitle() {
-			const { labelField, labelFormat } = this.MenuInstance
-			return labelFormat ? labelFormat(this.menuItem) : this.$vUtils.get(this.menuItem, labelField)
-		}
-	},
-	methods: {}
-}
-</script>
-
-<style scoped></style>
+<template>
+	<div ref="shMenuItem" class="sh-menu-item" :class="itemClass" :style="itemStyle">
+		<sh-icon v-if="iconType" class="sh-menu-item-icon" :type="iconType"></sh-icon>
+		<span class="sh-menu-item-title">{{ itemTitle }}</span>
+		<sh-icon v-if="arrow" class="sh-menu-item-arrow" type="ios-arrow-forward"></sh-icon>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'MenuItemBox',
+	inject: {
+		MenuInstance: {
+			default: null
+		}
+	},
+	props: {
+		arrow: Boolean,
+		menuLevel: {
+			type: Number
+		},
+		menuItem: {
+			type: Object,
+			default() {
+				return {}
+			}
+		}
+	},
+	computed: {
+		defaultIcon() {
+			if (!this.menuLevel || this.menuLevel < 2) return 'md-folder'
+			else if (this.menuLevel === 2) return 'md-bookmark'
+			else return ''
+		},
+		iconType() {
+			return this.menuItem.meta?.icon || this.menuItem.icon || this.defaultIcon
+		},
+		itemClass() {
+			return {
+				'sh-menu-item-level': !this.menuLevel,
+				'sh-menu-item-active': this.MenuInstance.activeName === this.menuItem.name
+			}
+		},
+		itemStyle() {
+			let result = {}
+			const { mode, collapsed, indent } = this.MenuInstance
+			if (mode === 'vertical' && !collapsed && this.menuLevel) {
+				result.paddingLeft = `${indent * this.menuLevel}px`
+			}
+			return result
+		},
+		itemTitle() {
+			const { labelField, labelFormat } = this.MenuInstance
+			return labelFormat ? labelFormat(this.menuItem) : this.$vUtils.get(this.menuItem, labelField)
+		}
+	},
+	methods: {}
+}
+</script>
+
+<style scoped></style>

package/packages/components/other-components/sh-menu-card/index.vue

@@ -2,7 +2,7 @@
 	<sh-row :gutter="10">
 		<template v-for="(menuitem, menuindex) in resetRenderList(list)" :key="menuindex">
 			<sh-col v-bind="colsConfig">
-				<sh-card :icon="menuitem.icon" size="small" :title="menuitem.meta.title" :icon-size="18" :color="getMenuColor(menuindex)" :padding="8" class="menuCard">
+				<sh-card :icon="menuitem.icon" size="small" :title="menuitem?.meta?.title" :icon-size="18" :color="getMenuColor(menuindex)" :padding="8" class="menuCard">
 					<div :ref="`cardBtnsWrap${menuindex}`" class="cardBtnsWrap">
 						<template v-for="cardBtn in menuitem.buttons" :key="cardBtn.value">
 							<template v-if="menuitem.children && menuitem.children.length > 0">
@@ -12,8 +12,8 @@
 									:title="cardBtn.name"
 									:width="poptipWidth"
 									:placement="cardBtn.placement"
-									@on-popper-show="handleFocusBtn(cardBtn, menuindex)"
-									@on-popper-hide="handleBlurBtn(cardBtn, menuindex)">
+									@popper-show="handleFocusBtn(cardBtn, menuindex)"
+									@popper-hide="handleBlurBtn(cardBtn, menuindex)">
 									<div class="cardBtn" :style="getCardStyle(menuindex, cardActive === cardBtn.value + menuindex)" @click="handleCardBtn($event, cardBtn, menuitem, menuindex)">
 										<sh-icon :type="cardBtn.icon" :size="16" class="mr-2" :color="getMenuColor(menuindex, cardActive === cardBtn.value + menuindex)" />
 										<span>{{ cardBtn.name }}</span>
@@ -49,6 +49,11 @@ export default {
 	components: {
 		menuBox
 	},
+	provide() {
+		return {
+			MenuCardInstance: this
+		}
+	},
 	props: {
 		list: {
 			type: Array,
@@ -83,8 +88,16 @@ export default {
 					{ name: '已办事项', value: 'untodo', icon: 'ios-calendar', placement: 'bottom-end' }
 				]
 			}
+		},
+		labelField: {
+			type: String,
+			default: 'label'
+		},
+		labelFormat: {
+			type: Function
 		}
 	},
+	emits: ['select'],
 	data() {
 		return {
 			poptipWidth: 320,
@@ -161,6 +174,9 @@ export default {
 		},
 		handleBlurBtn(card, index) {
 			if (this.cardActive === card.value + index) this.cardActive = ''
+		},
+		onMenuSelect(menu) {
+			this.$emit('select', menu)
 		}
 	}
 }

package/packages/components/other-components/sh-menu-card/menu-box.vue

@@ -1,68 +1,81 @@
-<template>
-	<div class="menuBoxWrap" :class="{ first }">
-		<template v-if="menus.length > 0">
-			<div v-if="first" class="menuBoxFilter">
-				<vxe-input v-model="filterText" size="mini" class="w-100" clearable placeholder="请输入关键词" prefix-icon="vxe-icon-search"></vxe-input>
-			</div>
-			<template v-for="(item, itemindex) in menuBoxList" :key="itemindex">
-				<a class="menuBoxTitle" @click="routerTo(item)">{{ formatTitle(item) }}</a>
-				<menuBox v-if="hasChildren(item)" :menu="item"></menuBox>
-			</template>
-		</template>
-		<sh-empty v-else></sh-empty>
-	</div>
-</template>
-
-<script>
-export default {
-	name: 'MenuBox',
-	props: {
-		menu: {
-			type: [Object, Array],
-			default() {
-				return {}
-			}
-		},
-		first: {
-			type: Boolean
-		}
-	},
-	data() {
-		return {
-			filterText: '',
-			filterData: null,
-			filterChangeDebounce: this.$vUtils.debounce(this.handleMenuFilter, 500)
-		}
-	},
-	computed: {
-		menus() {
-			return Array.isArray(this.menu) ? this.menu : this.menu?.children || []
-		},
-		menuBoxList() {
-			return this.filterData || this.menus
-		}
-	},
-	watch: {
-		filterText: {
-			handler(newvalue, oldValue) {
-				this.filterChangeDebounce(newvalue)
-			}
-		}
-	},
-	methods: {
-		// 全局搜索过滤事件
-		handleMenuFilter(text) {
-			const that = this
-			let filterText = that.$vUtils.toValueString(text).trim().toLowerCase()
-			let filterData = null
-			if (filterText) {
-				filterData = that.$vUtils.searchTree(that.menus, menu => this.formatTitle(menu).indexOf(filterText) > -1)
-			}
-			if (that.filterData === null && !filterText) {
-				return
-			}
-			that.filterData = filterData
-		}
-	}
-}
-</script>
+<template>
+	<div class="menuBoxWrap" :class="{ first }">
+		<template v-if="menus.length > 0">
+			<div v-if="first" class="menuBoxFilter">
+				<vxe-input v-model="filterText" size="mini" class="w-100" clearable placeholder="请输入关键词" prefix-icon="vxe-icon-search"></vxe-input>
+			</div>
+			<template v-for="(item, itemindex) in menuBoxList" :key="itemindex">
+				<a class="menuBoxTitle" @click="handleMenuClick(item)">{{ getItemTitle(item) }}</a>
+				<menuBox v-if="hasChildren(item)" :menu="item"></menuBox>
+			</template>
+		</template>
+		<sh-empty v-else></sh-empty>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'MenuBox',
+	inject: {
+		MenuCardInstance: {
+			default: null
+		}
+	},
+	props: {
+		menu: {
+			type: [Object, Array],
+			default() {
+				return {}
+			}
+		},
+		first: {
+			type: Boolean
+		}
+	},
+	data() {
+		return {
+			filterText: '',
+			filterData: null,
+			filterChangeDebounce: this.$vUtils.debounce(this.handleMenuFilter, 500)
+		}
+	},
+	computed: {
+		menus() {
+			return Array.isArray(this.menu) ? this.menu : this.menu?.children || []
+		},
+		menuBoxList() {
+			return this.filterData || this.menus
+		}
+	},
+	watch: {
+		filterText: {
+			handler(newvalue, oldValue) {
+				this.filterChangeDebounce(newvalue)
+			}
+		}
+	},
+	methods: {
+		hasChildren(menu) {
+			return menu && menu.children && Array.isArray(menu.children) && menu.children.length > 0
+		},
+		getItemTitle(menu) {
+			const { labelField, labelFormat } = this.MenuCardInstance
+			return labelFormat ? labelFormat(menu) : this.$vUtils.get(menu, labelField) || ''
+		},
+		handleMenuClick(item) {
+			this.MenuCardInstance.onMenuSelect(item)
+		},
+		// 全局搜索过滤事件
+		handleMenuFilter(text) {
+			const { menus, $vUtils, getItemTitle } = this
+			let filterText = $vUtils.toValueString(text).trim().toLowerCase()
+			let filterData = null
+			if (filterText) {
+				filterData = $vUtils.searchTree(menus, menu => getItemTitle(menu).indexOf(filterText) > -1)
+			}
+			if (this.filterData === null && !filterText) return
+			this.filterData = filterData
+		}
+	}
+}
+</script>

package/packages/components/other-components/sh-system-tip/index.vue

@@ -1,113 +1,111 @@
-<template>
-	<sh-header size="large">
-		<template #title>
-			<div v-html="headerTitle.title"></div>
-		</template>
-		<div>{{ headerTitle.desc }}</div>
-	</sh-header>
-</template>
-
-<script>
-export default {
-	name: 'SystemTip',
-	props: {
-		name: {
-			type: String,
-			default: ''
-		}
-	},
-	data() {
-		return {
-			nowdate: new Date()
-		}
-	},
-	computed: {
-		headerDate() {
-			let hours = this.nowdate.getHours()
-			let month = this.nowdate.getMonth() + 1
-			let day = this.nowdate.getDate()
-			let week = this.nowdate.getDay()
-			return { date: this.nowdate, hours, month, day, week }
-		},
-		headerWeek() {
-			let { week } = this.headerDate
-			let tw = ''
-			switch (week) {
-				case 0:
-					tw = '星期天'
-					break
-				case 1:
-					tw = '星期一'
-					break
-				case 2:
-					tw = '星期二'
-					break
-				case 3:
-					tw = '星期三'
-					break
-				case 4:
-					tw = '星期四'
-					break
-				case 5:
-					tw = '星期五'
-					break
-				case 6:
-					tw = '星期六'
-					break
-			}
-			return tw
-		},
-		headerTitle() {
-			let { hours } = this.headerDate
-			let title = ''
-			let desc = ''
-			switch (true) {
-				case hours === 0 || (hours >= 23 && hours <= 24):
-					title = '午夜啦,早点休息喔'
-					desc = '思念不因劳累而改变,问候不因疲惫而变懒,祝福不因休息而变缓,关怀随星星眨眼,牵挂在深夜依然,轻轻道声:祝你晚安!'
-					break
-				case hours >= 1 && hours <= 4:
-					title = '凌晨啦,注意身体喔'
-					desc = '时间不早啦,记得早点休息,保证睡眠质量!'
-					break
-				case hours >= 5 && hours <= 6:
-					title = '清晨啦,准备迎接新的一天吧'
-					desc = '睁开眼,缓一缓,快起床,伸懒腰;笑一笑,美好的一天又开始了.早安,祝你今天好心情,工作顺利,生活甜美!'
-					break
-				case hours >= 7 && hours <= 8:
-					title = '早上好,记得吃早餐喔'
-					desc = '一日之计在于晨,愿我这阳光初露时的小小问候能将快乐带给你,愿你用快乐开启,用微笑结束这美好的一天.'
-					break
-				case hours >= 9 && hours <= 10:
-					title = '上午好,时刻保持好心情呀'
-					desc = '上午好,一束阳光照在身,祝你天天都开心,财神家中去,梦想变成真,今天中大奖,明天去上任.'
-					break
-				case hours >= 11 && hours <= 12:
-					title = '中午好,午餐时间到啦'
-					desc = '中午好,到了吃午餐的时间了,吃完午餐记得午睡一小会,保证下午可以有良好的精神状态.'
-					break
-				case hours >= 13 && hours <= 16:
-					title = '下午好,别太辛苦了'
-					desc = '送各位一杯下午茶:已祝福为叶,叮咛做花,热情为水,包容当杯,喝出你一天好心情和一生的幸福,下午愉快!'
-					break
-				case hours >= 17 && hours <= 18:
-					title = '傍晚啦,看看窗外的风景吧'
-					desc = '工作是做不完的,身体可是累的垮的!看看外面的天空吧!'
-					break
-				case hours >= 19 && hours <= 22:
-					title = '晚上好,准备好进入梦乡啦'
-					desc = '睡前请把窗户打开,让"幸福"进来,睡前请把"心情"打开,让"快乐"入驻,睡前请把"思想"放飞,让甜蜜入梦!今晚祝你好梦成真,幸福一生!晚安!'
-					break
-			}
-			return { title: `Hi! <span class="primary">${this.name}</span>  ${title}`, desc }
-		}
-	},
-	watch: {},
-	created() {},
-	mounted() {},
-	beforeUnmount() {},
-	methods: {}
-}
-</script>
-
-<style lang="scss" scoped></style>
+<template>
+	<sh-header size="large">
+		<template #title>
+			<div v-html="headerTitle.title"></div>
+		</template>
+		<div>{{ headerTitle.desc }}</div>
+	</sh-header>
+</template>
+
+<script>
+export default {
+	name: 'SystemTip',
+	props: {
+		name: {
+			type: String,
+			default: ''
+		}
+	},
+	data() {
+		return {
+			nowdate: new Date()
+		}
+	},
+	computed: {
+		headerDate() {
+			let hours = this.nowdate.getHours()
+			let month = this.nowdate.getMonth() + 1
+			let day = this.nowdate.getDate()
+			let week = this.nowdate.getDay()
+			return { date: this.nowdate, hours, month, day, week }
+		},
+		headerWeek() {
+			let { week } = this.headerDate
+			let tw = ''
+			switch (week) {
+				case 0:
+					tw = '星期天'
+					break
+				case 1:
+					tw = '星期一'
+					break
+				case 2:
+					tw = '星期二'
+					break
+				case 3:
+					tw = '星期三'
+					break
+				case 4:
+					tw = '星期四'
+					break
+				case 5:
+					tw = '星期五'
+					break
+				case 6:
+					tw = '星期六'
+					break
+			}
+			return tw
+		},
+		headerTitle() {
+			let { hours } = this.headerDate
+			let title = ''
+			let desc = ''
+			switch (true) {
+				case hours === 0 || (hours >= 23 && hours <= 24):
+					title = '午夜啦,早点休息喔'
+					desc = '思念不因劳累而改变,问候不因疲惫而变懒,祝福不因休息而变缓,关怀随星星眨眼,牵挂在深夜依然,轻轻道声:祝你晚安!'
+					break
+				case hours >= 1 && hours <= 4:
+					title = '凌晨啦,注意身体喔'
+					desc = '时间不早啦,记得早点休息,保证睡眠质量!'
+					break
+				case hours >= 5 && hours <= 6:
+					title = '清晨啦,准备迎接新的一天吧'
+					desc = '睁开眼,缓一缓,快起床,伸懒腰;笑一笑,美好的一天又开始了.早安,祝你今天好心情,工作顺利,生活甜美!'
+					break
+				case hours >= 7 && hours <= 8:
+					title = '早上好,记得吃早餐喔'
+					desc = '一日之计在于晨,愿我这阳光初露时的小小问候能将快乐带给你,愿你用快乐开启,用微笑结束这美好的一天.'
+					break
+				case hours >= 9 && hours <= 10:
+					title = '上午好,时刻保持好心情呀'
+					desc = '上午好,一束阳光照在身,祝你天天都开心,财神家中去,梦想变成真,今天中大奖,明天去上任.'
+					break
+				case hours >= 11 && hours <= 12:
+					title = '中午好,午餐时间到啦'
+					desc = '中午好,到了吃午餐的时间了,吃完午餐记得午睡一小会,保证下午可以有良好的精神状态.'
+					break
+				case hours >= 13 && hours <= 16:
+					title = '下午好,别太辛苦了'
+					desc = '送各位一杯下午茶:已祝福为叶,叮咛做花,热情为水,包容当杯,喝出你一天好心情和一生的幸福,下午愉快!'
+					break
+				case hours >= 17 && hours <= 18:
+					title = '傍晚啦,看看窗外的风景吧'
+					desc = '工作是做不完的,身体可是累的垮的!看看外面的天空吧!'
+					break
+				case hours >= 19 && hours <= 22:
+					title = '晚上好,准备好进入梦乡啦'
+					desc = '睡前请把窗户打开,让"幸福"进来,睡前请把"心情"打开,让"快乐"入驻,睡前请把"思想"放飞,让甜蜜入梦!今晚祝你好梦成真,幸福一生!晚安!'
+					break
+			}
+			return { title: `Hi! <span class="primary">${this.name}</span>  ${title}`, desc }
+		}
+	},
+	activated() {
+		this.nowdate = new Date()
+	}
+}
+</script>
+
+<style lang="scss" scoped></style>

package/packages/vxeTable/css/index.scss

@@ -243,6 +243,9 @@ button:focus, .vxe-button.type--button:not(.is--disabled):focus{
         }
     }
     &.td-render{}
+    &.flex-render{
+        display: inline-flex;
+    }
     .prefix, .suffix{
         white-space: nowrap;
         display: inline-flex;

package/packages/vxeTable/render/cell/vxe-render-input.vue

@@ -1,5 +1,5 @@
 <template>
-	<span class="vxe-render--inner" :class="{ 'form-render': rform, 'td-render': !rform }">
+	<span class="vxe-render--inner" :class="{ 'form-render': rform, 'td-render': !rform, 'flex-render': controlButton }">
 		<template v-if="redit || isEditAll">
 			<span v-if="rprops.prefixText && rform" class="prefix">
 				<vxe-button v-if="prefixButton" v-bind="psButtonConfig" @click="vxeInputPrefixClick">{{ rprops.prefixText }}</vxe-button>
@@ -61,6 +61,18 @@ export default {
 				let { $form } = this.rparams
 				$form.context.emit('suffix-click', this.rparams, this)
 			}
+		},
+		// 输入框数字加减控制
+		vxeControlClick(bol) {
+			const { step = 1, min, max } = this.rprops
+			let value = bol ? this.$vUtils.add(this.renderValue, step) : this.$vUtils.subtract(this.renderValue, step)
+			if ((min !== undefined && value < min) || (max !== undefined && value > max)) return
+			this.renderValue = value
+			if (this.rform) {
+				this.setFormValue(value)
+			} else {
+				this.setTableValue(value)
+			}
 		}
 	}
 }

package/packages/vxeTable/render/mixin/cell-mixin.js

@@ -89,17 +89,6 @@ export default {
 		}
 	},
 	methods: {
-		// 输入框数字加减控制
-		vxeControlClick(bol) {
-			const { step = 1, min, max } = this.rprops
-			let value = bol ? this.$vUtils.add(this.renderValue, step) : this.$vUtils.subtract(this.renderValue, step)
-			if (value < min || value > max) return
-			if (this.rform) {
-				this.setFormValue(value)
-			} else {
-				this.setTableValue(value)
-			}
-		},
 		// 输入框变化
 		async vxeInputChange({ value, $event }) {
 			if (!this.rform) {