Skip to content

GitLab

S
Starter Web Vue
Commit a3bf1b58 authored by 水落(YangLei)'s avatar 水落(YangLei)
Browse files
Options

feat: 任务中心完成

parent 3068d45c
Hide whitespace changes
Inline Side-by-side
Showing with 289 additions and 32 deletions
src/components/MySelect/search_select.vue
View file @ a3bf1b58
<template>
<a-select
show-search
class="tw-w-full"
placeholder="input search text"
:default-active-first-option="false"
:show-arrow="false"
......
src/components/table/more_item.vue 0 → 100644
View file @ a3bf1b58
<template>
<div>
<label>{{ label }}</label>
<slot />
</div>
</template>
<script>
export default {
props: {
label: String,
},
};
</script>
src/components/table/table.vue
View file @ a3bf1b58
<template>
<div>
<my-card v-if="$scopedSlots.search" class="tw-mb-2.5">
<a-form-model :model="queryForm" layout="horizontal">
<a-row :gutter="16">
<slot name="search" :query="queryForm" />
</a-row>
<a-form-model :model="queryForm" layout="inline">
<slot name="search" :query="queryForm" />
</a-form-model>
<div class="tw-text-right tw-mt-2">
<a-space>
<a-popover v-if="$scopedSlots.moreSearch" trigger="click">
<template slot="content">
<div :class="$style.moreSearch">
<slot name="moreSearch" :query="queryForm" />
</div>
</template>
<a-button>更多查询</a-button>
</a-popover>
<a-button @click="reset">重置</a-button>
<a-button type="primary" @click="getData">查询</a-button>
</a-space>
......@@ -27,15 +33,20 @@
:data-source="data"
:loading="loading"
v-bind="$attrs"
:scroll="scroll"
:rowKey="rowKey"
:pagination="pagination"
@change="pageChange"
:row-selection="selected ? rowSelection : undefined"
>
<slot />
<a-table-column title="操作" v-if="buttons">
<a-table-column
:title="newButtons.title"
v-if="this.newButtons"
v-bind="this.newButtons.options"
>
<template #default="row">
<my-ac-btn :row="row" :buttons="buttons" />
<my-ac-btn :row="row" :buttons="newButtons.data" />
</template>
</a-table-column>
</a-table>
......@@ -52,6 +63,7 @@
@close="hidden"
:maskClosable="false"
:title="title"
:afterVisibleChange="afterVisibleChange"
>
<slot name="drawer" :hidden="hidden" :refresh="getData" :type="type" :row="row" />
</a-drawer>
......@@ -74,7 +86,7 @@ export default {
props: {
url: String,
addBtn: [Object, Boolean],
buttons: Array,
buttons: [Array, Object],
noPage: Boolean,
formatData: Function,
rowKey: [String, Function],
......@@ -84,6 +96,7 @@ export default {
default: 600,
},
noPadding: Boolean,
scroll: Object,
},
data() {
......@@ -107,7 +120,7 @@ export default {
flex: 1,
overflow: 'hidden',
},
type: 'add',
type: null,
row: null,
};
},
......@@ -120,6 +133,13 @@ export default {
newBtn() {
return this.addBtn ? (typeof this.addBtn === 'object' ? this.addBtn : {}) : this.addBtn;
},
newButtons() {
return this.buttons
? Array.isArray(this.buttons)
? { data: this.buttons, title: '操作' }
: this.buttons
: null;
},
pagination() {
return this.noPage
? false
......@@ -170,9 +190,13 @@ export default {
hidden() {
this.visible = false;
this.title = this.addBtn?.title ?? defaultTitle;
this.type = 'add';
this.row = null;
},
afterVisibleChange(visible) {
if (!visible) {
this.title = this.addBtn?.title ?? defaultTitle;
this.type = null;
this.row = null;
}
},
show(params) {
......@@ -189,8 +213,35 @@ export default {
addBtnClick() {
const { click } = typeof this.addBtn === 'object' ? this.addBtn : {};
click && click();
this.type = 'add';
this.visible = true;
},
},
};
</script>
<style module lang="less">
.moreSearch {
display: flex;
flex-direction: column;
width: 400px;
padding: 15px 0 0 0;
> div {
display: flex;
align-items: center;
@apply tw-mb-3;
> label {
color: rgba(0, 0, 0, 0.85);
width: 6em;
text-align: right;
margin-right: 1em;
&::after {
content: ':';
}
}
}
}
</style>
src/pages/xunjian/task_managment/center/detail.vue 0 → 100644
View file @ a3bf1b58
<template>
<Wraper :hidden="hidden" noFooter>
<Table :url="tableUrl" rowKey="taskId" noPadding :buttons="buttons" :scroll="scroll">
<template #search="{ query }">
<a-form-model-item label="开始时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.startTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</a-form-model-item>
<a-form-model-item label="结束时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.endTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</a-form-model-item>
</template>
<template #moreSearch="{ query }">
<MoreItem label="开始时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.startTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</MoreItem>
<MoreItem label="结束时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.endTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</MoreItem>
<MoreItem label="地点">
<UrlSelect
v-model="query.placeId"
:url="`/ranger/inspection/api/v1/place/regions/${row.regionId}/list`"
labelFiled="placeName"
valueFiled="placeId"
/>
</MoreItem>
<MoreItem label="单元">
<UrlSelect
v-model="query.unitId"
:url="
query.placeId
? `/ranger/inspection/api/v1/units/places/${query.placeId}/list`
: ''
"
labelFiled="unitName"
valueFiled="unitId"
/>
</MoreItem>
<MoreItem label="项目">
<UrlSelect
v-model="query.itemId"
:url="
query.unitId ? `/ranger/inspection/api/v1/items/units/${query.unitId}/list` : ''
"
labelFiled="itemName"
valueFiled="itemId"
/>
</MoreItem>
<MoreItem label="巡检状态">
<UrlSelect
v-model="query.inspectionState"
:url="zhuangTaiUrl"
labelFiled="paramName"
valueFiled="paramValue"
/>
</MoreItem>
<MoreItem label="巡查结果">
<UrlSelect
:url="xunChaJieGuoUrl"
v-model="query.inspectionResultName"
labelFiled="paramName"
valueFiled="paramValue"
/>
</MoreItem>
<MoreItem label="巡检人">
<SearchSelect
url="/api/v1/users/searching"
searchField="userName"
v-model="query.lastInspectionStaffId"
labelFiled="userName"
valueFiled="userId"
/>
</MoreItem>
</template>
<a-table-column title="巡检项目" data-index="taskName" />
<a-table-column title="参考值" data-index="referenceValue" width="150px" />
<a-table-column title="采集数据" data-index="value" width="150px" />
<a-table-column title="巡查结果" data-index="inspectionResultName" width="100px" />
<a-table-column title="巡查时间" data-index="inspectionTime" width="200px" />
<a-table-column title="巡检人" data-index="inspectionStaffName" width="100px" />
<a-table-column title="状态" data-index="inspectionStateName" width="100px" />
</Table>
</Wraper>
</template>
<script>
import Table from '@/components/table/table.vue';
import Wraper from '@/components/table/wraper.vue';
import UrlSelect from '@/components/MySelect/url_select.vue';
import SearchSelect from '@/components/MySelect/search_select.vue';
import langUtils from '@/utils/langUtils';
import MoreItem from '@/components/table/more_item.vue';
export default {
props: { hidden: Function, row: Object },
components: { Table, Wraper, SearchSelect, UrlSelect, MoreItem },
data() {
return {
scroll: { x: 1200 },
buttons: {
title: '备注 & 附件',
options: {
fixed: 'right',
width: 150,
},
data: [
{
label: '查看',
click: this.viewDetail,
},
],
},
};
},
computed: {
tableUrl() {
return `/ranger/inspection/api/v1/jobs/tasks?jobId=${this.row.jobId}`;
},
xunChaJieGuoUrl() {
return `/api/v1/parameters/business/list?paramModule=rpis_task&paramCode=inspection_result&paramLocale=${langUtils.get()}`;
},
zhuangTaiUrl() {
return `/api/v1/parameters/business/list?paramModule=rpis_route_schedule&paramCode=inspection_state&paramLocale=${langUtils.get()}`;
},
},
methods: {
viewDetail(row) {
console.log(row);
},
},
};
</script>
src/pages/xunjian/task_managment/center/index.vue
View file @ a3bf1b58
......@@ -9,31 +9,59 @@
:drawerWidth="800"
>
<template #search="{ query }">
<my-form-item label="开始时间">
<a-form-model-item label="开始时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.startTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</my-form-item>
<my-form-item label="结束时间">
</a-form-model-item>
<a-form-model-item label="结束时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.endTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</my-form-item>
<my-form-item label="地区">
</a-form-model-item>
<a-form-model-item label="地区">
<RequestSelect
style="width: 220px"
:request="getAreaListDataApi"
v-model="query.regionId"
labelFiled="regionName"
valueFiled="regionId"
/>
</my-form-item>
<my-form-item label="专业">
</a-form-model-item>
</template>
<template #moreSearch="{ query }">
<MoreItem label="开始时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.startTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</MoreItem>
<MoreItem label="结束时间">
<a-date-picker
class="tw-w-full"
show-time
v-model="query.endTime"
valueFormat="YYYY-MM-DD HH:mm:ss"
/>
</MoreItem>
<MoreItem label="地区">
<RequestSelect
:request="getAreaListDataApi"
v-model="query.regionId"
labelFiled="regionName"
valueFiled="regionId"
/>
</MoreItem>
<MoreItem label="专业">
<UrlSelect
:url="
query.regionId
......@@ -44,8 +72,8 @@
labelFiled="specialityName"
valueFiled="specialityId"
/>
</my-form-item>
<my-form-item label="线路">
</MoreItem>
<MoreItem label="线路">
<UrlSelect
:url="
query.regionId
......@@ -56,32 +84,32 @@
valueFiled="routeId"
v-model="query.routeId"
/>
</my-form-item>
<my-form-item label="班组">
</MoreItem>
<MoreItem label="班组">
<RequestSelect
:request="getBanZuListApi"
v-model="query.shiftType"
labelFiled="paramName"
valueFiled="paramValue"
/>
</my-form-item>
<my-form-item label="巡检状态">
</MoreItem>
<MoreItem label="巡检状态">
<RequestSelect
:request="getBusinessListApi"
v-model="query.inspectionState"
labelFiled="paramName"
valueFiled="paramValue"
/>
</my-form-item>
<my-form-item label="任务类型">
</MoreItem>
<MoreItem label="任务类型">
<RequestSelect
:request="getTaskTypeApi"
v-model="query.jobType"
labelFiled="paramName"
valueFiled="paramValue"
/>
</my-form-item>
<my-form-item label="巡检人">
</MoreItem>
<MoreItem label="巡检人">
<SearchSelect
url="/api/v1/users/searching"
searchField="userName"
......@@ -89,7 +117,7 @@
labelFiled="userName"
valueFiled="userId"
/>
</my-form-item>
</MoreItem>
</template>
<template #operation>
......@@ -99,6 +127,7 @@
<template #drawer="{ hidden, refresh, type, row }">
<Form :hidden="hidden" :refresh="refresh" v-if="type === 'add'" />
<Progress v-if="type === 'progress'" :hidden="hidden" :row="row" />
<Detail v-if="type === 'detail'" :hidden="hidden" :row="row" />
</template>
<a-table-column title="线路名称" data-index="routeName" />
......@@ -124,9 +153,11 @@ import RequestSelect from '@/components/MySelect/RequestSelect.vue';
import SearchSelect from '@/components/MySelect/search_select.vue';
import { getAreaListDataApi, getBusinessListApi, getBanZuListApi, getTaskTypeApi } from '@/api';
import Progress from './progress.vue';
import Detail from './detail.vue';
import MoreItem from '@/components/table/more_item.vue';
export default {
components: { Table, Form, RequestSelect, UrlSelect, SearchSelect, Progress },
components: { Table, Form, RequestSelect, UrlSelect, SearchSelect, Progress, Detail, MoreItem },
data() {
return {
getAreaListDataApi,
......@@ -139,6 +170,7 @@ export default {
buttons: [
{
label: '详情',
click: this.viewDetail,
},
{ label: '进度', click: this.viewProgress },
{
......@@ -162,6 +194,9 @@ export default {
viewProgress(row) {
this.$refs.table.show({ title: '任务进度', type: 'progress', row });
},
viewDetail(row) {
this.$refs.table.show({ title: '任务明细', type: 'detail', row });
},
},
};
</script>
src/pages/xunjian/task_managment/center/progress.vue
View file @ a3bf1b58
......@@ -37,8 +37,6 @@
</Wraper>
</template>
unitNum, itemNum, abnormalNum, placeNum, finishedPercent: formatFloat((finishedNum / unitNum * 100), 2),
<script>
import Wraper from '@/components/table/wraper.vue';
import Table from '@/components/table/table.vue';
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment