hs-admin-ui 1.0.0

package/src/types/views.d.ts

@@ -0,0 +1,331 @@
+/**
+ * views personal
+ */
+type NewInfo = {
+	title: string;
+	date: string;
+	link: string;
+};
+type Recommend = {
+	title: string;
+	msg: string;
+	icon: string;
+	bg: string;
+	iconColor: string;
+};
+declare type PersonalState = {
+	newsInfoList: NewInfo[];
+	recommendList: Recommend[];
+	personalForm: {
+		name: string;
+		email: string;
+		autograph: string;
+		occupation: string;
+		phone: string;
+		sex: string;
+	};
+};
+
+/**
+ * views visualizing
+ */
+declare type Demo2State<T = any> = {
+	time: {
+		txt: string;
+		fun: number;
+	};
+	dropdownList: T[];
+	dropdownActive: string;
+	skyList: T[];
+	dBtnList: T[];
+	chartData4Index: number;
+	dBtnActive: number;
+	earth3DBtnList: T[];
+	chartData4List: T[];
+	myCharts: T[];
+};
+
+/**
+ * views params
+ */
+declare type ParamsState = {
+	value: string;
+	tagsViewName: string;
+	tagsViewNameIsI18n: boolean;
+};
+
+/**
+ * views system
+ */
+// role
+declare interface RowRoleType {
+	roleName: string;
+	roleSign: string;
+	describe: string;
+	sort: number;
+	status: boolean;
+	createTime: string;
+}
+
+interface SysRoleTableType extends TableType {
+	data: RowRoleType[];
+}
+
+declare interface SysRoleState {
+	tableData: SysRoleTableType;
+}
+
+declare type TreeType = {
+	id: number;
+	label: string;
+	children?: TreeType[];
+};
+
+// user
+declare type RowUserType<T = any> = {
+	userName: string;
+	userNickname: string;
+	roleSign: string;
+	department: string[];
+	phone: string;
+	email: string;
+	sex: string;
+	password: string;
+	overdueTime: T;
+	status: boolean;
+	describe: string;
+	createTime: T;
+};
+
+interface SysUserTableType extends TableType {
+	data: RowUserType[];
+}
+
+declare interface SysUserState {
+	columns: Array;
+	tableData: SysUserTableType;
+}
+
+declare type DeptTreeType = {
+	deptName: string;
+	createTime: string;
+	status: boolean;
+	sort: number;
+	describe: string;
+	id: number | string;
+	children?: DeptTreeType[];
+};
+
+// dept
+declare interface RowDeptType extends DeptTreeType {
+	deptLevel: string[];
+	person: string;
+	phone: string;
+	email: string;
+}
+
+interface SysDeptTableType extends TableType {
+	data: DeptTreeType[];
+}
+
+declare interface SysDeptState {
+	tableData: SysDeptTableType;
+}
+
+// dic
+type ListType = {
+	id: number;
+	label: string;
+	value: string;
+};
+
+declare interface RowDicType {
+	dicName: string;
+	fieldName: string;
+	describe: string;
+	status: boolean;
+	createTime: string;
+	list: ListType[];
+}
+
+interface SysDicTableType extends TableType {
+	data: RowDicType[];
+}
+
+declare interface SysDicState {
+	tableData: SysDicTableType;
+}
+
+/**
+ * views pages
+ */
+//  filtering
+declare type FilteringChilType = {
+	id: number | string;
+	label: string;
+	active: boolean;
+};
+
+declare type FilterListType = {
+	img: string;
+	title: string;
+	evaluate: string;
+	collection: string;
+	price: string;
+	monSales: string;
+	id: number | string;
+	loading?: boolean;
+};
+
+declare type FilteringRowType = {
+	title: string;
+	isMore: boolean;
+	isShowMore: boolean;
+	id: number | string;
+	children: FilteringChilType[];
+};
+
+// tableRules
+declare type TableRulesHeaderType = {
+	prop: string;
+	width: string | number;
+	label: string;
+	isRequired?: boolean;
+	isTooltip?: boolean;
+	type: string;
+};
+
+declare type TableRulesState = {
+	tableData: {
+		data: EmptyObjectType[];
+		header: TableRulesHeaderType[];
+		option: SelectOptionType[];
+	};
+};
+
+declare type TableRulesOneProps = {
+	name: string;
+	email: string;
+	autograph: string;
+	occupation: string;
+};
+
+// tree
+declare type RowTreeType = {
+	id: number;
+	label: string;
+	label1: string;
+	label2: string;
+	isShow: boolean;
+	children?: RowTreeType[];
+};
+
+// workflow index
+declare type NodeListState = {
+	id: string | number;
+	nodeId: string | undefined;
+	class: HTMLElement | string;
+	left: number | string;
+	top: number | string;
+	icon: string;
+	name: string;
+};
+
+declare type LineListState = {
+	sourceId: string;
+	targetId: string;
+	label: string;
+};
+
+declare type XyState = {
+	x: string | number;
+	y: string | number;
+};
+
+declare type WorkflowState<T = any> = {
+	leftNavList: T[];
+	dropdownNode: XyState;
+	dropdownLine: XyState;
+	isShow: boolean;
+	jsPlumb: T;
+	jsPlumbNodeIndex: null | number;
+	jsplumbDefaults: T;
+	jsplumbMakeSource: T;
+	jsplumbMakeTarget: T;
+	jsplumbConnect: T;
+	jsplumbData: {
+		nodeList: NodeListState[];
+		lineList: LineListState[];
+	};
+};
+
+// workflow drawer
+declare type WorkflowDrawerNodeState<T = any> = {
+	node: { [key: string]: T };
+	nodeRules: T;
+	form: T;
+	tabsActive: string;
+	loading: {
+		extend: boolean;
+	};
+};
+
+declare type WorkflowDrawerLabelType = {
+	type: string;
+	label: string;
+};
+
+declare type WorkflowDrawerState<T = any> = {
+	isOpen: boolean;
+	nodeData: {
+		type: string;
+	};
+	jsplumbConn: T;
+};
+
+/**
+ * views make
+ */
+// tableDemo
+declare type TableDemoPageType = {
+	pageNum: number;
+	pageSize: number;
+};
+
+declare type TableHeaderType = {
+	key: string;
+	width: string;
+	title: string;
+	type: string | number;
+	colWidth: string;
+	width?: string | number;
+	height?: string | number;
+	isCheck: boolean;
+};
+
+declare type TableSearchType = {
+	label: string;
+	prop: string;
+	placeholder: string;
+	required: boolean;
+	type: string;
+	options?: SelectOptionType[];
+};
+
+declare type TableDemoState = {
+	tableData: {
+		data: EmptyObjectType[];
+		header: TableHeaderType[];
+		config: {
+			total: number;
+			loading: boolean;
+			isBorder: boolean;
+			isSelection: boolean;
+			isSerialNo: boolean;
+			isOperate: boolean;
+		};
+		search: TableSearchType[];
+		param: EmptyObjectType;
+		printName: string;
+	};
+};

