Browse Source

新增刷新按钮和提交loding

wangqin
zhoule 10 months ago
parent
commit
52aef06712
  1. 22
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/images/refresh.svg
  2. 27
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue
  3. 22
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/emergencyProcessManagement/images/refresh.svg
  4. 28
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/emergencyProcessManagement/index.vue
  5. 15
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/index.vue

22
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/images/refresh.svg

@ -0,0 +1,22 @@
<svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Group 1142814398">
<g id="Group 1142814396">
<path id="Rectangle 1304" d="M1.0437 2.41495L4.5636 2.01738L4.91112 6.00562" stroke="white" stroke-linecap="round"/>
<g id="Ellipse 835">
<mask id="path-2-inside-1_290_77" fill="white">
<path d="M4.29579 2.52494C4.09359 2.27296 3.71712 2.25216 3.51748 2.50144C2.86315 3.31847 2.39514 4.30903 2.15904 5.38649C1.87758 6.67096 1.93836 8.02122 2.3337 9.26652C2.72904 10.5118 3.44118 11.5962 4.38007 12.3826C5.16561 13.0406 6.08036 13.4652 7.0411 13.6229C7.35243 13.674 7.61901 13.4293 7.63212 13.1145C7.64523 12.7997 7.39954 12.5346 7.08935 12.4765C6.32757 12.3339 5.60349 11.9884 4.97813 11.4646C4.19938 10.8124 3.6087 9.91289 3.28078 8.87998C2.95287 7.84706 2.90245 6.72709 3.13591 5.66169C3.33404 4.75752 3.72906 3.92712 4.28182 3.24492C4.4503 3.03698 4.46523 2.7361 4.29579 2.52494Z"/>
</mask>
<path d="M4.29579 2.52494C4.09359 2.27296 3.71712 2.25216 3.51748 2.50144C2.86315 3.31847 2.39514 4.30903 2.15904 5.38649C1.87758 6.67096 1.93836 8.02122 2.3337 9.26652C2.72904 10.5118 3.44118 11.5962 4.38007 12.3826C5.16561 13.0406 6.08036 13.4652 7.0411 13.6229C7.35243 13.674 7.61901 13.4293 7.63212 13.1145C7.64523 12.7997 7.39954 12.5346 7.08935 12.4765C6.32757 12.3339 5.60349 11.9884 4.97813 11.4646C4.19938 10.8124 3.6087 9.91289 3.28078 8.87998C2.95287 7.84706 2.90245 6.72709 3.13591 5.66169C3.33404 4.75752 3.72906 3.92712 4.28182 3.24492C4.4503 3.03698 4.46523 2.7361 4.29579 2.52494Z" stroke="white" stroke-width="2" mask="url(#path-2-inside-1_290_77)"/>
</g>
</g>
<g id="Group 1142814397">
<path id="Rectangle 1304_2" d="M15.0437 11.585L11.5238 11.9826L11.1763 7.99438" stroke="white" stroke-linecap="round"/>
<g id="Ellipse 835_2">
<mask id="path-4-inside-2_290_77" fill="white">
<path d="M11.7916 11.4751C11.9938 11.727 12.3703 11.7478 12.5699 11.4986C13.2242 10.6815 13.6923 9.69097 13.9284 8.61351C14.2098 7.32904 14.149 5.97878 13.7537 4.73348C13.3584 3.48817 12.6462 2.40376 11.7073 1.61737C10.9218 0.95942 10.007 0.534814 9.0463 0.377109C8.73497 0.326006 8.46839 0.570722 8.45528 0.885536C8.44218 1.20035 8.68786 1.46544 8.99805 1.5235C9.75983 1.6661 10.4839 2.01159 11.1093 2.53538C11.888 3.18765 12.4787 4.08711 12.8066 5.12002C13.1345 6.15294 13.1849 7.27291 12.9515 8.33831C12.7534 9.24248 12.3583 10.0729 11.8056 10.7551C11.6371 10.963 11.6222 11.2639 11.7916 11.4751Z"/>
</mask>
<path d="M11.7916 11.4751C11.9938 11.727 12.3703 11.7478 12.5699 11.4986C13.2242 10.6815 13.6923 9.69097 13.9284 8.61351C14.2098 7.32904 14.149 5.97878 13.7537 4.73348C13.3584 3.48817 12.6462 2.40376 11.7073 1.61737C10.9218 0.95942 10.007 0.534814 9.0463 0.377109C8.73497 0.326006 8.46839 0.570722 8.45528 0.885536C8.44218 1.20035 8.68786 1.46544 8.99805 1.5235C9.75983 1.6661 10.4839 2.01159 11.1093 2.53538C11.888 3.18765 12.4787 4.08711 12.8066 5.12002C13.1345 6.15294 13.1849 7.27291 12.9515 8.33831C12.7534 9.24248 12.3583 10.0729 11.8056 10.7551C11.6371 10.963 11.6222 11.2639 11.7916 11.4751Z" stroke="white" stroke-width="2" mask="url(#path-4-inside-2_290_77)"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

27
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/dispatch/index.vue

