预警
This commit is contained in:
parent
cffe8b855b
commit
1500a4a99e
@ -24,7 +24,7 @@ const config = {
|
||||
}
|
||||
|
||||
// 设置后台接口服务的基础地址
|
||||
// config.baseUrl = 'http://tc.cqsznc.com:7080/api';
|
||||
config.baseUrl = 'http://183.230.235.66:11010/api';
|
||||
config.baseUrl = 'http://tc.cqsznc.com:7080/api';
|
||||
// config.baseUrl = 'http://183.230.235.66:11010/api';
|
||||
|
||||
export default config;
|
||||
@ -20,12 +20,17 @@ const install = (Vue, vm) => {
|
||||
//新增访客
|
||||
addVisitor:(params = {})=>vm.$u.post(config.adminPath+'/property/visitorManagement',params),
|
||||
|
||||
//报事报修
|
||||
//订单报事报修
|
||||
getOrderList:(params = {})=>vm.$u.get(config.adminPath+'/property/workOrders/list',params),
|
||||
//订单类型
|
||||
getOrdersType:(params = {})=>vm.$u.get(config.adminPath+'/property/workOrdersType/list',params),
|
||||
//报事报修订单类型
|
||||
getRepairTypes:(params = {})=>vm.$u.get(config.adminPath+'/property/workOrdersType/queryList',params),
|
||||
//新增订单
|
||||
addOrder:(params = {})=>vm.$u.post(config.adminPath+'/property/workOrders',params),
|
||||
//新增报事报修
|
||||
addOrder2:(params = {})=>vm.$u.post(config.adminPath+'/property/mobile/workOrders',params),
|
||||
//修改订单
|
||||
updateOrder:(params = {})=>vm.$u.put(config.adminPath+'/property/workOrders',params),
|
||||
|
||||
//会议列表
|
||||
@ -34,8 +39,13 @@ const install = (Vue, vm) => {
|
||||
//监控列表
|
||||
getMonitors:(params = {})=>vm.$u.get(config.adminPath+'/sis/deviceChannel/treeList',params),
|
||||
|
||||
//获取播放地址
|
||||
getPlay:(params = {})=>vm.$u.post(config.adminPath+'/sis/stream/realtime/add',params),
|
||||
|
||||
//获取预警列表
|
||||
getWarns:(params = {})=>vm.$u.get(config.adminPath+'/property/warning/list',params),
|
||||
|
||||
|
||||
// 基础服务：登录登出、身份信息、菜单授权、切换系统、字典数据等
|
||||
lang: (params = {}) => vm.$u.get('/lang/'+params.lang),
|
||||
index: (params = {}) => vm.$u.get(config.adminPath+'/mobile/index', params),
|
||||
|
||||
21
pages.json
21
pages.json
@ -444,6 +444,27 @@
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/sys/workbench/earlyWarning/earlyWarning",
|
||||
"style" :
|
||||
{
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/sys/workbench/earlyWarning/warnDetail",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "预警详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path" : "pages/sys/workbench/earlyWarning/warnStatistics",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText" : "预警统计"
|
||||
}
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
|
||||
@ -52,7 +52,7 @@
|
||||
data() {
|
||||
return {
|
||||
tabs: ['我的预约', '我的邀约', '全部记录'],
|
||||
activeTab: 1,
|
||||
activeTab: 0,
|
||||
tabData: [
|
||||
[],
|
||||
[],
|
||||
|
||||
246
pages/sys/workbench/earlyWarning/earlyWarning.vue
Normal file
246
pages/sys/workbench/earlyWarning/earlyWarning.vue
Normal file
@ -0,0 +1,246 @@
|
||||
<template>
|
||||
<view class="warn-container">
|
||||
<view class="warn-navbar">
|
||||
<image src="/static/ic_back.png" class="warn-back" @click="goBack" />
|
||||
<text class="warn-title">预警处理</text>
|
||||
<text class="warn-right-txt" @click="goStatistics">预警统计</text>
|
||||
</view>
|
||||
<!-- tab栏 -->
|
||||
<view class="warn-tabs">
|
||||
<view v-for="(tab, idx) in tabs" :key="idx" :class="['warn-tab', { active: idx === activeTab }]"
|
||||
@click="changeTab(idx)">
|
||||
{{ tab }}
|
||||
<view v-if="idx === activeTab" class="tab-underline"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 列表区 -->
|
||||
<scroll-view scroll-y class="warn-list">
|
||||
<view v-for="(item, idx) in list" :key="idx" class="warn-card" @click="goDetail(item)">
|
||||
<view class="warn-row">
|
||||
<view class="warn-no">事件预警类型</view>
|
||||
<view class="warn-status">
|
||||
紧急
|
||||
</view>
|
||||
</view>
|
||||
<image class="warn-line-image" src="/static/ic_my_repair_03.png" />
|
||||
<view class="warn-info">预警内容</view>
|
||||
<view class="warn-info">预警位置</view>
|
||||
<view class="warn-info">预警时间</view>
|
||||
<view class="warn-info">预警设备</view>
|
||||
<view class="warn-eval-wrap">
|
||||
<view class="warn-eval-btn">去处理</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tabs: ["待处理", "全部"],
|
||||
activeTab: 0,
|
||||
tabData: [
|
||||
[],
|
||||
[]
|
||||
],
|
||||
tabLoaded: [false, false],
|
||||
loading: false,
|
||||
lastScrollTop: 0,
|
||||
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
list() {
|
||||
return this.tabData[this.activeTab];
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.loadTabData(this.activeTab);
|
||||
},
|
||||
methods: {
|
||||
goBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
|
||||
async changeTab(idx) {
|
||||
this.activeTab = idx;
|
||||
if (!this.tabLoaded[idx]) {
|
||||
await this.loadTabData(idx);
|
||||
}
|
||||
},
|
||||
async loadTabData(idx) {
|
||||
this.loading = true;
|
||||
let params = {};
|
||||
if(idx == 0){
|
||||
params = {'status':0}
|
||||
}
|
||||
let res = await this.$u.api.getWarns(params);
|
||||
if (res.code == "200") {
|
||||
this.$set(this.tabData, idx, res.rows);
|
||||
}
|
||||
this.$set(this.tabLoaded, idx, true);
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
goDetail(item) {
|
||||
const itemStr = encodeURIComponent(JSON.stringify(item));
|
||||
uni.navigateTo({
|
||||
url: "/pages/sys/workbench/earlyWarning/warnDetail?item=" + itemStr,
|
||||
});
|
||||
},
|
||||
goStatistics(){
|
||||
uni.navigateTo({
|
||||
url: "/pages/sys/workbench/earlyWarning/warnStatistics"
|
||||
});
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.warn-container {
|
||||
height: 100vh;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.warn-navbar {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: stretch;
|
||||
position: relative;
|
||||
margin-top: 50rpx;
|
||||
}
|
||||
|
||||
.warn-back {
|
||||
width: 18rpx;
|
||||
height: 32rpx;
|
||||
margin-left: 24rpx;
|
||||
margin-right: 78rpx;
|
||||
}
|
||||
.warn-right-txt{
|
||||
font-size: 24rpx;
|
||||
color: #0090FF;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
.warn-title{
|
||||
font-size: 36rpx;
|
||||
color: #000;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.warn-tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
background: #fff;
|
||||
height: 80rpx;
|
||||
bwarn-bottom: 1px solid #f0f0f0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.warn-tab {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
color: #888;
|
||||
position: relative;
|
||||
font-weight: 500;
|
||||
padding: 0 0 10rpx 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.warn-tab.active {
|
||||
color: #2186ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tab-underline {
|
||||
width: 60rpx;
|
||||
height: 6rpx;
|
||||
background: #2186ff;
|
||||
bwarn-radius: 3rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.warn-list {
|
||||
padding: 0 24rpx;
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 30rpx;
|
||||
height: calc(100vh - 80rpx - 32rpx);
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.warn-card {
|
||||
background: #fff;
|
||||
bwarn-radius: 12rpx;
|
||||
margin-top: 24rpx;
|
||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.03);
|
||||
padding-top: 25rpx;
|
||||
padding-bottom: 32rpx;
|
||||
}
|
||||
|
||||
.warn-eval-wrap {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.warn-eval-btn{
|
||||
width: 240rpx;
|
||||
height: 60rpx;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
background: #0090FF;
|
||||
border-radius: 40rpx;
|
||||
font-size: 24rpx;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.warn-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12rpx;
|
||||
margin-top: 25rpx;
|
||||
margin-left: 19rpx;
|
||||
margin-right: 50rpx;
|
||||
}
|
||||
|
||||
.warn-no {
|
||||
font-size: 24rpx;
|
||||
color: #0b0b0b;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.warn-status {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.warn-line-image {
|
||||
margin-left: 29rpx;
|
||||
margin-right: 39rpx;
|
||||
height: 2rpx;
|
||||
margin-bottom: 29rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.warn-info {
|
||||
font-size: 24rpx;
|
||||
color: #888;
|
||||
margin-bottom: 30rpx;
|
||||
margin-left: 47rpx;
|
||||
}
|
||||
</style>
|
||||
@ -1,25 +1,61 @@
|
||||
<template>
|
||||
<view class="order-container">
|
||||
<view class="order-container" @click="handleOutsideClick">
|
||||
<view class="filter">
|
||||
<view class="filter-btn" @click="togglePopup">工单类型
|
||||
<image class="filter-img" src="/static/ic_down_arrow_g.png" />
|
||||
</view>
|
||||
<view class="filter-btn">工单状态
|
||||
<image class="filter-img" src="/static/ic_down_arrow_g.png" />
|
||||
</view>
|
||||
<view class="filter-btn">处理人
|
||||
<!-- 工单类型按钮 -->
|
||||
<view class="filter-btn" @click.stop="togglePopup('type')">
|
||||
{{ !selectedFilters.type ||selectedFilters.type.orderTypeName === '全部' ? '工单类型' : selectedFilters.type.orderTypeName }}
|
||||
<image class="filter-img" src="/static/ic_down_arrow_g.png" />
|
||||
<view v-if="activePopup === 'type'" class="dropdown">
|
||||
<view class="dropdown-triangle"></view>
|
||||
<view class="dropdown-list">
|
||||
<view v-for="(item, index) in typeList" :key="index" class="dropdown-item"
|
||||
@click.stop="selectFilter('type', item)">
|
||||
{{ item.orderTypeName }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 工单状态按钮 -->
|
||||
<view v-if="activeTab == 1" class="filter-btn" @click.stop="togglePopup('status')">
|
||||
{{ !selectedFilters.status || selectedFilters.status === '全部' ? '工单状态' : selectedFilters.status }}
|
||||
<image class="filter-img" src="/static/ic_down_arrow_g.png" />
|
||||
<view v-if="activePopup === 'status'" class="dropdown">
|
||||
<view class="dropdown-triangle"></view>
|
||||
<view class="dropdown-list">
|
||||
<view v-for="(item, index) in statusList" :key="index" class="dropdown-item"
|
||||
@click.stop="selectFilter('status', item.name)">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 处理人按钮 -->
|
||||
<view class="filter-btn" @click.stop="togglePopup('handler')">
|
||||
{{ !selectedFilters.handler || selectedFilters.handler === '全部' ? '处理人' : selectedFilters.handler }}
|
||||
<image class="filter-img" src="/static/ic_down_arrow_g.png" />
|
||||
<view v-if="activePopup === 'handler'" class="dropdown">
|
||||
<view class="dropdown-triangle"></view>
|
||||
<view class="dropdown-list">
|
||||
<view v-for="(item, index) in handlerList" :key="index" class="dropdown-item"
|
||||
@click.stop="selectFilter('handler', item.name)">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- tab栏 -->
|
||||
<view class="order-tabs">
|
||||
<view v-for="(tab, idx) in tabs" :key="idx" :class="['order-tab', {active: idx === activeTab}]"
|
||||
<view v-for="(tab, idx) in tabs" :key="idx" :class="['order-tab', { active: idx === activeTab }]"
|
||||
@click="changeTab(idx)">
|
||||
{{ tab }}
|
||||
<view v-if="idx === activeTab" class="tab-underline"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 列表区 -->
|
||||
<scroll-view scroll-y class="order-list" @scroll="handleScroll">
|
||||
<view v-for="(item, idx) in list" :key="idx" class="order-card" @click="goDetail(item)">
|
||||
@ -33,33 +69,18 @@
|
||||
<view class="order-info">工单名称：{{ item.orderName }}</view>
|
||||
<view class="order-info">工单类型：{{ item.typeName }}</view>
|
||||
<view class="order-info">创建时间：{{ item.createTime }}</view>
|
||||
<view class="order-info">有 效 期：{{ item.createTime }}-{{item.planCompleTime}}</view>
|
||||
<view v-if="item.statusText === '已结束'" class="order-eval-btn eval-btn-right">服务评价</view>
|
||||
<view class="order-info">
|
||||
有 效 期：{{ item.createTime }}-{{ item.planCompleTime }}
|
||||
</view>
|
||||
<view v-if="item.statusText === '已结束'" class="order-eval-btn eval-btn-right">
|
||||
服务评价
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 悬浮新增按钮 -->
|
||||
<image v-if="false" src="/static/ic_my_repair_02.png"
|
||||
:class="['order-add-btn-fixed', { 'hide': isAddBtnHidden }]" @click="addOrder" />
|
||||
|
||||
<!-- 工单类型弹窗 -->
|
||||
<u-popup v-model="showPopup" mode="bottom">
|
||||
<view class="popup-content">
|
||||
<view class="popup-header">
|
||||
<text @click="closePopup">取消</text>
|
||||
<text>选择工单类型</text>
|
||||
<text @click="confirmSelection">确定</text>
|
||||
</view>
|
||||
<view class="popup-body">
|
||||
<u-cell-group>
|
||||
<u-cell title="全部" @click="selectType('全部')"></u-cell>
|
||||
<u-cell title="报修" @click="selectType('报修')"></u-cell>
|
||||
<u-cell title="投诉" @click="selectType('投诉')"></u-cell>
|
||||
</u-cell-group>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<image v-if="false" src="/static/ic_my_repair_02.png" :class="['order-add-btn-fixed', { hide: isAddBtnHidden }]"
|
||||
@click="addOrder" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@ -67,27 +88,37 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tabs: ['待办', '全部'],
|
||||
activeTab: 1,
|
||||
tabs: ["待办", "全部"],
|
||||
activeTab: 0,
|
||||
tabData: [
|
||||
[],
|
||||
[]
|
||||
], // 每个tab的数据
|
||||
tabLoaded: [false, false], // 每个tab是否已加载
|
||||
],
|
||||
tabLoaded: [false, false],
|
||||
loading: false,
|
||||
lastScrollTop: 0,
|
||||
isAddBtnHidden: false,
|
||||
showPopup: false,
|
||||
selectedType: ''
|
||||
}
|
||||
activePopup: null, // 当前显示哪个弹窗，null表示都关闭
|
||||
selectedFilters: {
|
||||
type: null,
|
||||
status: null,
|
||||
handler: null,
|
||||
},
|
||||
typeList: [{
|
||||
'orderTypeName': '全部'
|
||||
}],
|
||||
statusList: [],
|
||||
handlerList: [],
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
list() {
|
||||
return this.tabData[this.activeTab];
|
||||
}
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.loadTabData(this.activeTab); // 初始化加载当前tab数据
|
||||
this.loadTabData(this.activeTab);
|
||||
this.loadFilterData();
|
||||
},
|
||||
methods: {
|
||||
goBack() {
|
||||
@ -95,22 +126,13 @@
|
||||
},
|
||||
addOrder() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/sys/workbench/order/addOrder'
|
||||
url: "/pages/sys/workbench/order/addOrder",
|
||||
});
|
||||
},
|
||||
handleScroll(e) {
|
||||
const scrollTop = e.detail.scrollTop;
|
||||
// 为了避免过于频繁的触发，可以设置一个阈值
|
||||
if (Math.abs(scrollTop - this.lastScrollTop) < 20) {
|
||||
return;
|
||||
}
|
||||
if (scrollTop > this.lastScrollTop && scrollTop > 50) {
|
||||
// 向下滚动，隐藏按钮
|
||||
this.isAddBtnHidden = true;
|
||||
} else {
|
||||
// 向上滚动，显示按钮
|
||||
this.isAddBtnHidden = false;
|
||||
}
|
||||
if (Math.abs(scrollTop - this.lastScrollTop) < 20) return;
|
||||
this.isAddBtnHidden = scrollTop > this.lastScrollTop && scrollTop > 50;
|
||||
this.lastScrollTop = scrollTop;
|
||||
},
|
||||
async changeTab(idx) {
|
||||
@ -121,69 +143,126 @@
|
||||
},
|
||||
async loadTabData(idx) {
|
||||
this.loading = true;
|
||||
// 模拟接口请求，不同tab返回不同mock数据
|
||||
let params = {}
|
||||
if (idx === 0) {
|
||||
params = {}
|
||||
let params = {};
|
||||
if (this.selectedFilters.type && this.selectedFilters.type.id) {
|
||||
params.type = this.selectedFilters.type.id
|
||||
}
|
||||
|
||||
let data = [];
|
||||
let res = await this.$u.api.getOrderList(params);
|
||||
|
||||
if (res.code == '200') {
|
||||
data = res.rows
|
||||
if (res.code == "200") {
|
||||
this.$set(this.tabData, idx, res.rows);
|
||||
}
|
||||
|
||||
this.$set(this.tabData, idx, data);
|
||||
this.$set(this.tabLoaded, idx, true);
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
getStatusLabel(status) {
|
||||
const statusMap = {
|
||||
0: '创建工单',
|
||||
1: '已接单',
|
||||
2: '已接单',
|
||||
3: '处理中',
|
||||
4: '已完成'
|
||||
0: "创建工单",
|
||||
1: "已接单",
|
||||
2: "已接单",
|
||||
3: "处理中",
|
||||
4: "已完成",
|
||||
};
|
||||
return statusMap[status] || '';
|
||||
return statusMap[status] || "";
|
||||
},
|
||||
getStatusColor(status) {
|
||||
const statusMap = {
|
||||
0: 'orange',
|
||||
1: 'doing',
|
||||
2: 'doing',
|
||||
3: 'doing',
|
||||
4: 'done'
|
||||
0: "orange",
|
||||
1: "doing",
|
||||
2: "doing",
|
||||
3: "doing",
|
||||
4: "done",
|
||||
};
|
||||
return statusMap[status] || '';
|
||||
return statusMap[status] || "";
|
||||
},
|
||||
goDetail(item) {
|
||||
// 将item对象转换为JSON字符串并进行编码，然后通过URL参数传递
|
||||
const itemStr = encodeURIComponent(JSON.stringify(item));
|
||||
uni.navigateTo({
|
||||
url: '/pages/sys/workbench/order/orderDetail?item=' + itemStr
|
||||
url: "/pages/sys/workbench/order/orderDetail?item=" + itemStr,
|
||||
});
|
||||
},
|
||||
togglePopup() {
|
||||
this.showPopup = !this.showPopup;
|
||||
},
|
||||
selectType(type) {
|
||||
this.selectedType = type;
|
||||
},
|
||||
closePopup() {
|
||||
this.showPopup = false;
|
||||
},
|
||||
confirmSelection() {
|
||||
if (this.selectedType) {
|
||||
// 处理确认逻辑，例如更新筛选条件
|
||||
console.log('Selected type:', this.selectedType);
|
||||
togglePopup(name) {
|
||||
if (this.activePopup === name) {
|
||||
this.activePopup = null;
|
||||
} else {
|
||||
this.activePopup = name;
|
||||
}
|
||||
this.showPopup = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
selectFilter(name, value) {
|
||||
this.selectedFilters[name] = value;
|
||||
this.activePopup = null;
|
||||
this.loadTabData(this.activeTab)
|
||||
},
|
||||
handleOutsideClick() {
|
||||
if (this.activePopup !== null) {
|
||||
this.activePopup = null;
|
||||
}
|
||||
},
|
||||
async loadFilterData() {
|
||||
// 工单类型
|
||||
|
||||
let resType = await this.$u.api.getOrdersType();
|
||||
if (resType.code === 200) {
|
||||
this.typeList = [...this.typeList, ...resType.rows];
|
||||
}
|
||||
|
||||
|
||||
this.statusList = [{
|
||||
name: "全部"
|
||||
},
|
||||
{
|
||||
name: "创建工单"
|
||||
},
|
||||
{
|
||||
name: "已接单"
|
||||
},
|
||||
{
|
||||
name: "处理中"
|
||||
},
|
||||
{
|
||||
name: "已完成"
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
|
||||
// 处理人
|
||||
try {
|
||||
let resHandler = await this.$u.api.getHandlers();
|
||||
if (resHandler.code === "200" && Array.isArray(resHandler.data)) {
|
||||
this.handlerList = resHandler.data;
|
||||
} else {
|
||||
this.handlerList = [{
|
||||
name: "全部"
|
||||
},
|
||||
{
|
||||
name: "张三"
|
||||
},
|
||||
{
|
||||
name: "李四"
|
||||
},
|
||||
{
|
||||
name: "王五"
|
||||
},
|
||||
];
|
||||
}
|
||||
} catch {
|
||||
this.handlerList = [{
|
||||
name: "全部"
|
||||
},
|
||||
{
|
||||
name: "张三"
|
||||
},
|
||||
{
|
||||
name: "李四"
|
||||
},
|
||||
{
|
||||
name: "王五"
|
||||
},
|
||||
];
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@ -204,16 +283,18 @@
|
||||
}
|
||||
|
||||
.filter-btn {
|
||||
padding: 15rpx 22rpx 15rpx 22rpx;
|
||||
background: #F7F7F7;
|
||||
padding: 15rpx 22rpx;
|
||||
background: #f7f7f7;
|
||||
border-radius: 25rpx;
|
||||
height: 58rpx;
|
||||
color: #9A9A9A;
|
||||
color: #9a9a9a;
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 24rpx;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.filter-img {
|
||||
@ -222,6 +303,54 @@
|
||||
margin-left: 8rpx;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: absolute;
|
||||
top: calc(100% + 10rpx);
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #fff;
|
||||
border-radius: 12rpx;
|
||||
box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.1);
|
||||
z-index: 999;
|
||||
width: 200rpx;
|
||||
}
|
||||
|
||||
/* 三角 */
|
||||
.dropdown-triangle {
|
||||
position: absolute;
|
||||
top: -10rpx;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-left: 10rpx solid transparent;
|
||||
border-right: 10rpx solid transparent;
|
||||
border-bottom: 10rpx solid #fff;
|
||||
filter: drop-shadow(0 1rpx 1rpx rgba(0, 0, 0, 0.05));
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.dropdown-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.dropdown-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.dropdown-item:hover {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.order-tabs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -230,7 +359,6 @@
|
||||
height: 80rpx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
flex-shrink: 0;
|
||||
/* 防止被压缩 */
|
||||
}
|
||||
|
||||
.order-tab {
|
||||
@ -241,19 +369,18 @@
|
||||
position: relative;
|
||||
font-weight: 500;
|
||||
padding: 0 0 10rpx 0;
|
||||
/* tab点击事件 */
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.order-tab.active {
|
||||
color: #2186FF;
|
||||
color: #2186ff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.tab-underline {
|
||||
width: 60rpx;
|
||||
height: 6rpx;
|
||||
background: #2186FF;
|
||||
background: #2186ff;
|
||||
border-radius: 3rpx;
|
||||
margin: 0 auto;
|
||||
margin-top: 8rpx;
|
||||
@ -263,13 +390,9 @@
|
||||
margin: 32rpx 0 0 0;
|
||||
padding: 0 24rpx;
|
||||
flex: 1;
|
||||
/* 占据所有剩余空间 */
|
||||
overflow-y: auto;
|
||||
/* 内容超出时，开启垂直滚动 */
|
||||
padding-bottom: 30rpx;
|
||||
/* 为底部按钮留出空间 */
|
||||
height: calc(100vh - 80rpx - 32rpx);
|
||||
/* 减去tab栏高度和margin-top */
|
||||
}
|
||||
|
||||
.order-card {
|
||||
@ -281,8 +404,6 @@
|
||||
padding-bottom: 32rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.order-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -295,7 +416,7 @@
|
||||
|
||||
.order-no {
|
||||
font-size: 24rpx;
|
||||
color: #0B0B0B;
|
||||
color: #0b0b0b;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@ -305,22 +426,22 @@
|
||||
}
|
||||
|
||||
.order-line-image {
|
||||
margin: left 29rpx;
|
||||
margin-left: 29rpx;
|
||||
margin-right: 39rpx;
|
||||
height: 2rpx;
|
||||
margin-bottom: 29rpx;
|
||||
}
|
||||
|
||||
.order-status.orange {
|
||||
color: #F3AB44;
|
||||
color: #f3ab44;
|
||||
}
|
||||
|
||||
.order-status.doing {
|
||||
color: #00C9AA;
|
||||
color: #00c9aa;
|
||||
}
|
||||
|
||||
.order-status.done {
|
||||
color: #8A8A8A;
|
||||
color: #8a8a8a;
|
||||
}
|
||||
|
||||
.order-info {
|
||||
@ -344,26 +465,4 @@
|
||||
.order-add-btn-fixed.hide {
|
||||
transform: translateX(200%);
|
||||
}
|
||||
|
||||
.popup-content {
|
||||
background-color: #fff;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.popup-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
}
|
||||
|
||||
.popup-header text {
|
||||
color: #2186FF;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.popup-body {
|
||||
padding: 20rpx;
|
||||
}
|
||||
</style>
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="page-container">
|
||||
<view class="top-line"/>
|
||||
<view class="top-line" />
|
||||
<!-- 工单状态进度 -->
|
||||
<view class="repair-detail-progress-box">
|
||||
<view class="repair-detail-progress">
|
||||
@ -29,63 +29,83 @@
|
||||
<view class="detail-value remark"><text>备注：</text>{{ detail.remark }}</view>
|
||||
<view class="detail-value"><text class="detail-key">工单图片：</text></view>
|
||||
<view class="image-list" v-if="detail.orderImgUrl">
|
||||
<u-image
|
||||
v-for="(imgUrl, index) in detail.orderImgUrl.split(',')"
|
||||
:key="index"
|
||||
:src="imgUrl"
|
||||
width="200rpx"
|
||||
height="200rpx"
|
||||
border-radius="10rpx"
|
||||
<u-image v-for="(imgUrl, index) in detail.orderImgUrl.split(',')" :key="index" :src="imgUrl"
|
||||
width="200rpx" height="200rpx" border-radius="10rpx"
|
||||
@click="previewImage(detail.orderImgUrl.split(','), index)"
|
||||
style="margin-right: 20rpx; margin-bottom: 20rpx;"
|
||||
></u-image>
|
||||
style="margin-right: 20rpx; margin-bottom: 20rpx;"></u-image>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<!-- 底部操作按钮 -->
|
||||
<view class="btn-group">
|
||||
<button class="btn ghost" @click="transfer">转派</button>
|
||||
<button class="btn primary" @click="complete">完成</button>
|
||||
<view v-if="(!this.isManager&&this.detailStep == 2) || this.detailStep == 0" class="btn-group">
|
||||
<button class="btn ghost"
|
||||
@click="transfer">{{this.isManager ? '指派':this.detailStep == 0 ? '拒绝':'转派'}}</button>
|
||||
<button v-if="!this.isManager" class="btn primary"
|
||||
@click="complete">{{this.detailStep == 0 ? '接单':'完成'}}</button>
|
||||
</view>
|
||||
|
||||
<SelectUser :visible.sync="showSelect" :list="users" :multiple="false" @confirm="onConfirm" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
<script>
|
||||
import SelectUser from '@/components/SelectUser.vue'
|
||||
export default {
|
||||
components: {
|
||||
SelectUser
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detailStep: 0,
|
||||
detailStatus: '',
|
||||
progressSteps: ['创建工单','已接单', '处理中', '已结束'],
|
||||
progressSteps: ['创建工单', '已接单', '处理中', '已结束'],
|
||||
currentStatus: 2, // 0: 待分配，1: 已接单，2: 处理中，3: 已完成
|
||||
detail: {
|
||||
}
|
||||
|
||||
detail: {},
|
||||
isManager: false,
|
||||
showSelect: false,
|
||||
users: [{
|
||||
id: '1',
|
||||
name: '秦玉兰',
|
||||
department: '物业修维部'
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
name: '秦桂花',
|
||||
department: '物业修维部'
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
name: '李小明',
|
||||
department: '物业修维部'
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
if (options.item) {
|
||||
const item = JSON.parse(decodeURIComponent(options.item));
|
||||
this.detail = item;
|
||||
this.detail.orderImgUrl = "https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3";
|
||||
console.log("t1",this.detail)
|
||||
// 现在可以使用item对象了
|
||||
// 进度映射
|
||||
if (item.status == 0) {
|
||||
this.detailStep = 0;
|
||||
this.detailStatus = '创建工单';
|
||||
} else if (item.status == 4) {
|
||||
this.detailStep = 3;
|
||||
this.detailStatus = '已结束';
|
||||
} else if(item.status == 3){
|
||||
this.detailStep = 2;
|
||||
this.detailStatus = '处理中';
|
||||
}else {
|
||||
this.detailStep = 1;
|
||||
this.detailStatus = '已接单';
|
||||
this.isManager = this.vuex_user.roles[0].roleId == 1
|
||||
if (options.item) {
|
||||
const item = JSON.parse(decodeURIComponent(options.item));
|
||||
this.detail = item;
|
||||
this.detail.orderImgUrl =
|
||||
"https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3,https://picsum.photos/80/80?random=3";
|
||||
console.log("t1", this.detail)
|
||||
// 现在可以使用item对象了
|
||||
// 进度映射
|
||||
if (item.status == 0) {
|
||||
this.detailStep = 0;
|
||||
this.detailStatus = '创建工单';
|
||||
} else if (item.status == 4) {
|
||||
this.detailStep = 3;
|
||||
this.detailStatus = '已结束';
|
||||
} else if (item.status == 3) {
|
||||
this.detailStep = 2;
|
||||
this.detailStatus = '处理中';
|
||||
} else {
|
||||
this.detailStep = 1;
|
||||
this.detailStatus = '已接单';
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goBack() {
|
||||
@ -98,11 +118,10 @@
|
||||
current: index
|
||||
});
|
||||
},
|
||||
onConfirm(selected) {
|
||||
},
|
||||
transfer() {
|
||||
uni.showToast({
|
||||
title: '转派功能开发中',
|
||||
icon: 'none'
|
||||
});
|
||||
this.showSelect = true
|
||||
},
|
||||
complete() {
|
||||
uni.showToast({
|
||||
@ -110,18 +129,7 @@
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
downloadFile() {
|
||||
uni.downloadFile({
|
||||
url: this.detail.attachment,
|
||||
success: (res) => {
|
||||
if (res.statusCode === 200) {
|
||||
uni.openDocument({
|
||||
filePath: res.tempFilePath
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@ -130,11 +138,13 @@
|
||||
.page-container {
|
||||
background: #fff;
|
||||
}
|
||||
.top-line{
|
||||
|
||||
.top-line {
|
||||
width: 100vw;
|
||||
height: 3rpx;
|
||||
background: #ECECEC;
|
||||
}
|
||||
|
||||
.repair-detail-progress-box {
|
||||
height: 107rpx;
|
||||
margin-bottom: 41rpx;
|
||||
@ -214,10 +224,10 @@
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
|
||||
.detail-key{
|
||||
.detail-key {
|
||||
color: #595858;
|
||||
}
|
||||
|
||||
|
||||
.detail-value {
|
||||
margin-bottom: 30rpx;
|
||||
color: ##2F2F2F;
|
||||
@ -237,7 +247,7 @@
|
||||
flex-wrap: wrap;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
|
||||
.image-item {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
|
||||
@ -64,7 +64,9 @@
|
||||
},
|
||||
{
|
||||
icon: 'https://picsum.photos/80/80?random=3',
|
||||
text: '停车'
|
||||
text: '预警处理',
|
||||
url:'/pages/sys/workbench/earlyWarning/earlyWarning'
|
||||
|
||||
},
|
||||
{
|
||||
icon: 'https://picsum.photos/80/80?random=3',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user