46b6767c
 刘淇
init 提交到库
|
1
2
3
4
5
6
7
8
|
<template>
<view class="fs-p30">
<tui-form ref="form" :showMessage="false">
<view class="fs-radius__sm">
<tui-input placeholder="请选择" label="养护街道" v-model="formData.streetName" disabled @click="pickerOpen(1)"></tui-input>
<tui-input placeholder="请选择" label="养护道路" v-model="formData.roadName" disabled @click="pickerOpen(2)"></tui-input>
<tui-input placeholder="请选择" label="养护组长" v-model="formData.leaderUserName" disabled @click="pickerOpen(3)"></tui-input>
<tui-input placeholder="请选择" label="具体位置" v-model="formData.lonLatAddress" disabled @click="openMap()"></tui-input>
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
9
10
11
|
<tui-input placeholder="请选择" label="问题来源" v-if="editDisabled" v-model="formData.problemSourceName" disabled></tui-input>
<tui-input placeholder="请选择" label="问题来源" v-else v-model="formData.problemSourceName" disabled @click="pickerOpen(4)"></tui-input>
|
|
46b6767c
刘淇
init 提交到库
|
12
13
14
15
16
17
18
19
20
21
22
23
|
<tui-form-item label="紧急程度" :bottomBorder="false">
<tui-radio-group v-model="formData.pressingType">
<view class="fs-flex">
<tui-label margin="0 0 0 30rpx" v-for="(item,index) in pressingTypeList">
<tui-radio :checked="item.checked" :value="item.value"></tui-radio>
<text class="fs-ml16">{{item.name}}</text>
</tui-label>
</view>
</tui-radio-group>
</tui-form-item>
</view>
<tui-white-space></tui-white-space>
|
|
6eea308a
刘淇
页面onShow 加载
|
24
|
<tui-textarea :radius="20" placeholder="请输入问题描述" isCounter :size="28" :maxlength="500" v-model="formData.remark"></tui-textarea>
|
|
46b6767c
刘淇
init 提交到库
|
25
26
27
|
<tui-white-space></tui-white-space>
<tui-tab :tabs="tabList" scroll bold :leftGap="30" @change="tabChange"></tui-tab>
<tui-white-space></tui-white-space>
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
28
|
<tui-upload v-show="currentIndex == 0" background="#fff" :value="imgsValue" :width="210" :radius="10" :height="210" delColor="#333" custom :serverUrl="serverURL" :header="{'Authorization': userToken}" :limit="3" @complete="complete($event, 'imgs')">
|
|
46b6767c
刘淇
init 提交到库
|
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<text class="fs-size__28 fs-color__subtitle fs-weight__400">问题图片</text>
</tui-upload>
<tui-upload v-show="currentIndex == 1" background="#fff" :width="210" :radius="10" :height="210" delColor="#333" custom :serverUrl="serverURL" :header="{'Authorization': userToken}" :limit="3" @complete="complete($event, 'streetImgList')">
<text class="fs-size__28 fs-color__subtitle fs-weight__400">街景图片</text>
</tui-upload>
<tui-upload v-show="currentIndex == 2" background="#fff" :width="210" :radius="10" :height="210" delColor="#333" custom :serverUrl="serverURL" :header="{'Authorization': userToken}" :limit="3" @complete="complete($event, 'longRangeImgList')">
<text class="fs-size__28 fs-color__subtitle fs-weight__400">远景图片</text>
</tui-upload>
</tui-form>
<view class="fs-mt60 fs-flex__center fs-safe__area">
<tui-button shape="circle" width="600rpx" height="80rpx" shadow :loading="isLoading" :disabled="isLoading" @click="onSubmit">提 交</tui-button>
</view>
<tui-picker :show="pickerShow" radius :pickerData="pickerList[pickerType]" textField="name" valueField="id" @hide="pickerHide" @change="pickerChange"></tui-picker>
</view>
</template>
<script>
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
46
|
import { uploadURL, OSSURL } from '@/config/app'
|
|
46b6767c
刘淇
init 提交到库
|
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
|
import { apiCaseAdd, apiStreetList, apiRoadListByStreetId, apiLeaderList } from '@/api/work'
import { apiTypeList } from '@/api/app'
const rules = [
{
name: "streetName",
rule: ["required"],
msg: ["请选择养护街道"]
},
{
name: "roadName",
rule: ["required"],
msg: ["请选择养护道路"]
},
{
name: "leaderUserName",
rule: ["required"],
msg: ["请选择养护组长"]
},
{
name: "problemSourceName",
rule: ["required"],
msg: ["请选择问题来源"]
},
{
name: "lonLatAddress",
rule: ["required"],
msg: ["请选择具体位置"]
},
{
name: "remark",
rule: ["required"],
msg: ["请输入问题描述"]
}
]
export default {
data() {
return {
formData: {
streetId: 0,
streetName: '',
roadId: 0,
roadName: '',
leaderUserId: 0,
leaderUserName: '',
remark: '',
imgs: [],
pressingType: 3,
streetImgList: [],
longRangeImgList: [],
latLonType: 1,
lat: 0,
lon: 0,
lonLatAddress: '',
problemSourceId: 0,
problemSourceName: ''
},
pickerList: [],
isLoading: false,
pickerShow: false,
pickerType: 0,
pressingTypeList: [
{value:1, name:'特急'},
{value:2, name:'紧急'},
{value:3, name:'一般', checked:true}
],
serverURL: uploadURL,
currentIndex: 0,
tabList: ['问题图片', '街景图片', '远景图片'],
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
115
116
117
|
hotlinenumber:'',
editDisabled:false,
imgsValue:[], //初始化图片
|
|
46b6767c
刘淇
init 提交到库
|
118
119
|
}
},
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
120
121
|
onLoad(options) {
this.getStreetList()
|
|
46b6767c
刘淇
init 提交到库
|
122
123
|
this.getLeaderList()
this.getTypeList()
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
|
this.hotlinenumber = options.hotlinenumber
if(this.hotlinenumber){
// 1. 获取 eventChannel 实例
const eventChannel = this.getOpenerEventChannel();
// 2. 监听A页面发送的事件，接收大量数据
eventChannel.on('largeDataFromWorkOrder', (largeData) => {
console.log('A页面传递的大量数据：', largeData);
// 存储到 data 中供页面使用
// this.formData = largeData;
this.editDisabled = true
let largeData1 = {
"searchEntities": null,
"createBy": "吴宗刚",
"createTime": "2025-09-08 22:48:39",
"updateBy": "xcyl",
"updateTime": "2025-09-09 19:56:56",
"remark": null,
"beginTime": null,
"endTime": "2025-09-30 15:52:20",
"exportType": null,
"params": {},
"id": "5a76e18752f69dca1e98666aa93cc7c9",
"hotlinenumber": "WO005_20250908224839",
"casefile": null,
"eventsouce": "12345",
"citynum": "西城自己的-2250627-7777777",
"regionnum": "西城园林-250627-7777777",
"taskstate": "gdtype02",
"ownership": "0",
"casesource": "01",
"department": "10002",
"companyid": "10002",
"companyVo": "西城园林",
"street": "110102012000",
"streetVo": "什刹海街道",
"callName": "王虹云-西城自己创建",
"callTel": "13581551620",
"acceptcasetime": "2025-09-02 00:00:00",
"address": "什刹海公园东门东侧道北",
"content": "市民反映，西城区恭王府南门口东侧道北有一颗近百年的杨树，被连根斩了，希望查询财产去向、哪个部门砍伐的，是否是盗伐的，之前北京站前街也发生过类似的情况，希望核实，来电反映协调核实恭王府南门口东侧道北杨树被砍伐问题。市民反映，西城区恭王府南门口东侧道北有一颗近百年的杨树，被连根斩了，希望查询财产去向、哪个部门砍伐的，是否是盗伐的，之前北京站前街也发生过类似的情况，希望核实，来电反映协调核实恭王府南门口东侧道北杨树被砍伐问题。市民反映，西城区恭王府南门口东侧道北有一颗近百年的杨树，被连根斩了，希望查询财产去向、哪个部门砍伐的，是否是盗伐的，之前北京站前街也发生过类似的情况，希望核实，来电反映协调核实恭王府南门口东侧道北杨树被砍伐问题。市民反映，西城区恭王府南门口东侧道北有一颗近百年的杨树，被连根斩了，希望查询财产去向、哪个部门砍伐的，是否是盗伐的，之前北京站前街也发生过类似的情况，希望核实，来电反映协调核实恭王府南门口东侧道北杨树被砍伐问题。",
"casepic": "https://test.jichengshanshui.com.cn:28310/yuanlin/alioss/yl/images/2025/09/08/af671146754be2596b65e87e544c481f.jpg",
"dealuser": "xcyl严家齐巡查员",
"dispatcher": "0",
"dispperson": "368",
"disppersonVo": "xcyl严家齐巡查员",
"replyResult": null,
"picResult1": null,
"picResult2": null,
"picResult3": null,
"finishTime": null,
"replayrtime": null,
"ownercompany": null,
"casetype": null,
"handingresult": null,
"resolvedesp": "是我的问题， 但就是不处理， 就这么着~！！！！！！",
"rstResolvedesp": null,
"dealBy": null,
"dealTime": null,
"replayBy": null,
"replayTime": null,
"ownershipBy": "xcyl",
"ownershipTime": "2025-09-09 19:56:56",
"reserve1": "1",
"reserve2": null,
"reserve3": null,
"sysPhotoList": null
}
console.log(this.formData)
this.formData.streetName = largeData.streetVo
this.formData.streetId = largeData.street
this.getRoadList( this.formData.streetId)
this.formData.lonLatAddress = largeData.address
this.formData.remark = largeData.content
this.formData.problemSourceName = '12345工单'
this.formData.problemSourceId = 2
this.formData.thirdWorkOrderNo = largeData.hotlinenumber
// this.formData.imgs = largeData.casepic
if(largeData.casepic){
let picData = largeData.casepic.replace(OSSURL, "")
this.imgsValue = [picData]
// this.formData.imgs.push({
// url: picData, // 接口返回的图片地址
// id: Date.now() // 用时间戳作为唯一标识
// });
}
});
}else{
}
|
|
46b6767c
刘淇
init 提交到库
|
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
|
},
methods: {
// 获取街道列表
getStreetList() {
apiStreetList().then(res => {
this.pickerList[1] = res.data
})
},
// 获取道路列表
getRoadList(streetId) {
apiRoadListByStreetId({data:{stree_id:streetId}}).then(res => {
this.formData.roadId = ''
this.formData.roadName = ''
this.pickerList[2] = res.data
})
},
// 获取组长列表
getLeaderList() {
apiLeaderList().then(res => {
res.data.forEach(item => {item.id = item.userId})
this.pickerList[3] = res.data
})
},
// 获取问题来源列表
getTypeList() {
apiTypeList({data:{dict_type: 'problem_source'}}).then(res => {
res.data.forEach(item => {
item.id = item.value
item.name = item.label
})
this.pickerList[4] = res.data
})
},
// 打开选择框
pickerOpen(type) {
this.pickerShow = true
this.pickerType = type
},
// 关闭选择框
pickerHide() {
this.pickerShow = false
},
// 选择选择框
pickerChange(event) {
switch (this.pickerType) {
case 1:
this.formData.streetId = event.id
this.formData.streetName = event.name
this.formData.roadId = 0
this.formData.roadName = ''
// 查询道路列表
this.getRoadList(event.id)
break
case 2:
this.formData.roadId = event.id
this.formData.roadName = event.name
break
case 3:
this.formData.leaderUserId = event.id
this.formData.leaderUserName = event.name
break
case 4:
this.formData.problemSourceId = event.id
this.formData.problemSourceName = event.name
break
}
},
// 上传完成
complete(e, type) {
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
|
if (e.status == 1) {
if(type == 'imgs'){
// 直接添加新图，不删除默认图
// this.imgsValue.push({
// url: event.url, // 接口返回的新图地址
// isDefault: false,
// id: Date.now() // 时间戳作为唯一标识
// });
this.imgsValue = e.imgArr
}else{
this.formData[type] = e.imgArr
}
console.log( this.formData[type])
}
|
|
46b6767c
刘淇
init 提交到库
|
302
303
304
305
306
307
308
309
|
},
// 提交
onSubmit() {
this.$refs.form.validate(this.formData, rules).then(res => {
if (!res.isPass) {
uni.$tui.toast(res.errorMsg)
return
}
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
310
311
312
|
// 关键：提交所有图片（默认图 + 新图）
// this.formData.imgs = this.imgsValue.map(item => item.url);
this.formData.imgs = this.imgsValue
|
|
46b6767c
刘淇
init 提交到库
|
313
314
315
316
317
|
if (!this.formData.imgs.length || !this.formData.streetImgList.length || !this.formData.longRangeImgList.length) {
uni.$tui.toast('请上传图片')
return
}
this.isLoading = true
|
|
d0f9ccb8
刘淇
12345工单 问题上报
|
318
319
320
|
|
|
46b6767c
刘淇
init 提交到库
|
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
|
apiCaseAdd({data:{...this.formData}}).then(res => {
uni.$tui.toast('提交成功')
setTimeout(() => { uni.navigateBack() }, 1500)
}).finally(() => {
this.isLoading = false
})
})
},
// 选择位置
openMap() {
var that = this
uni.chooseLocation({
success: function (res) {
that.formData.lat = res.latitude
that.formData.lon = res.longitude
that.formData.lonLatAddress = res.address
}
})
},
// 选项卡
tabChange(event) {
this.currentIndex = event.index
},
}
}
</script>
<style lang="scss" scoped>
</style>
|