package/src/utils/arrayOperation.ts

@@ -0,0 +1,65 @@
+/**
+ * 判断两数组字符串是否相同（用于按钮权限验证），数组字符串中存在相同时会自动去重（按钮权限标识不会重复）
+ * @param news 新数据
+ * @param old 源数据
+ * @returns 两数组相同返回 `true`，反之则反
+ */
+export function judementSameArr(newArr: unknown[] | string[], oldArr: string[]): boolean {
+	const news = removeDuplicate(newArr);
+	const olds = removeDuplicate(oldArr);
+	let count = 0;
+	const leng = news.length;
+	for (let i in olds) {
+		for (let j in news) {
+			if (olds[i] === news[j]) count++;
+		}
+	}
+	return count === leng ? true : false;
+}
+
+/**
+ * 判断两个对象是否相同
+ * @param a 要比较的对象一
+ * @param b 要比较的对象二
+ * @returns 相同返回 true，反之则反
+ */
+export function isObjectValueEqual<T>(a: T, b: T): boolean {
+	if (!a || !b) return false;
+	let aProps = Object.getOwnPropertyNames(a);
+	let bProps = Object.getOwnPropertyNames(b);
+	if (aProps.length != bProps.length) return false;
+	for (let i = 0; i < aProps.length; i++) {
+		let propName = aProps[i];
+		let propA = a[propName];
+		let propB = b[propName];
+		if (!b.hasOwnProperty(propName)) return false;
+		if (propA instanceof Object) {
+			if (!isObjectValueEqual(propA, propB)) return false;
+		} else if (propA !== propB) {
+			return false;
+		}
+	}
+	return true;
+}
+
+/**
+ * 数组、数组对象去重
+ * @param arr 数组内容
+ * @param attr 需要去重的键值（数组对象）
+ * @returns
+ */
+export function removeDuplicate(arr: EmptyArrayType, attr?: string) {
+	if (!Object.keys(arr).length) {
+		return arr;
+	} else {
+		if (attr) {
+			const obj: EmptyObjectType = {};
+			return arr.reduce((cur: EmptyArrayType[], item: EmptyArrayType) => {
+				obj[item[attr]] ? '' : (obj[item[attr]] = true && item[attr] && cur.push(item));
+				return cur;
+			}, []);
+		} else {
+			return [...new Set(arr)];
+		}
+	}
+}

