xiaoguangbin/AnalysisSystemForRadionuclide_vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 增加空状态组件，修改全局空状态；优化scheduling日期字体大小，修复穿梭框中存在的问题

Browse Source
This commit is contained in:
Xu Zhimeng 2023-06-07 15:47:22 +08:00
parent fa1bdd7e3b
commit 6477f78761
12 changed files with 66 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/App.vue
View File

@ -3,6 +3,9 @@
<div id="app">
<router-view/>
</div>
<template #renderEmpty>
<custom-empty></custom-empty>
</template>
</a-config-provider>
</template>
<script>

BIN
src/assets/images/global/no-data.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

14
src/components/CustomEmpty/index.vue Normal file
View File

@ -0,0 +1,14 @@
<template>
<a-empty :image="emptyImg"></a-empty>
</template>
<script>
import emptyImg from '@/assets/images/global/no-data.png'
export default {
data() {
return {
emptyImg
}
}
}
</script>

2
src/components/CustomPopoverSearch/index.vue
View File

@ -35,7 +35,7 @@
</template>
<template v-else>
<div style="padding: 20px 0">
<a-empty></a-empty>
<custom-empty></custom-empty>
</div>
</template>
</template>

6
src/components/jeecg/JSuperQuery.vue
View File

@ -47,13 +47,13 @@
<a-row>
<a-col :sm="24" :md="24-5">
<a-empty v-if="queryParamsModel.length === 0" style="margin-bottom: 12px;">
<custom-empty v-if="queryParamsModel.length === 0" style="margin-bottom: 12px;">
<div slot="description">
<span>没有任何查询条件</span>
<a-divider type="vertical"/>
<a @click="handleAdd">点击新增</a>
</div>
</a-empty>
</custom-empty>
<a-form v-else layout="inline">
@ -194,7 +194,7 @@
保存的查询
</div>
<a-empty v-if="saveTreeData.length === 0" class="j-super-query-history-empty" description="没有保存任何查询"/>
<custom-empty v-if="saveTreeData.length === 0" class="j-super-query-history-empty" description="没有保存任何查询"/>
<a-tree
v-else
class="j-super-query-history-tree"

2
src/components/jeecgbiz/modal/JSelectDepartModal.vue
View File

@ -11,7 +11,7 @@
switchFullscreen>
<a-spin tip="Loading..." :spinning="false">
<a-input-search v-model="searchValue" style="margin-bottom: 1px" placeholder="Enter Department Name To Search" />
<a-empty v-if="filterTreeData.length===0"></a-empty>
<custom-empty v-if="filterTreeData.length===0"></custom-empty>
<a-tree
v-else
checkable

2
src/main.js
View File

