You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
294 lines
8.2 KiB
294 lines
8.2 KiB
11 months ago
|
<template>
|
||
|
<view>
|
||
|
<view class="investigation-item"
|
||
|
:class="investigationSelect === index ? 'active' : ''"
|
||
|
v-for="(item, index) in investigationList"
|
||
|
:key="item.name"
|
||
|
@click="handleSelect(item, index)"
|
||
|
>
|
||
|
<text>{{ item.name }}</text>
|
||
|
<uni-icons type="checkmarkempty" size="24" :style="{color: '#2663BF', visibility: investigationSelect === index ? 'visible' : 'hidden'}"/>
|
||
|
</view>
|
||
|
<u-popup :show="showInvestigationDetail" @close="showInvestigationDetail = false">
|
||
|
<view class="custom-pop-head">
|
||
|
<view class="left" @click="showInvestigationDetail = false">取消</view>
|
||
|
<view class="title">{{ investigationDetailTitle }}</view>
|
||
|
<view class="right" @click="investigationDetailHandle">确认</view>
|
||
|
</view>
|
||
|
<view class="box" style="max-height: 800rpx;overflow-y: auto">
|
||
|
<view class="investigation-item"
|
||
|
v-for="(item, index) in investigationDetailList"
|
||
|
:key="index"
|
||
|
style="width: 96%; padding: 0"
|
||
|
>
|
||
|
<view class="detail-item" v-if="item.type === 'number' || item.type === '1'">
|
||
|
<uni-forms-item :label="item.name" label-width="300px" style="display: flex;align-items: center">
|
||
|
<u-input
|
||
|
placeholder="请输入"
|
||
|
border="none"
|
||
|
v-model="item.standar"
|
||
|
inputAlign="right"
|
||
|
type="number"
|
||
|
>
|
||
|
<u-text
|
||
|
:text="item.unit"
|
||
|
slot="suffix"
|
||
|
margin="0 3px 0 0"
|
||
|
type="tips"
|
||
|
></u-text>
|
||
|
</u-input>
|
||
|
</uni-forms-item>
|
||
|
</view>
|
||
|
<view class="detail-item" v-else-if="item.type === 'text' || item.type === '2'">
|
||
|
<uni-forms-item :label="item.name" label-width="300px" style="display: flex;align-items: center">
|
||
|
<u-input
|
||
|
placeholder="请输入"
|
||
|
border="none"
|
||
|
v-model="item.standar"
|
||
|
inputAlign="right"
|
||
|
/>
|
||
|
</uni-forms-item>
|
||
|
</view>
|
||
|
<view class="detail-item" v-else-if="item.type === 'check' || item.type === '3'">
|
||
|
<uni-forms-item :label="item.name" label-width="300px" style="display: flex;align-items: center">
|
||
|
<u-checkbox
|
||
|
v-model="item.standar"
|
||
|
:customStyle="{justifyContent: 'space-between'}"
|
||
|
:name="'sdfs'"
|
||
|
/>
|
||
|
</uni-forms-item>
|
||
|
</view>
|
||
|
<view class="detail-item" v-else-if="item.type === 'upload' || item.type === '4'">
|
||
|
<uni-forms-item :label="item.name" label-position="top" label-width="300px" style="display: flex;align-items: center" />
|
||
|
<u-upload
|
||
|
:fileList="item.fileList"
|
||
|
@afterRead="(e) => afterRead(e, item)"
|
||
|
@delete="(e) => deletePic(e, item)"
|
||
|
name="1"
|
||
|
:maxCount="1"
|
||
|
></u-upload>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="blank" />
|
||
|
</u-popup>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
export default {
|
||
|
// 组件
|
||
|
components: {},
|
||
|
props: {
|
||
|
sid: {
|
||
|
type: String,
|
||
|
default: '01'
|
||
|
}
|
||
|
},
|
||
|
data() {
|
||
|
return {
|
||
|
// 公用的js
|
||
|
$: this.$,
|
||
|
investigationSelect: null,
|
||
|
investigationList: [],
|
||
|
showInvestigationDetail: false,
|
||
|
investigationDetailTitle: '',
|
||
|
investigationDetailList: []
|
||
|
}
|
||
|
},
|
||
|
// 页面加载
|
||
|
onLoad(e) {
|
||
|
console.log(12312312312)
|
||
|
// this.getData()
|
||
|
},
|
||
|
mounted(){
|
||
|
if (this.sid) {
|
||
|
this.getData()
|
||
|
}
|
||
|
},
|
||
|
// 页面显示
|
||
|
onShow() {
|
||
|
},
|
||
|
// 计算属性
|
||
|
computed: {},
|
||
|
// 方法
|
||
|
methods: {
|
||
|
// 删除图片
|
||
|
deletePic(event, item) {
|
||
|
item.fileList.splice(event.index, 1)
|
||
|
},
|
||
|
//获取随机id
|
||
|
uuid(len, binary) {
|
||
|
len = !len ? 36 : len;
|
||
|
binary = !binary ? 16 : binary;
|
||
|
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
|
||
|
var r = Math.random() * binary | 0,
|
||
|
v = c == 'x' ? r : (r & 0x3 | 0x8);
|
||
|
return v.toString(binary);
|
||
|
}).substring(0, len)
|
||
|
},
|
||
|
// 新增图片
|
||
|
async afterRead(event, item) {
|
||
|
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||
|
const id = this.uuid()
|
||
|
item.fileList.push({
|
||
|
id,
|
||
|
...event.file,
|
||
|
status: 'uploading',
|
||
|
message: '上传中'
|
||
|
})
|
||
|
const result = await this.uploadFilePromise(item.fileList[0].url)
|
||
|
const resultInfo = JSON.parse(result)
|
||
|
const index = item.fileList.findIndex(v => v.id === id)
|
||
|
if (resultInfo.code == 200) {
|
||
|
item.fileList.splice(index, 1, Object.assign(item.fileList[index], {
|
||
|
status: 'success',
|
||
|
message: '',
|
||
|
result: resultInfo,
|
||
|
url: resultInfo.result
|
||
|
}))
|
||
|
} else {
|
||
|
this.$.toast('上传失败')
|
||
|
item.fileList.splice(index, 1, Object.assign(item.fileList[index], {
|
||
|
status: 'error',
|
||
|
message: '失败',
|
||
|
}))
|
||
|
}
|
||
|
},
|
||
|
uploadFilePromise(url) {
|
||
|
return new Promise((resolve, reject) => {
|
||
|
let a = uni.uploadFile({
|
||
|
url: this.$.baseUrl + '/hiddenDanger/ftp/uploadFileToFtp', // 仅为示例,非真实的接口地址
|
||
|
filePath: url,
|
||
|
name: 'file',
|
||
|
success: (res) => {
|
||
|
resolve(res.data)
|
||
|
}
|
||
|
});
|
||
|
})
|
||
|
},
|
||
|
getData(){
|
||
|
this.$request.globalRequest('/hiddenDanger/highDanger/getImportDangers', {}, 'GET').then(res => {
|
||
|
if(res.code == 200){
|
||
|
this.investigationList = res.result
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
getData2(sid){
|
||
|
this.$request.globalRequest('/hiddenDanger/highDanger/getImportDangerInfo', {sid}, 'GET').then(res => {
|
||
|
if(res.code == 200){
|
||
|
console.log(res.result)
|
||
|
this.investigationDetailList = res.result.map(item => {
|
||
|
switch (item.type) {
|
||
|
case "1":
|
||
|
item.standar = 0
|
||
|
break;
|
||
|
case "2":
|
||
|
item.standar = ''
|
||
|
break;
|
||
|
case "3":
|
||
|
item.standar = false
|
||
|
break;
|
||
|
case "4":
|
||
|
item.fileList = []
|
||
|
break;
|
||
|
}
|
||
|
return item
|
||
|
})
|
||
|
}
|
||
|
})
|
||
|
},
|
||
|
// 跳转页面
|
||
|
skipPage(even){
|
||
|
this.$.open(even)
|
||
|
},
|
||
|
handleSelect(item, index){
|
||
|
this.investigationSelect = index
|
||
|
this.investigationDetailTitle = item.name
|
||
|
this.showInvestigationDetail = true
|
||
|
this.getData2(item.nid)
|
||
|
// this.$emit('select', this.investigationSelect, this.investigationList[index])
|
||
|
},
|
||
|
investigationDetailHandle(){
|
||
|
this.showInvestigationDetail = false
|
||
|
this.$emit('select', this.investigationList[this.investigationSelect], this.investigationDetailList)
|
||
|
}
|
||
|
},
|
||
|
onReady() {
|
||
|
},
|
||
|
// 页面卸载
|
||
|
onUnload() {
|
||
|
|
||
|
},
|
||
|
// 触发下拉刷新
|
||
|
onPullDownRefresh() {
|
||
|
// 延迟关闭刷新动画
|
||
|
setTimeout(() => {
|
||
|
uni.stopPullDownRefresh();
|
||
|
}, 1500);
|
||
|
},
|
||
|
// 页面上拉触底事件的处理函数
|
||
|
onReachBottom() {
|
||
|
},
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style>
|
||
|
page {
|
||
|
background:#FFFFFF;
|
||
|
}
|
||
|
</style>
|
||
|
<style lang="scss" scoped>
|
||
|
.investigation-item {
|
||
|
margin:0 auto 20rpx;
|
||
|
width: 90%;
|
||
|
border-radius: 8rpx;
|
||
|
padding: 20rpx;
|
||
|
box-sizing: border-box;
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
align-items: center;
|
||
|
overflow: hidden;
|
||
|
&.active {
|
||
|
background: #DFEBF8;
|
||
|
}
|
||
|
}
|
||
|
.detail-item {
|
||
|
width: 100%;
|
||
|
background: #F0F3F7;
|
||
|
padding: 20rpx 30rpx;
|
||
|
border-radius: 8rpx;
|
||
|
box-sizing: border-box;
|
||
|
/deep/ .uni-forms-item__content {
|
||
|
justify-content: flex-end;
|
||
|
text-align: right;
|
||
|
display: flex;
|
||
|
}
|
||
|
/deep/ .uni-forms-item {
|
||
|
margin-bottom: 0;
|
||
|
}
|
||
|
/deep/ .uni-forms-item__label {
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
}
|
||
|
.custom-pop-head {
|
||
|
width: 100%;
|
||
|
padding: 20rpx;
|
||
|
box-sizing: border-box;
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
justify-content: space-between;
|
||
|
border-bottom: 1px solid #E6E6E6;
|
||
|
margin-bottom: 20rpx;
|
||
|
.left {
|
||
|
color: #666666;
|
||
|
}
|
||
|
.title {
|
||
|
font-size: 16px;
|
||
|
}
|
||
|
.right {
|
||
|
color: #2663BF;
|
||
|
}
|
||
|
}
|
||
|
</style>
|