package/src/utils/authFunction.ts

@@ -0,0 +1,38 @@
+import { useUserInfo } from '/@/stores/userInfo';
+import { judementSameArr } from '/@/utils/arrayOperation';
+
+/**
+ * 单个权限验证
+ * @param value 权限值
+ * @returns 有权限，返回 `true`，反之则反
+ */
+export function auth(value: string): boolean {
+	const stores = useUserInfo();
+	return stores.userInfos.authBtnList.some((v: string) => v === value);
+}
+
+/**
+ * 多个权限验证，满足一个则为 true
+ * @param value 权限值
+ * @returns 有权限，返回 `true`，反之则反
+ */
+export function auths(value: Array<string>): boolean {
+	let flag = false;
+	const stores = useUserInfo();
+	stores.userInfos.authBtnList.map((val: string) => {
+		value.map((v: string) => {
+			if (val === v) flag = true;
+		});
+	});
+	return flag;
+}
+
+/**
+ * 多个权限验证，全部满足则为 true
+ * @param value 权限值
+ * @returns 有权限，返回 `true`，反之则反
+ */
+export function authAll(value: Array<string>): boolean {
+	const stores = useUserInfo();
+	return judementSameArr(value, stores.userInfos.authBtnList);
+}

package/src/utils/build.ts

@@ -0,0 +1,124 @@
+import importToCDN from 'vite-plugin-cdn-import';
+
+/**
+ * 打包相关
+ * 注意 prodUrl：使用的是 jsdelivr 还是 unpkg。它们的 path 可能不一致
+ * @description importToCDN https://github.com/mmf-fe/vite-plugin-cdn-import
+ * @description cdn 在线引入的 cdn 地址配置。path：https://www.jsdelivr.com/ || https://unpkg.com/
+ * @description external 打包时，过滤包导入。参考：https://rollupjs.org/configuration-options/#external
+ */
+export const buildConfig = {
+	cdn() {
+		return importToCDN({
+			prodUrl: 'https://unpkg.com/{name}@{version}/{path}',
+			modules: [
+				// autoComplete('vue'),
+				// autoComplete('axios'),
+				{
+					name: 'vue',
+					var: 'Vue',
+					path: 'dist/vue.global.js',
+				},
+				{
+					name: 'vue-demi',
+					var: 'VueDemi',
+					path: 'lib/index.iife.js',
+				},
+				{
+					name: 'vue-router',
+					var: 'VueRouter',
+					path: 'dist/vue-router.global.js',
+				},
+				{
+					name: 'element-plus',
+					var: 'ElementPlus',
+					path: 'dist/index.full.js',
+				},
+				// {
+				// 	name: '/@element-plus/icons-vue',
+				// 	var: 'ElementPlusIconsVue',
+				// 	path: 'dist/index.iife.min.js',
+				// },
+				// {
+				// 	name: 'echarts',
+				// 	var: 'echarts',
+				// 	path: 'dist/echarts.min.js',
+				// },
+				// {
+				// 	name: 'echarts-gl',
+				// 	var: 'echarts-gl',
+				// 	path: 'dist/echarts-gl.min.js',
+				// },
+				// {
+				// 	name: 'echarts-wordcloud',
+				// 	var: 'echarts-wordcloud',
+				// 	path: 'dist/echarts-wordcloud.min.js',
+				// },
+				// {
+				// 	name: 'vue-i18n',
+				// 	var: 'VueI18n',
+				// 	path: 'dist/vue-i18n.global.min.js',
+				// },
+				// {
+				// 	name: 'jsplumb',
+				// 	var: 'jsPlumb',
+				// 	path: 'dist/js/jsplumb.min.js',
+				// },
+				// {
+				// 	name: 'cropperjs',
+				// 	var: 'Cropper',
+				// 	path: 'dist/cropper.min.js',
+				// },
+				// {
+				// 	name: 'sortablejs',
+				// 	var: 'Sortable',
+				// 	path: 'Sortable.min.js',
+				// },
+				// {
+				// 	name: 'qrcodejs2-fixes',
+				// 	var: 'QRCode',
+				// 	path: 'qrcode.min.js',
+				// },
+				// {
+				// 	name: 'print-js',
+				// 	var: 'printJS',
+				// 	path: 'dist/print.min.js',
+				// },
+				// {
+				// 	name: '/@wangeditor/editor',
+				// 	var: 'wangEditor',
+				// 	path: 'dist/index.min.js',
+				// },
+				// {
+				// 	name: '/@wangeditor/editor-for-vue',
+				// 	var: 'WangEditorForVue',
+				// 	path: 'dist/index.min.js',
+				// },
+				// {
+				// 	name: 'vue-grid-layout',
+				// 	var: 'VueGridLayout',
+				// 	path: 'https://cdn.jsdelivr.net/npm/vue-grid-layout@3.0.0-beta1/dist/vue-grid-layout.umd.min.js',
+				// },
+			],
+		});
+	},
+	external: [
+		'vue',
+		// 'axios',
+		'vue-router',
+		'element-plus',
+		// '/@element-plus/icons-vue',
+		// 'echarts',
+		// 'echarts-gl',
+		// 'echarts-wordcloud',
+		// 'vue-i18n',
+		// 'jsplumb',
+		// 'cropperjs',
+		// 'sortablejs',
+		// 'qrcodejs2-fixes',
+		// 'print-js',
+		// '/@wangeditor/editor',
+		// '/@wangeditor/editor-for-vue',
+		// 'vue-grid-layout',
+	],
+};