@ -56,6 +56,7 @@ import CustomTable from '@/components/CustomTable'
import CustomModal from '@/components/CustomModal'
import CustomDatePicker from '@/components/CustomDatePicker'
import CustomMonthPicker from '@/components/CustomMonthPicker'
import CustomEmpty from '@/components/CustomEmpty'
Vue.prototype.rules = rules
@ -77,6 +78,7 @@ Vue.component('custom-table', CustomTable)
Vue.component('custom-modal', CustomModal)
Vue.component('custom-date-picker', CustomDatePicker)
Vue.component('custom-month-picker', CustomMonthPicker)
Vue.component('custom-empty', CustomEmpty)
SSO.init(() => {
main()

3
src/style.less
View File

@ -255,7 +255,6 @@ body {
}
&-date {
padding: 20px 10px 10px !important;
margin: 0 !important;
height: 159px !important;
border-top: none !important;
@ -603,7 +602,7 @@ body {
// 空状态
.ant-empty {
background-color: transparent;
color: #fff;
color: #145b5c;
}
// 分页器样式

4
src/views/system/DepartList.vue
View File

@ -132,9 +132,9 @@
</div>
</a-card>
<a-card v-else >
<a-empty>
<custom-empty>
<span slot="description"> 请先选择一个部门! </span>
</a-empty>
</custom-empty>
</a-card>
</a-tab-pane>
<a-tab-pane tab="部门权限" key="2" forceRender>

6
src/views/system/DepartListSync.vue
View File

@ -24,7 +24,7 @@
<a-input-search @search="onSearch" style="width:100%;margin-top: 10px" placeholder="请输入部门名称"/>
<!-- 树-->
<div>
<a-empty v-if="departTree.length===0" description="暂无部门" style="margin-top: 8px;"/>
<custom-empty v-if="departTree.length===0" description="暂无部门" style="margin-top: 8px;"/>
<template v-else>
<a-dropdown :trigger="[this.dropTrigger]" @visibleChange="dropStatus">
<span style="user-select: none">
@ -127,9 +127,9 @@
</div>
</a-card>
<a-card v-else >
<a-empty>
<custom-empty>
<span slot="description"> 请先选择一个部门! </span>
</a-empty>
</custom-empty>
</a-card>
</a-tab-pane>
<a-tab-pane tab="部门权限" key="2" forceRender>

74
src/views/system/Scheduling.vue
View File

@ -50,7 +50,7 @@
<!-- 右侧边框结束 -->
</div>
</div>
<a-empty v-if="!schedulingInfo || !schedulingInfo.length" style="margin-top: 40px;"></a-empty>
<custom-empty v-if="!schedulingInfo || !schedulingInfo.length" style="margin-top: 40px;"></custom-empty>
</div>
<!-- 内容结束 -->
</a-card>
@ -117,16 +117,18 @@
<a-spin :spinning="isGettingDetail">
<div class="account-assign">
<a-transfer
:selectedKeys="selectedStationKeys"
:selected-keys.sync="selectedStationKeys"
:target-keys="targetKeys"
:render="item => item.title"
:operations="['Assign', 'Remove']"
:titles="['Particulate Station', 'Roster personnel']"
:show-select-all="false"
@change="onChange"
@selectChange="handleSelectChange"
>
<template slot="children" slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect } }">
<template
slot="children"
slot-scope="{ props: { direction, selectedKeys }, on: { itemSelect, itemSelectAll } }"
>
<!-- 左侧穿梭框中的树 -->
<a-tree
v-if="direction === 'left'"
@ -146,7 +148,9 @@
onChecked(_, props, [...selectedKeys, ...targetKeys], itemSelect)
}
"
/>
>
<a-icon slot="switcherIcon" type="down" />
</a-tree>
<!-- 右侧穿梭框中的树 -->
<a-tree
v-if="direction === 'right'"
@ -157,10 +161,12 @@
:expandedKeys.sync="rightAccountChildExpandedKeys"
@select="
(_, props) => {
onSelectAccount(_, props, itemSelect)
onSelectAccount(_, props, itemSelect, itemSelectAll)
}
"
/>
>
<a-icon slot="switcherIcon" type="down" />
</a-tree>
</template>
</a-transfer>
@ -522,10 +528,6 @@ export default {
itemSelect(eventKey, !this.isChecked(checkedKeys, eventKey))
},
handleSelectChange(sourceSelectedKeys, targetSelectedKeys) {
this.selectedStationKeys = [...sourceSelectedKeys, ...targetSelectedKeys]
},
// 处理station列表
handleTreeData(data, targetKeys = [], level) {
data.forEach(item => {
@ -557,34 +559,23 @@ export default {
},
// 选中了穿梭框右侧的树节点
onSelectAccount(_, e, itemSelect) {
const { eventKey, isLeaf, selected } = e.node
// selected 是前一个状态，也就是selected 为false时，其实是选中了
onSelectAccount(_, e, itemSelect, itemSelectAll) {
const { eventKey, isLeaf, selected } = e.node // selected 是前一个状态，也就是selected 为false时，其实是选中了
this.rightAccountChildSelectedKeys = [eventKey]
// 将所有右侧的穿梭状态重置
const allChildKeys = this.accountTreeData.reduce(
(prev, curr) => prev.concat(curr.children.map(child => child.key)),
[]
)
itemSelectAll(allChildKeys, false)
if (isLeaf) {
// 选中了子节点，也就是站点
this.checkedAccount = ''
if (selected) {
// 取消选中
itemSelect(eventKey, false)
} else {
this.accountTreeData.forEach(account => {
// 将所有右侧的穿梭状态重置
account.children.forEach(child => {
itemSelect(child.key, false)
})
})
itemSelect(eventKey, true) // 选中该栏
}
itemSelect(eventKey, true) // 选中该栏
} else {
this.checkedAccount = selected ? '' : eventKey
// 将所有右侧的穿梭状态重置
this.accountTreeData.forEach(account => {
// 将所有右侧的穿梭状态重置
account.children.forEach(child => {
itemSelect(child.key, false)
})
})
}
},
@ -606,9 +597,10 @@ export default {
}
})
findAccount.children.push(...children)
this.rightAccountChildExpandedKeys = [findAccount.key]
this.rightAccountChildExpandedKeys = [findAccount.key] // 展开右侧树
}
} else {
// 移除右侧穿梭框内容
const moveKey = moveKeys[0]
let parentIndex = -1,
childIndex = -1
@ -623,7 +615,6 @@ export default {
}
}
this.accountTreeData[parentIndex].children.splice(childIndex, 1)
console.log('%c [ childIndex ]-591', 'font-size:13px; background:pink; color:#bf2c9f;', childIndex)
}
this.targetKeys = targetKeys
}
@ -649,7 +640,6 @@ export default {
&-list {
flex-shrink: 0;
width: 350px;
height: calc(100% - 2px);
background-color: #022024;
border-color: rgb(12, 106, 102, 0.9);
border-radius: 0;
@ -806,7 +796,6 @@ export default {
&-calendar {
height: 100%;
margin-left: 20px;
padding-right: 10px;
.ant-fullcalendar-fullscreen {
height: 100%;
overflow: auto;
@ -818,10 +807,15 @@ export default {
padding-right: 5px;
}
.ant-fullcalendar-date {
height: 127px !important;
height: calc((100vh - 315px) / 6) !important;
padding: 10px !important;
}
.ant-fullcalendar-content {
height: 60px !important;
height: calc(100% - 28px) !important;
margin-top: 5px;
}
.ant-fullcalendar-value {
font-size: 20px;
}
}
}

4
src/views/system/modules/DepartAuthModal.vue
View File

@ -43,9 +43,9 @@
</div>
</template>
<a-card v-else :bordered="false" style="height:200px">
<a-empty>
<custom-empty>
<span slot="description"> 请先选择一个部门! </span>
</a-empty>
</custom-empty>
</a-card>
<depart-datarule-modal ref="datarule"/>
</a-card>