sh-view 1.5.2

package/packages/components/global-components/sh-vxe-table/js/props.js

@@ -0,0 +1,311 @@
+export default {
+	id: {
+		type: String,
+		default: 'shtable'
+	},
+	dataSourse: {
+		type: Array,
+		default() {
+			return []
+		}
+	},
+	columns: {
+		type: Array,
+		default() {
+			return []
+		}
+	},
+	width: {
+		type: [Number, String]
+	},
+	height: {
+		type: [Number, String]
+	},
+	maxHeight: {
+		type: [Number, String]
+	},
+	autoResize: {
+		type: Boolean,
+		default: true
+	},
+	syncResize: {
+		type: [Boolean, String, Number],
+		default: true
+	},
+	stripe: {
+		type: Boolean,
+		default: true
+	},
+	border: {
+		type: [Boolean, String],
+		default: 'full'
+	},
+	round: {
+		type: Boolean,
+		default: false
+	},
+	size: {
+		type: String,
+		default: 'small' //  medium / small / mini
+	},
+	loading: {
+		type: Boolean,
+		default: false
+	},
+	align: {
+		type: String,
+		default: 'left'
+	},
+	headerAlign: {
+		type: String,
+		default: 'center'
+	},
+	showHeader: {
+		type: Boolean,
+		default: true
+	},
+	rowClassName: {
+		type: [String, Function]
+	},
+	cellClassName: {
+		type: [String, Function]
+	},
+	headerRowClassName: {
+		type: [String, Function]
+	},
+	headerCellClassName: {
+		type: [String, Function]
+	},
+	footerRowClassName: {
+		type: [String, Function]
+	},
+	footerCellClassName: {
+		type: [String, Function]
+	},
+	showFooter: {
+		type: Boolean,
+		default: false
+	},
+	footerMethod: {
+		type: Function
+	},
+	mergeCells: {
+		type: [Array]
+	},
+	mergeFooterItems: {
+		type: [Array]
+	},
+	showOverflow: {
+		type: [Boolean, String],
+		default: 'tooltip'
+	},
+	showHeaderOverflow: {
+		type: [Boolean, String],
+		default: 'tooltip'
+	},
+	showFooterOverflow: {
+		type: [Boolean, String],
+		default: false
+	},
+	footerSpanMethod: {
+		type: [Function]
+	},
+	keepSource: {
+		type: Boolean,
+		default: true
+	},
+	noDataIcon: {
+		type: String
+	},
+	noDataText: {
+		type: String
+	},
+	rowConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	columnConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	seqConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	checkboxConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	radioConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	treeConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	expandConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	tooltipConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	editConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	validConfig: {
+		default() {
+			return { autoPos: true, showMessage: true }
+		}
+	},
+	editRules: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	sortConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	mouseConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	customConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	exportConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	printConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	formConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	toolbarConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	pagerConfig: {
+		type: [Object, Boolean],
+		default: false
+	},
+	keyboardConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	scrollX: {
+		type: Object
+	},
+	scrollY: {
+		type: Object
+	},
+
+	// 扩展配置
+	disabled: {
+		type: Boolean, // 表格是否可编辑，默认不可编辑
+		default: true
+	},
+	columnObj: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	globalConfig: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	footerCalculate: {
+		type: Object,
+		default() {
+			return {
+				calculate: ['subTotal']
+				// subTotal: { name: '合计', data: {} },
+				// allTotal: { name: '总计', data: {} },
+				// mean: { name: '平均', data: {} }
+			}
+		}
+	},
+	reverse: {
+		type: Boolean,
+		default: false
+	},
+	reverseConfig: {
+		type: Object,
+		default() {
+			return {
+				num: 0,
+				keyPrefix: 'reversePre',
+				titPrefix: ''
+			}
+		}
+	},
+	tableName: {
+		type: String,
+		default: ''
+	},
+	queryData: {
+		type: Object,
+		default() {
+			return {}
+		}
+	},
+	onToolbarBtnAddBefore: {
+		type: Function
+	},
+	onToolbarBtnDeleteBefore: {
+		type: Function
+	},
+	onExportMethod: {
+		type: Function
+	},
+	onPrintMethod: {
+		type: Function
+	}
+}

package/packages/components/global-components/sh-vxe-table/mixin/defaultData.js