package/src/utils/commonFunction.ts

@@ -0,0 +1,64 @@
+// 通用函数
+import useClipboard from 'vue-clipboard3';
+import { ElMessage } from 'element-plus';
+import { formatDate } from '/@/utils/formatTime';
+
+export default function () {
+	const { toClipboard } = useClipboard();
+
+	// 百分比格式化
+	const percentFormat = (row: EmptyArrayType, column: number, cellValue: string) => {
+		return cellValue ? `${cellValue}%` : '-';
+	};
+	// 列表日期时间格式化
+	const dateFormatYMD = (row: EmptyArrayType, column: number, cellValue: string) => {
+		if (!cellValue) return '-';
+		return formatDate(new Date(cellValue), 'YYYY-mm-dd');
+	};
+	// 列表日期时间格式化
+	const dateFormatYMDHMS = (row: EmptyArrayType, column: number, cellValue: string) => {
+		if (!cellValue) return '-';
+		return formatDate(new Date(cellValue), 'YYYY-mm-dd HH:MM:SS');
+	};
+	// 列表日期时间格式化
+	const dateFormatHMS = (row: EmptyArrayType, column: number, cellValue: string) => {
+		if (!cellValue) return '-';
+		let time = 0;
+		if (typeof row === 'number') time = row;
+		if (typeof cellValue === 'number') time = cellValue;
+		return formatDate(new Date(time * 1000), 'HH:MM:SS');
+	};
+	// 小数格式化
+	const scaleFormat = (value: string = '0', scale: number = 4) => {
+		return Number.parseFloat(value).toFixed(scale);
+	};
+	// 小数格式化
+	const scale2Format = (value: string = '0') => {
+		return Number.parseFloat(value).toFixed(2);
+	};
+	// 点击复制文本
+	const copyText = (text: string) => {
+		return new Promise((resolve, reject) => {
+			try {
+				// 复制
+				toClipboard(text);
+				// 下面可以设置复制成功的提示框等操作
+				ElMessage.success('复制成功!');
+				resolve(text);
+			} catch (e) {
+				// 复制失败
+				ElMessage.error('复制失败!');
+				reject(e);
+			}
+		});
+	};
+	return {
+		percentFormat,
+		dateFormatYMD,
+		dateFormatYMDHMS,
+		dateFormatHMS,
+		scaleFormat,
+		scale2Format,
+		copyText,
+	};
+}