@ -2,6 +2,13 @@
<div class='RoadNetworkMonitoring'>
<!-- 搜索栏 -->
<div class="filter">
<ButtonGradient @click="onRefresh" class="refresh-btn">
<template #prefix>
<img src="./images/refresh.svg" />
</template>
刷新
</ButtonGradient>
<InputSearch style="width: 402px;" :formList="searchFormList" :formConfigOptions="{ dFormData: { eventState: 0 } }"
@handleSearch="handleSearch" />
</div>
@ -26,6 +33,7 @@
</template>
<script>
import ButtonGradient from "@screen/components/Buttons/ButtonGradient.vue";
import Pagination from '@screen/components/Pagination.vue';
import InputSearch from '@screen/components/InputSearch/index.vue';
import RoadStateCard from '@screen/components/RoadStateCard/index.vue';
@ -42,7 +50,8 @@ export default {
InputSearch,
EventDispatchDialog,
EventDetailDialog,
Pagination
Pagination,
ButtonGradient
},
data() {
return {
@ -52,7 +61,7 @@ export default {
detailDialogFormData: {},
total: 0,
data: [],
eventId: 0,
eventId: '0',
searchData: {
pageSize: 16,
pageNum: 1,
@ -78,7 +87,7 @@ export default {
},
onSizeChange(pageSize) {
this.searchData.pageSize = pageSize;
this.getData();
this.initData();
},
getStateCardBind(item) {
const { state, textColor, text } = tabMap[this.activeName];
@ -89,6 +98,12 @@ export default {
lastBtnText: text,
};
},
onRefresh() {
this.data = [];
setTimeout(() => {
this.initData();
}, 100);
},
firstBtnClick(id) {
console.log("id", id);
request({
@ -148,7 +163,11 @@ export default {
.filter {
height: 38px;
display: flex;
justify-content: flex-end;
// justify-content: flex-end;
justify-content: space-between;
.refresh-btn {
}
}
.body {

22
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/emergencyProcessManagement/images/refresh.svg

@ -0,0 +1,22 @@
<svg width="16" height="14" viewBox="0 0 16 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<g id="Group 1142814398">
<g id="Group 1142814396">
<path id="Rectangle 1304" d="M1.0437 2.41495L4.5636 2.01738L4.91112 6.00562" stroke="white" stroke-linecap="round"/>
<g id="Ellipse 835">
<mask id="path-2-inside-1_290_77" fill="white">
<path d="M4.29579 2.52494C4.09359 2.27296 3.71712 2.25216 3.51748 2.50144C2.86315 3.31847 2.39514 4.30903 2.15904 5.38649C1.87758 6.67096 1.93836 8.02122 2.3337 9.26652C2.72904 10.5118 3.44118 11.5962 4.38007 12.3826C5.16561 13.0406 6.08036 13.4652 7.0411 13.6229C7.35243 13.674 7.61901 13.4293 7.63212 13.1145C7.64523 12.7997 7.39954 12.5346 7.08935 12.4765C6.32757 12.3339 5.60349 11.9884 4.97813 11.4646C4.19938 10.8124 3.6087 9.91289 3.28078 8.87998C2.95287 7.84706 2.90245 6.72709 3.13591 5.66169C3.33404 4.75752 3.72906 3.92712 4.28182 3.24492C4.4503 3.03698 4.46523 2.7361 4.29579 2.52494Z"/>
</mask>
<path d="M4.29579 2.52494C4.09359 2.27296 3.71712 2.25216 3.51748 2.50144C2.86315 3.31847 2.39514 4.30903 2.15904 5.38649C1.87758 6.67096 1.93836 8.02122 2.3337 9.26652C2.72904 10.5118 3.44118 11.5962 4.38007 12.3826C5.16561 13.0406 6.08036 13.4652 7.0411 13.6229C7.35243 13.674 7.61901 13.4293 7.63212 13.1145C7.64523 12.7997 7.39954 12.5346 7.08935 12.4765C6.32757 12.3339 5.60349 11.9884 4.97813 11.4646C4.19938 10.8124 3.6087 9.91289 3.28078 8.87998C2.95287 7.84706 2.90245 6.72709 3.13591 5.66169C3.33404 4.75752 3.72906 3.92712 4.28182 3.24492C4.4503 3.03698 4.46523 2.7361 4.29579 2.52494Z" stroke="white" stroke-width="2" mask="url(#path-2-inside-1_290_77)"/>
</g>
</g>
<g id="Group 1142814397">
<path id="Rectangle 1304_2" d="M15.0437 11.585L11.5238 11.9826L11.1763 7.99438" stroke="white" stroke-linecap="round"/>
<g id="Ellipse 835_2">
<mask id="path-4-inside-2_290_77" fill="white">
<path d="M11.7916 11.4751C11.9938 11.727 12.3703 11.7478 12.5699 11.4986C13.2242 10.6815 13.6923 9.69097 13.9284 8.61351C14.2098 7.32904 14.149 5.97878 13.7537 4.73348C13.3584 3.48817 12.6462 2.40376 11.7073 1.61737C10.9218 0.95942 10.007 0.534814 9.0463 0.377109C8.73497 0.326006 8.46839 0.570722 8.45528 0.885536C8.44218 1.20035 8.68786 1.46544 8.99805 1.5235C9.75983 1.6661 10.4839 2.01159 11.1093 2.53538C11.888 3.18765 12.4787 4.08711 12.8066 5.12002C13.1345 6.15294 13.1849 7.27291 12.9515 8.33831C12.7534 9.24248 12.3583 10.0729 11.8056 10.7551C11.6371 10.963 11.6222 11.2639 11.7916 11.4751Z"/>
</mask>
<path d="M11.7916 11.4751C11.9938 11.727 12.3703 11.7478 12.5699 11.4986C13.2242 10.6815 13.6923 9.69097 13.9284 8.61351C14.2098 7.32904 14.149 5.97878 13.7537 4.73348C13.3584 3.48817 12.6462 2.40376 11.7073 1.61737C10.9218 0.95942 10.007 0.534814 9.0463 0.377109C8.73497 0.326006 8.46839 0.570722 8.45528 0.885536C8.44218 1.20035 8.68786 1.46544 8.99805 1.5235C9.75983 1.6661 10.4839 2.01159 11.1093 2.53538C11.888 3.18765 12.4787 4.08711 12.8066 5.12002C13.1345 6.15294 13.1849 7.27291 12.9515 8.33831C12.7534 9.24248 12.3583 10.0729 11.8056 10.7551C11.6371 10.963 11.6222 11.2639 11.7916 11.4751Z" stroke="white" stroke-width="2" mask="url(#path-4-inside-2_290_77)"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

28
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/emergencyProcessManagement/index.vue

@ -2,17 +2,23 @@
<div class='emergencyProcessManagement'>
<!-- 搜索栏 -->
<!-- <div class="filter">
<div class="filter">
<div>
<ButtonGradient>
<ButtonGradient @click="onRefresh" class="refresh-btn">
<template #prefix>
<img src="./images/refresh.svg" />
</template>
刷新
</ButtonGradient>
<!-- <ButtonGradient>
<template #prefix>
<img src="@screen/images/insert.svg" />
</template>
新增
</ButtonGradient>
</ButtonGradient> -->
</div>
</div> -->
</div>
<!-- 内容 -->
<div class="body">
@ -30,9 +36,11 @@
</div>
<!-- 配置常用户弹窗 -->
<CommonPhrases :visible="isShowPhrases" :eventType="eventType" @update:value="onClosePhrases" @update:phrasesData="onUpdatePhrasesData"/>
<CommonPhrases :visible="isShowPhrases" :eventType="eventType" @update:value="onClosePhrases"
@update:phrasesData="onUpdatePhrasesData" />
<!-- "流程配置"弹出框 -->
<DisposalProcess :visible="isShowDisposal" :eventType="eventType" :phrasesData="phrasesData" @update:value="onCloseDisposal" @reInitData="initData"/>
<DisposalProcess :visible="isShowDisposal" :eventType="eventType" :phrasesData="phrasesData"
@update:value="onCloseDisposal" @reInitData="initData" />
<!-- 分页 -->
@ -92,6 +100,12 @@ export default {
this.total = result.total;
});
},
onRefresh() {
this.tableData = [];
setTimeout(() => {
this.initData();
}, 100);
},
onSizeChange(pageSize) {
this.searchData.pageSize = pageSize;
this.getData();
@ -110,7 +124,7 @@ export default {
onCloseDisposal() {
this.isShowDisposal = false;
},
onUpdatePhrasesData(phrasesData){
onUpdatePhrasesData(phrasesData) {
this.phrasesData = phrasesData;
}
}

15
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/FormEvent/index.vue

@ -10,8 +10,9 @@
</Transition>
<div class="footer">
<Button style="padding:0 24px;" @click.native="handleSubmit">保存</Button>
<Button style="background: #C9C9C9;padding:0 24px;" @click.native="modelVisible = false">取消</Button>
<Button style="padding:0 24px;" @click.native="handleSubmit" :loading="submitting">保存</Button>
<Button style="background: #C9C9C9;padding:0 24px;"
@click.native="modelVisible = false, submitting = false">取消</Button>
</div>
</div>
</Dialog>
@ -43,6 +44,7 @@ export default {
data() {
return {
activeName: "TrafficAccident",
submitting: false,
formConfig: {},
tabConfigList,
index: 1,
@ -144,11 +146,12 @@ export default {
handleSubmit() {
// return
this.$refs.FormConfigRef.validate().then((formData) => {
if(this.index == 0) {
this.submitting = true;
if (this.index == 0) {
formData.dcEventAccident.laneOccupancy = formData.dcEventAccident.laneOccupancy.join(',')
}
if(this.index == 1){
if (this.index == 1) {
formData.dcEventVehicleAccident.laneOccupancy = formData.dcEventVehicleAccident.laneOccupancy.join(',')
}
// console.log('formData',formData)
@ -172,6 +175,8 @@ export default {
})
.catch(() => {
Message.error("提交失败");
}).finally(() => {
this.submitting = false;
})
})

Loading…
Cancel
Save