|
|
|
@ -14,7 +14,7 @@ |
|
|
|
</template> |
|
|
|
导出 |
|
|
|
</ButtonGradient> |
|
|
|
<ButtonGradient> |
|
|
|
<ButtonGradient @click.native="getData"> |
|
|
|
<template #prefix> |
|
|
|
<img src="@screen/images/refresh.svg" /> |
|
|
|
</template> |
|
|
|
@ -22,24 +22,30 @@ |
|
|
|
</ButtonGradient> |
|
|
|
</div> |
|
|
|
|
|
|
|
<InputSearch style="width: 402px;" /> |
|
|
|
<InputSearch style="width: 402px;" :formList="searchFormList" :formConfigOptions="{ labelWidth: '72px' }" |
|
|
|
@handleSearch="handleSearch" /> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<div class="body"> |
|
|
|
|
|
|
|
<ElEmpty v-if="!data.length" description="暂无数据" style="width: 100%;height: 100%;position: absolute;" /> |
|
|
|
|
|
|
|
<template v-else> |
|
|
|
<Card v-for="(item, index) in data" :buttonIcon="null" :keyMap="keyMap" :cardData="item" :key="index" |
|
|
|
buttonText="详情"> |
|
|
|
<template #form-location="{ data }"> |
|
|
|
<div class="endSpecial"> |
|
|
|
<span> |
|
|
|
起: {{ data.location }} |
|
|
|
起: {{ data.startStakeMark }} |
|
|
|
</span> |
|
|
|
<span> |
|
|
|
止: {{ data.location }} |
|
|
|
止: {{ data.endStakeMark }} |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</Card> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
<EditEventInformationDialog v-model="editEventInformationDialogVisible" /> |
|
|
|
</div> |
|
|
|
@ -51,6 +57,11 @@ import EditEventInformationDialog from "./components/EditEventInformationDialog/ |
|
|
|
import InputSearch from '@screen/components/InputSearch/index.vue'; |
|
|
|
import ButtonGradient from '@screen/components/Buttons/ButtonGradient.vue'; |
|
|
|
|
|
|
|
import { searchFormList } from "./data"; |
|
|
|
import request from "@/utils/request"; |
|
|
|
import { setLoading } from "@screen/utils/index.js" |
|
|
|
import { delay } from "@screen/utils/common"; |
|
|
|
|
|
|
|
export default { |
|
|
|
name: 'JurisdictionalManagement', |
|
|
|
components: { |
|
|
|
@ -59,11 +70,12 @@ export default { |
|
|
|
ButtonGradient, |
|
|
|
InputSearch |
|
|
|
}, |
|
|
|
inject: ['getPagination', 'setTotal'], |
|
|
|
data() { |
|
|
|
return { |
|
|
|
keyMap: [ |
|
|
|
{ |
|
|
|
key: "source", |
|
|
|
key: "sectionName", |
|
|
|
label: "路段名称" |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -71,28 +83,94 @@ export default { |
|
|
|
label: "路段桩号" |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: "time", |
|
|
|
key: "createTime", |
|
|
|
label: "采集时间" |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: "km", |
|
|
|
key: "mileage", |
|
|
|
label: "路段里程" |
|
|
|
} |
|
|
|
], |
|
|
|
data: Array.from({ length: 20 }).map(() => ({ |
|
|
|
time: "2023.12.22 13:00:00", |
|
|
|
source: "视频智能识别", |
|
|
|
location: "k100+000", |
|
|
|
km: "13.588km", |
|
|
|
direction2: "37.12234", |
|
|
|
state: (() => { |
|
|
|
const min = 1; |
|
|
|
const max = 5; |
|
|
|
return Math.floor(Math.random() * (max - min + 1)) + min; |
|
|
|
})() |
|
|
|
})), |
|
|
|
// data: Array.from({ length: 20 }).map(() => ({ |
|
|
|
// time: "2023.12.22 13:00:00", |
|
|
|
// source: "视频智能识别", |
|
|
|
// location: "k100+000", |
|
|
|
// km: "13.588km", |
|
|
|
// direction2: "37.12234", |
|
|
|
// state: (() => { |
|
|
|
// const min = 1; |
|
|
|
// const max = 5; |
|
|
|
// return Math.floor(Math.random() * (max - min + 1)) + min; |
|
|
|
// })() |
|
|
|
// })), |
|
|
|
data: [], |
|
|
|
editEventInformationDialogVisible: false |
|
|
|
} |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.getData(); |
|
|
|
// this.getSearchOptions(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getSearchOptions() { |
|
|
|
Promise.allSettled([ |
|
|
|
// 岗位 |
|
|
|
request({ |
|
|
|
url: `/business/employees/sysPost`, |
|
|
|
method: "post", |
|
|
|
data: {} |
|
|
|
}), |
|
|
|
|
|
|
|
// 机构 |
|
|
|
request({ |
|
|
|
url: `/business/employees/organization`, |
|
|
|
method: "post", |
|
|
|
data: {} |
|
|
|
}) |
|
|
|
]) |
|
|
|
.then(([post, organization]) => { |
|
|
|
if (post.status === 'fulfilled' && post.value.code == 200) { |
|
|
|
this.searchFormList[0].options.options = post.value.data.map(item => ({ |
|
|
|
key: item.postId, |
|
|
|
label: item.postName, |
|
|
|
})) |
|
|
|
} |
|
|
|
|
|
|
|
if (organization.status === 'fulfilled' && organization.value.code == 200) { |
|
|
|
this.searchFormList[1].options.options = organization.value.data.map(item => ({ |
|
|
|
key: item.id, |
|
|
|
label: item.organizationName, |
|
|
|
})) |
|
|
|
} |
|
|
|
|
|
|
|
console.log(this.searchFormList) |
|
|
|
|
|
|
|
}) |
|
|
|
}, |
|
|
|
handleSearch(data) { |
|
|
|
this.searchData = data; |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
async getData() { |
|
|
|
const closeLoading = setLoading(); |
|
|
|
|
|
|
|
await delay(150); |
|
|
|
|
|
|
|
request({ |
|
|
|
url: `/business/roadSection/list`, |
|
|
|
method: "get", |
|
|
|
params: { |
|
|
|
...this.searchData, |
|
|
|
...this.getPagination() |
|
|
|
} |
|
|
|
}).then(result => { |
|
|
|
if (result.code != 200) return; |
|
|
|
this.data = result.rows; |
|
|
|
this.total = result.total; |
|
|
|
}).finally(() => { |
|
|
|
closeLoading(); |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
|
Joe
1 year ago