@@ -0,0 +1,116 @@
+export default {
+	data() {
+		return {
+			// 全局配置
+			globalConfigDefault: {
+				tableName: '',
+				title: false, // 是否显示 tableName
+				checkbox: true, // 是否展示复选框
+				radio: false, // 是否展示单选框
+				seq: true, // 是否展示序号列
+				ghost: false, // 是否开启透明
+				search: false, // 表格是否开启查询，默认不开启，根据columns配置字段 search 为 true
+				globalFilter: false, // 表格是否开启全局过滤
+				zoom: false, // 表格是否开启缩放
+				import: false, // 表格是否支持导入
+				export: false, // 表格是否支持导出
+				print: false, // 表格是否支持导引
+				addRow: false, // 表格是否支持新增行
+				deleteRow: false, // 表格是否支持删除行
+				formToggleNum: 4,
+				formToggle: true
+			},
+			// 分页配置
+			pagerConfigDefault: {
+				enabled: true,
+				currentPage: 1,
+				pageSize: 50,
+				total: 0,
+				className: 'sh-table-footer',
+				slots: {
+					left: 'pagerLeftSlot',
+					right: 'pagerRightSlot'
+				}
+			},
+			// 表头默认值
+			columnObjDefault: {
+				minWidth: 120,
+				sortable: true,
+				filter: true
+			},
+			// 表头默认列
+			columnsConfigDefault: [
+				{
+					title: '',
+					type: 'checkbox',
+					width: 60,
+					align: 'center',
+					fixed: 'left',
+					sortable: false,
+					resizable: false,
+					className: 'table-row-checkbox'
+				},
+				{
+					title: '单选',
+					type: 'radio',
+					width: 60,
+					align: 'center',
+					fixed: 'left',
+					sortable: false,
+					resizable: false,
+					className: 'table-row-radio'
+				},
+				{
+					title: '序号',
+					type: 'seq',
+					width: 70,
+					align: 'center',
+					fixed: 'left',
+					sortable: false,
+					resizable: false,
+					className: 'table-row-seq'
+				}
+			],
+			columnConfigDefault: {
+				isCurrent: false,
+				isHover: true,
+				resizable: true
+			},
+			exportConfigDefault: {
+				type: 'xlsx',
+				types: ['xlsx', 'csv', 'pdf', 'html', 'xml', 'txt'],
+				mode: 'current',
+				original: false,
+				message: true,
+				isHeader: true,
+				isColgroup: true,
+				isFooter: false,
+				isMerge: false,
+				isAllExpand: true,
+				download: true,
+				useStyle: false,
+				columnFilterMethod: this.columnDefaultFilterMethod,
+				sheetMethod: this.exportSheetMethod,
+				beforeExportMethod: obj => this.getExportPrintDataByOption(obj, 'export')
+			},
+			printConfigDefault: {
+				mode: 'current',
+				original: false,
+				message: true,
+				isHeader: true,
+				isColgroup: true,
+				isFooter: false,
+				isMerge: false,
+				isAllExpand: true,
+				download: true,
+				useStyle: false,
+				columnFilterMethod: this.columnDefaultFilterMethod,
+				beforePrintMethod: obj => this.getExportPrintDataByOption(obj, 'print')
+			}
+		}
+	},
+	computed: {},
+	methods: {},
+	created() {},
+	activated() {}
+}

package/packages/components/global-components/sh-vxe-toolbar/index.vue

