diff --git a/Web/src/assets/style/app.less b/Web/src/assets/style/app.less index 1a8faa4..b66c29d 100644 --- a/Web/src/assets/style/app.less +++ b/Web/src/assets/style/app.less @@ -22,6 +22,7 @@ @import './lib/description.less'; @import './lib/select.less'; @import './lib/dropdown.less'; +@import './lib/modal.less'; @import './lib/tree-layout.less'; @import './lib/authority-view.less'; @import './lib/icon-selector.less'; diff --git a/Web/src/assets/style/lib/modal.less b/Web/src/assets/style/lib/modal.less new file mode 100644 index 0000000..4a0fb66 --- /dev/null +++ b/Web/src/assets/style/lib/modal.less @@ -0,0 +1,33 @@ +@import (reference) '~@/assets/style/extend.less'; +.ant-modal-content { + background-color: fade(@primary-color, 20%); + + backdrop-filter: blur(10px); +} +.ant-modal-header { + padding: @padding-sm @padding-md; + + background-color: transparent; +} +.ant-modal-title { + color: fade(@white, 85%); +} +.ant-modal-body { + background-color: @white; +} +.ant-modal-footer { + background-color: @white; +} +.ant-modal-close { + color: fade(@white, 45%); + &:focus, + &:hover { + color: fade(@white, 75%); + } +} +.ant-modal-close-x { + line-height: 46px; + + width: 46px; + height: 46px; +} diff --git a/Web/src/components/yoTreeLayout/index.js b/Web/src/components/yoTreeLayout/index.js index d03f2f5..2cdac96 100644 --- a/Web/src/components/yoTreeLayout/index.js +++ b/Web/src/components/yoTreeLayout/index.js @@ -1,3 +1,7 @@ +import Swiper from 'swiper' + +let timer, swiper + export default { props: { loadData: { @@ -20,6 +24,7 @@ export default { searchValue: '', + selectedKeys: [], expandedKeys: [], autoExpandParent: true } @@ -29,7 +34,64 @@ export default { this.onLoadData() }, + mounted() { + const container = this.$refs.swiper, + scrollBar = container.querySelector('.swiper-scrollbar') + + const swiperOptions = { + direction: 'vertical', + slidesPerView: 'auto', + freeMode: true, + scrollbar: { + el: scrollBar, + }, + mousewheel: true, + } + + swiper = new Swiper(container, swiperOptions) + + window.addEventListener('resize', () => { + this.onUpdateSwiper() + }) + + }, + methods: { + + renderBreadcrumbItem() { + + const path = ['顶级'] + + const findPath = (data, level) => { + level = level || 1 + for (let i = 0; i < data.length; i++) { + const item = data[i] + + path[level] = item.title + + if (item.id === this.selectedKeys[0]) { + path.length = level + 1 + return true + } + + if (item.children && item.children.length) { + const found = findPath(item.children, level + 1) + if (found) { + return true + } + } + } + } + + if (this.selectedKeys.length) { + findPath(this.data) + } + + return path.map(p => ( + {p} + )) + }, + onLoadData() { this.loading = true @@ -42,6 +104,10 @@ export default { } this.data = data + this.$nextTick(() => { + this.onUpdateSwiper() + }) + this.loading = false }) }, @@ -51,8 +117,9 @@ export default { }, onExpand(expandedKeys) { - this.expandedKeys = expandedKeys; - this.autoExpandParent = false; + this.expandedKeys = expandedKeys + this.autoExpandParent = false + this.onUpdateSwiper() }, onSearch(value) { @@ -77,9 +144,18 @@ export default { const data = this.list.find(m => m.key === p) selectedIds.push(data.id) }) + this.selectedKeys = selectedIds this.$emit('select', selectedIds) }, + onUpdateSwiper() { + clearTimeout(timer) + timer = setTimeout(() => { + swiper.update() + swiper.update() + }, 300) + }, + generateKey(data, level) { const n = level || [0] n.push(0) @@ -98,9 +174,9 @@ export default { // 这里获取不到Key for (let i = 0; i < data.length; i++) { const { key, id, title, children } = data[i] - this.list.push({ key, id, title }); + this.list.push({ key, id, title }) if (children) { - this.generateList(children); + this.generateList(children) } } }, @@ -108,12 +184,12 @@ export default { getParentKey(key, tree) { let parentKey; for (let i = 0; i < tree.length; i++) { - const node = tree[i]; + const node = tree[i] if (node.children) { if (node.children.some(item => item.key === key)) { - parentKey = node.key; + parentKey = node.key } else if (this.getParentKey(key, node.children)) { - parentKey = this.getParentKey(key, node.children); + parentKey = this.getParentKey(key, node.children) } } } @@ -123,14 +199,6 @@ export default { render() { - const swiperOptions = { - direction: 'vertical', - slidesPerView: 'auto', - freeMode: true, - scrollbar: true, - mousewheel: true, - } - const props = { treeData: this.data, expandedKeys: this.expandedKeys, @@ -170,16 +238,24 @@ export default { - - - - - - - - +
+
+
+ + + + +
+
+
+
+ + + {this.renderBreadcrumbItem()} + + {this.$scopedSlots.default ? this.$scopedSlots.default() : null} diff --git a/Web/src/main.js b/Web/src/main.js index e59459e..a4b1f0f 100644 --- a/Web/src/main.js +++ b/Web/src/main.js @@ -13,9 +13,7 @@ Vue.use(Antd) /** * 引入swiper */ -import VueAwesomeSwiper from 'vue-awesome-swiper' import 'swiper/swiper-bundle.css' -Vue.use(VueAwesomeSwiper) import { Swiper as SwiperClass, Pagination, diff --git a/Web/src/pages/system/_seed/editForm.vue b/Web/src/pages/system/_seed/editForm.vue index 6660ec9..9e4dde4 100644 --- a/Web/src/pages/system/_seed/editForm.vue +++ b/Web/src/pages/system/_seed/editForm.vue @@ -2,7 +2,8 @@ diff --git a/Web/src/pages/system/_seed/index.vue b/Web/src/pages/system/_seed/index.vue index 70128a9..a3d8c57 100644 --- a/Web/src/pages/system/_seed/index.vue +++ b/Web/src/pages/system/_seed/index.vue @@ -166,7 +166,6 @@ export default { this.$message.success(successMessage); this.onReloadData(); } - this.$refs.table.onLoaded(); }, /** @@ -180,6 +179,9 @@ export default { .testDeleteApi(record) .then(({ success }) => { this.onResult(success, '删除成功'); + }) + .finally(() => { + this.$refs.table.onLoaded(); }); }, }, diff --git a/Web/src/pages/system/dict/dictdata/editForm.vue b/Web/src/pages/system/dict/dictdata/editForm.vue index 4d40475..8d40561 100644 --- a/Web/src/pages/system/dict/dictdata/editForm.vue +++ b/Web/src/pages/system/dict/dictdata/editForm.vue @@ -5,7 +5,7 @@ @cancel="onCancel" @ok="onOk" class="yo-modal-form" - title="编辑XX" + title="编辑字典数据" > diff --git a/Web/src/pages/system/org/addForm.vue b/Web/src/pages/system/org/addForm.vue index af133ac..074d470 100644 --- a/Web/src/pages/system/org/addForm.vue +++ b/Web/src/pages/system/org/addForm.vue @@ -42,9 +42,7 @@ export default { await this.formBody.onInit(); // 获取外部选中的部门id - this.formBody.onFillData({ - pid: orgId, - }); + this.formBody.onFillData(record, orgId); }); }, diff --git a/Web/src/pages/system/org/form.vue b/Web/src/pages/system/org/form.vue index 8bda668..dbd636e 100644 --- a/Web/src/pages/system/org/form.vue +++ b/Web/src/pages/system/org/form.vue @@ -11,6 +11,7 @@ - +
@@ -39,7 +40,10 @@ import { EMPTY_ID } from '@/util/global'; export default { data() { return { - form: {}, + form: { + pid: undefined, + sort: 100, + }, rules: { name: [{ required: true, message: '请输入机构名称' }], code: [{ required: true, message: '请输入唯一编码' }], @@ -56,8 +60,12 @@ export default { * 必要的方法 * 在打开编辑页时允许填充数据 */ - onFillData(record) { - this.form = this.$_.cloneDeep(record); + onFillData(record, orgId) { + if (orgId) { + this.form.pid = orgId; + } else if (record) { + this.form = this.$_.cloneDeep(record); + } }, /** @@ -98,10 +106,6 @@ export default { ]; }); }, - - onChangeExtData(value, record, type) { - record[type] = value; - }, }, }; \ No newline at end of file diff --git a/Web/src/pages/system/org/index.vue b/Web/src/pages/system/org/index.vue index baa4946..3c97e6a 100644 --- a/Web/src/pages/system/org/index.vue +++ b/Web/src/pages/system/org/index.vue @@ -6,7 +6,6 @@ ref="tree-layout" > -
diff --git a/Web/src/pages/system/user/addForm.vue b/Web/src/pages/system/user/addForm.vue index 346526e..58bde42 100644 --- a/Web/src/pages/system/user/addForm.vue +++ b/Web/src/pages/system/user/addForm.vue @@ -43,11 +43,7 @@ export default { await this.formBody.onInit(); // 获取外部选中的部门id - this.formBody.onFillData({ - sysEmpParam: { - orgId: id, - }, - }); + this.formBody.onFillData(record, id); }); }, diff --git a/Web/src/pages/system/user/form.vue b/Web/src/pages/system/user/form.vue index 1a79311..f35bba0 100644 --- a/Web/src/pages/system/user/form.vue +++ b/Web/src/pages/system/user/form.vue @@ -57,9 +57,10 @@
@@ -89,6 +90,7 @@