main
parent
1cf7f614d5
commit
74de427762
@ -0,0 +1,266 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="cardTitle">
|
||||||
|
<a-space size="large">
|
||||||
|
<span>工单管理</span>
|
||||||
|
<a-radio-group v-model='activeName' button-style="solid" @change="tabsChange">
|
||||||
|
<a-radio-button value="0">
|
||||||
|
全部
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="1">
|
||||||
|
待分配
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="2">
|
||||||
|
工单池
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="3">
|
||||||
|
已接单
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="4">
|
||||||
|
处理中
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="5">
|
||||||
|
已完成
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="6">
|
||||||
|
已评价
|
||||||
|
</a-radio-button>
|
||||||
|
<a-radio-button value="7">
|
||||||
|
已拒绝
|
||||||
|
</a-radio-button>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-space>
|
||||||
|
</div>
|
||||||
|
<div class="search-box">
|
||||||
|
<a-row>
|
||||||
|
<a-col :span="20">
|
||||||
|
<a-space size="large">
|
||||||
|
<a-select placeholder="请选择" style="width:200px"/>
|
||||||
|
<a-button type="primary">查 询</a-button>
|
||||||
|
<a-button>重 置</a-button>
|
||||||
|
</a-space>
|
||||||
|
</a-col>
|
||||||
|
<a-col :span="4">
|
||||||
|
<a-button class='add-btn'>添加工单</a-button>
|
||||||
|
</a-col>
|
||||||
|
</a-row>
|
||||||
|
</div>
|
||||||
|
<div class="main">
|
||||||
|
<div style="margin-bottom: 16px">
|
||||||
|
<!-- 批量操作 -->
|
||||||
|
<a-select
|
||||||
|
type="primary"
|
||||||
|
v-model="activeAction"
|
||||||
|
:disabled="!hasSelected"
|
||||||
|
:loading="loading"
|
||||||
|
style="width: 120px"
|
||||||
|
@change="Actions"
|
||||||
|
placeholder="请选择操作"
|
||||||
|
>
|
||||||
|
批量
|
||||||
|
<a-select-option v-for="item in ActionsList" :key="item.value">
|
||||||
|
{{ item.label }}
|
||||||
|
</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
<span style="margin-left: 8px">
|
||||||
|
<template v-if="hasSelected">
|
||||||
|
{{ `已选择 ${selectedRowKeys.length} 条` }}
|
||||||
|
</template>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<a-table
|
||||||
|
:columns="columns"
|
||||||
|
:data-source="tableData"
|
||||||
|
:pagination="pagination"
|
||||||
|
:scroll="{ x: 1300 }"
|
||||||
|
:row-selection="{
|
||||||
|
selectedRowKeys: selectedRowKeys,
|
||||||
|
onChange: selectionChoosed,
|
||||||
|
}"
|
||||||
|
:row-key="
|
||||||
|
(record, index) => {
|
||||||
|
return index;
|
||||||
|
}
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<span slot="name" slot-scope="text, row">
|
||||||
|
{{
|
||||||
|
row.manageBuildingName +
|
||||||
|
"栋/" +
|
||||||
|
row.manageUnitName +
|
||||||
|
"单元/" +
|
||||||
|
row.floorLocation +
|
||||||
|
"层-" +
|
||||||
|
row.name +
|
||||||
|
"室"
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span slot="action" slot-scope="text, row">
|
||||||
|
<a-space>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="put(row)">下发至工单池</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="shift(row)">转移至待分配</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="assign(row)">指派</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="shiftAssign(row)">转派</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="finish(row)">完成</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="deal(row)">处理</a>
|
||||||
|
<a class="ant-dropdown-link" v-show="row.status===1" @click="refuse(row)">拒绝</a>
|
||||||
|
</a-space>
|
||||||
|
</span>
|
||||||
|
<span slot="tags" slot-scope="tag">
|
||||||
|
<a-tag
|
||||||
|
:color="tag === 1 ? 'volcano' : tag === 2 ? 'geekblue' : tag === 3 ? 'geekblue' : 'red'"
|
||||||
|
>
|
||||||
|
{{ tag === 1 ? "业主" : tag === 2 ? "业主亲属" :tag === 3 ? "租户":tag === 4 ? "租户亲属":'-' }}
|
||||||
|
</a-tag>
|
||||||
|
</span>
|
||||||
|
</a-table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
activeName:'0',
|
||||||
|
pagination: {
|
||||||
|
current: 1,
|
||||||
|
total: 0,
|
||||||
|
pageSize: 10,
|
||||||
|
showTotal: (total) => `共 ${total} 条`,
|
||||||
|
showSizeChanger: true,
|
||||||
|
showQuickJumper: true,
|
||||||
|
},
|
||||||
|
searchForm:{
|
||||||
|
status:null,
|
||||||
|
identity:null
|
||||||
|
},
|
||||||
|
activeAction: undefined,
|
||||||
|
loading: false,
|
||||||
|
// 选择的index
|
||||||
|
selectedRowKeys: [],
|
||||||
|
tableChoosed: [],
|
||||||
|
// 分页
|
||||||
|
// 列
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: "申请人身份",
|
||||||
|
key: "tags",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "status",
|
||||||
|
scopedSlots: { customRender: "tags" },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "工单号",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "code",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "申请人",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "people",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "手机号",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "tel",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "工单类型",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "type",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "工单类型",
|
||||||
|
width: "14%",
|
||||||
|
dataIndex: "content",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
dataIndex: "action",
|
||||||
|
key: "action",
|
||||||
|
width: "300",
|
||||||
|
fixed: "right",
|
||||||
|
scopedSlots: { customRender: "action" },
|
||||||
|
},
|
||||||
|
],
|
||||||
|
// 数据
|
||||||
|
tableData: [
|
||||||
|
],
|
||||||
|
ActionsList: [
|
||||||
|
{
|
||||||
|
label: "批量删除",
|
||||||
|
value: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "批量导出",
|
||||||
|
value: 2,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getData(){},
|
||||||
|
tabsChange(e){
|
||||||
|
this.searchForm.status = e.target.value
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
// 下发至工单池
|
||||||
|
put(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 转移至待分配
|
||||||
|
shift(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 指派
|
||||||
|
assign(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 转派
|
||||||
|
shiftAssign(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 完成
|
||||||
|
finish(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 处理
|
||||||
|
deal(){
|
||||||
|
|
||||||
|
},
|
||||||
|
// 拒绝
|
||||||
|
refuse(){
|
||||||
|
|
||||||
|
},
|
||||||
|
handleTableChange(pagination) {
|
||||||
|
console.log(pagination);
|
||||||
|
const pager = { ...this.pagination };
|
||||||
|
pager.current = pagination.current;
|
||||||
|
pager.pageSize = pagination.pageSize;
|
||||||
|
this.pagination = pager;
|
||||||
|
},
|
||||||
|
Actions(data) {
|
||||||
|
console.log(data);
|
||||||
|
this.activeAction = undefined;
|
||||||
|
},
|
||||||
|
selectionChoosed(data) {
|
||||||
|
console.log(data);
|
||||||
|
this.tableChoosed = data;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
// 是否选择selection
|
||||||
|
hasSelected() {
|
||||||
|
return this.selectedRowKeys.length > 0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
</style>
|
||||||
Loading…
Reference in new issue