@@ -0,0 +1,172 @@
+<template>
+	<div class="sh-vxe-toolbar">
+		<div class="toolbar-left">
+			<slot name="left"></slot>
+			<template v-if="isTool">
+				<template v-for="(toolBtn, toolBtnIndex) in toolBtns" :key="toolBtnIndex">
+					<vxe-button v-bind="toolBtn" @click="handleToolBtn(toolBtn)"></vxe-button>
+				</template>
+			</template>
+			<vxe-radio-group v-else v-model="leftActive">
+				<template v-for="(leftBtn, leftBtnIndex) in leftBtns" :key="leftBtnIndex">
+					<vxe-radio-button v-bind="leftBtn" :label="leftBtn.value"></vxe-radio-button>
+				</template>
+			</vxe-radio-group>
+			<slot name="leftr"></slot>
+		</div>
+		<div class="toolbar-right">
+			<slot name="rightl"></slot>
+			<template v-for="(rightBtn, rightBtnIndex) in rightBtns" :key="rightBtnIndex">
+				<vxe-button v-bind="rightBtn" @click="handleRightBtn(rightBtn)"></vxe-button>
+			</template>
+			<slot name="right"></slot>
+		</div>
+	</div>
+</template>
+
+<script>
+export default {
+	name: 'ShToolbar',
+	props: {
+		modelValue: {
+			type: String
+		},
+		relation: {
+			type: Boolean
+		},
+		leftContain: {
+			type: Array,
+			default() {
+				return []
+			}
+		},
+		leftConfig: {
+			type: Array,
+			default() {
+				return [
+					{ value: '0', code: 'wss', content: '未送审' },
+					{ value: '-1', code: 'bth', content: '被退回' },
+					{ value: '1', code: 'yss', content: '已送审' },
+					{ value: '999', code: 'ygd', content: '已归档' },
+					{ value: '-999', code: 'qb', content: '全部' },
+					{ value: '1', code: 'dsh', content: '待审核' },
+					{ value: '999', code: 'ysh', content: '已审核' }
+				]
+			}
+		},
+		rightConfig: {
+			type: Array,
+			default() {
+				return []
+			}
+		},
+		isTool: {
+			type: Boolean
+		},
+		toolsContain: {
+			type: Array,
+			default() {
+				return []
+			}
+		},
+		toolsConfig: {
+			type: Array,
+			default() {
+				return [
+					{ code: 'add', content: '新增', status: 'primary', icon: 'vxe-icon-add' },
+					{ code: 'edit', content: '修改', status: 'warning', icon: 'vxe-icon-edit' },
+					{ code: 'delete', content: '删除', status: 'danger', icon: 'vxe-icon-delete' },
+					{ code: 'detail', content: '查看', status: '', icon: 'vxe-icon-information' },
+					{ code: 'batch-add', content: '批量新增', status: 'primary', icon: 'vxe-icon-add' },
+					{ code: 'batch-edit', content: '批量修改', status: 'warning', icon: 'vxe-icon-edit' },
+					{ code: 'batch-delete', content: '批量删除', status: 'danger', icon: 'vxe-icon-delete' },
+					{ code: 'batch-detail', content: '查看', status: '', icon: 'vxe-icon-information' }
+				]
+			}
+		}
+	},
+	emits: ['update:modelValue', 'left', 'right', 'tool'],
+	data() {
+		return {
+			leftActive: this.modelValue
+		}
+	},
+	computed: {
+		leftBtns() {
+			let lBtns = []
+			let { leftContain, leftConfig } = this
+			if (leftContain && Array.isArray(leftContain)) {
+				lBtns = leftContain.map(item => {
+					return leftConfig.find(btn => btn.code === item)
+				})
+			}
+			return lBtns
+		},
+		rightBtns() {
+			let rBtns = []
+			let { rightConfig } = this
+			if (rightConfig && Array.isArray(rightConfig)) {
+				rBtns = rightConfig
+			}
+			if (this.relation) {
+				rBtns = rBtns.filter(item => item.code && item.code.split(',').includes(this.leftActive))
+			}
+			return rBtns
+		},
+		toolBtns() {
+			let toolBtns = []
+			let { toolsContain, toolsConfig } = this
+			if (toolsContain && Array.isArray(toolsContain)) {
+				toolBtns = toolsContain.map(item => {
+					return toolsConfig.find(btn => btn.code === item)
+				})
+			}
+			return toolBtns
+		}
+	},
+	watch: {
+		modelValue(nv, ov) {
+			this.leftActive = nv
+		},
+		leftActive(nv, ov) {
+			this.$emit('update:modelValue', nv)
+			this.handleLeftBtn(nv)
+		}
+	},
+	methods: {
+		handleLeftBtn(value) {
+			let btnObj = this.leftConfig.find(item => item.value === value)
+			this.$emit('left', value, btnObj)
+		},
+		handleRightBtn(btn) {
+			this.$emit('right', btn.value, btn)
+		},
+		handleToolBtn(btn) {
+			this.$emit('tool', btn)
+		}
+	}
+}
+</script>
+
+<style lang="scss">
+.sh-vxe-toolbar {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	padding: 10px 5px;
+	box-sizing: border-box;
+	background-color: var(--body-background);
+	.toolbar-left {
+		flex: 1;
+		white-space: nowrap;
+		.vxe-radio-button > input:checked + .vxe-radio--label {
+			border-color: var(--theme-color);
+			background: linear-gradient(-10deg, var(--theme-color), var(--theme-weak-color));
+		}
+	}
+	.toolbar-right {
+		flex: 0;
+		white-space: nowrap;
+	}
+}
+</style>