圈子调整，增加e呼即办详情页面

Lou

2024-04-09 5731a304b3c98364116ce94b0bbdbd5d31c7f3c6

圈子调整，增加e呼即办详情页面

 api/task/taskReportForRepairs.js

@@ -78,4 +78,15 @@
        method: 'POST',

        data

    })

}



//获取e呼即办详情

export const getEcallEventDetail = (params) => {

    return http.request({

        url: 'blade-eCallEvent/eCallEvent/detail',

        method: 'GET',

        params: {

            ...params

        }

    })

}

 pages.json

@@ -689,6 +689,15 @@
                        "navigationBarBackgroundColor": "#fff",
                        "navigationBarTextStyle": "black"
                    }
                },
                {
                    "path": "views/eCallReportDetail",
                    "style": {
                        "navigationBarTitleText": "",
                        "enablePullDownRefresh": false,
                        "navigationBarBackgroundColor": "#fff",
                        "navigationBarTextStyle": "black"
                    }
                }
            ]
        },

 pages/circle/index.vue

@@ -31,7 +31,7 @@
                        multipleSize="100"></u-album>


                    <view class="link-btn flex a-i-c" @click="linkTo(item.eventId)" v-if="item.eventId">
                    <view class="link-btn flex a-i-c" @click="linkTo(item)" v-if="item.eventId">
                        <u-icon name="attach"></u-icon>
                        <text class="c-main ml-10 f-28">查看详情</text>
                    </view>
@@ -313,10 +313,20 @@
                    url: "publish"
                })
            },
            linkTo(id) {
                uni.navigateTo({
                    url: `/subPackage/workbench/views/reportDetail?id=${id}&from=circle`
                })
            linkTo(item) {
                if (item.evenType == 1) {
                    uni.navigateTo({
                        url: `/subPackage/workbench/views/reportDetail?id=${item.eventId}&from=circle`
                    })
                }
                if (item.evenType == 2) {
                    uni.navigateTo({
                        url: `/subPackage/workbench/views/eCallReportDetail?id=${item.eventId}&from=circle`
                    })
                }



            }
        }
    }

 subPackage/workbench/views/eCallReportDetail.vue

New file
@@ -0,0 +1,417 @@
<template>
    <view class="">
        <view class="bgc-ff">
            <view class="item-row flex j-c-s-b a-i-c">
                <text>事件名称</text>
                <text>{{detail.name}}</text>
            </view>
            <view class="item-row flex j-c-s-b a-i-c">
                <text>数据来源</text>
                <text class="address">{{detail.source}}</text>
            </view>
            <view class="item-row flex j-c-s-b a-i-c">
                <text>姓名</text>
                <text class="address">{{detail.realName}}</text>
            </view>
            <view class="item-row flex j-c-s-b a-i-c">
                <text>联系方式</text>
                <text class="address">{{detail.phone}}</text>
            </view>
            <view class="item-row flex j-c-s-b a-i-c">
                <text>事发地点</text>
                <text class="address">{{detail.scene}}</text>
            </view>
            <view class="item-row flex j-c-s-b a-i-c">
                <text>事发时间</text>
                <text class="address">{{detail.occurrenceTime}}</text>
            </view>

        </view>
        <view class="box bgc-ff" v-if="images.length">
            <view class="caption f-28">
                现场照片
            </view>
            <u-album :urls="images" singleSize="100" multipleSize="100"></u-album>
        </view>
        <view class="box bgc-ff" v-if="detail.remark">
            <view class="caption f-28 mb-20">
                事件简述
            </view>
            <view class="f-28">
                {{detail.remark}}
            </view>
        </view>
        <view class="box bgc-ff" v-if="detail.disRes">
            <view class="caption f-28 mb-20">
                处理结果
            </view>
            <view class="f-28">
                {{detail.disRes}}
            </view>
        </view>

    </view>
</template>

<script>
    import lineItem from '../components/lineItem.vue'
    import captionRow from '@/components/caption/caption.vue'
    import {
        checkReportForRepairsData,
        reportSave,
        getDetail,
        getEcallEventDetail
    } from '@/api/task/taskReportForRepairs.js'
    import {
        getPeopleType
    } from '@/api/user.js'
    import {
        minioBaseUrl
    } from "@/common/setting.js"
    import uploadMixin from "@/mixin/uploadMixin";
    export default {
        mixins: [uploadMixin],
        components: {
            captionRow,
            lineItem
        },
        data() {
            return {
                detail: {},

                typeList: [{
                        name: "公共维修",
                        type: 1
                    },
                    {
                        name: "居家维修",
                        type: 2
                    },
                    {
                        name: "矛盾纠纷",
                        type: 3
                    },
                    {
                        name: "投诉举报",
                        type: 4
                    },
                    {
                        name: "企业商户上报",
                        type: 5
                    }
                ],
                form: {
                    confirmFlag: '',
                    confirmNotion: '',
                    imageList: [],
                    videoList: []
                },
                defaultPlaceholder: "",
                defaultColums: 0,
                imgUrls: [],
                currentId: '',
                defaultData: {
                    taskRepairStepList: []
                },
                isPickerShow: false,
                columns: [
                    [{
                            name: "待处理",
                            status: 1
                        },
                        {
                            name: "处理中",
                            status: 2
                        },
                        {
                            name: "已处理",
                            status: 3
                        },
                    ]
                ],
                from: "list",
                peopleList: [
                    [{
                            name: "网格员",
                            type: 0
                        },
                        {
                            name: "物业人员",
                            type: 2
                        }
                    ],
                    []
                ],
                peopleIndex: [0, 0],
                isShowPeoplePicker: false,
                transferUserId: "",
                content: "",
                confirmFlag: "",
                images: []

            }
        },
        onLoad(option) {

            if (option.from) {
                this.from = option.from;
            }
            if (option.id) {
                this.getDetailInfo(option.id);
            }

        },
        onShow() {

            // this.setDefaultValue()
        },
        methods: {

            getDetailInfo(id) {
                getEcallEventDetail({
                    id
                }).then(res => {
                    if (res.code == 200) {
                        uni.setNavigationBarTitle({
                            title: res.data.name
                        })
                        let data = res.data;
                        this.defaultData = data;
                        this.confirmFlag = data.confirmFlag;
                        this.detail = data;
                        if (data.imageUrls) {
                            this.images = this.$setImageUrl(data.imageUrls);
                        }




                        // this.getPeopleList(0)
                        // this.setDefaultValue()
                    }
                })
            },





            setImgUrl(url) {
                return `${minioBaseUrl}${url}`
            },



            setDefaultValue() {
                console.log(this.defaultData);
                this.basicData.forEach(item => {
                    item.value = this.defaultData[item.name] || '未完善'
                    if (item.name === 'type') {
                        item.value = this.findObjValue(item.value, this.typeList, 'type').name || '未完善'
                    }
                })
                this.imgUrls = this.$setImageUrl(this.defaultData.imageUrls);
                //if(this.defaultData.imageUrls){
                // let list = this.defaultData.imageUrls.split(",")
                // let arr = []
                // for(let i of list){
                //     arr.push(`${minioBaseUrl}${i}`);
                // }
                //}

                let columns = this.columns[0]
                this.defaultColums = columns.findIndex(item => item.status == this.defaultData.confirmFlag)
                this.defaultPlaceholder = columns[this.defaultColums].name
            },


            getFileName(urls) {
                if (urls.length) {
                    let arr = [];
                    for (let i of urls) {
                        arr.push(i.name);
                    }
                    return arr.join(",");
                } else {
                    return ""
                }
            },




            findObjValue(value, obj, word) {
                const res = obj.find(item => {
                    return item[word] == value
                })
                return res
            },

            previewImg(url) {
                uni.previewImage({
                    urls: this.imgUrls,
                    current: url
                })
            },






        }
    }
</script>

<style lang="scss">
    page {
        background-color: #f5f5f5;
    }

    .container {
        padding: 0 20rpx 150rpx;

        .basic-box,
        .pic-box,
        .audit-box,
        .bottom {
            background-color: #fff;
            padding: 20rpx;
        }

        .pic-box {

            // margin-top: 20rpx;
            .pic-data {
                padding: 0 20rpx;
                display: flex;
                flex-wrap: wrap;
                margin-top: 20rpx;
            }
        }

        .audit-box {
            // margin-top: 20rpx;

            .audit-form {
                padding: 0 20rpx;

                .form {
                    font-size: 30rpx;

                    .form-item {
                        padding: 0 20rpx;

                        &:first-child {
                            border-bottom: 1rpx solid #f6f6ff;
                        }
                    }
                }
            }
        }

        .bottom {
            position: fixed;
            left: 0;
            bottom: 0;
            width: calc(100% - 40rpx);
            border-top: 1rpx solid #f6f6f6;
        }

        .title-box {
            display: flex;
            align-items: center;
            font-size: 30rpx;

            .line {
                width: 6rpx;
                height: 30rpx;
                margin-right: 10rpx;
                background-color: #017BFC;
            }

            .text {
                font-weight: 700;
            }
        }
    }

    /deep/ .u-form-item__body__left__content__label,
    /deep/ .uni-input-placeholder {
        font-size: 30rpx;
    }

    .footer {
        width: 100%;
        padding: 20rpx 30rpx;
        box-sizing: border-box;
        position: fixed;
        bottom: 0;
        left: 0;
        background-color: #fff;
        z-index: 10;
        padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
        z-index: 999;
        background-color: #fff;
        box-shadow: 0rpx 0rpx 10rpx 1rpx rgba(0, 0, 0, 0.1);

        .footer-btn {
            width: 300rpx;
            height: 78rpx;
            border-radius: 8rpx;
            font-size: 32rpx;
            color: #fff;
            border: none;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
        }

        .footer-btn:after {
            border: none;
        }

    }


    .upload {
        margin: 0 30rpx;
        padding: 30rpx;

        .upload-item {
            width: 140rpx;
            height: 140rpx;
            border: 1px solid #EEEEEE;
        }
    }

    .step {
        margin-top: 20rpx;
        padding: 0 20rpx;
    }

    .step-list {
        padding: 15rpx 0;
    }

    .status {
        flex: 1;
        text-align: right;
    }

    .item-row {
        width: 100%;
        padding: 30rpx;
        box-sizing: border-box;
        border-bottom: 1px solid #f5f5f5;
        font-size: 28rpx;
    }

    .address {
        width: 70%;
        text-align: right;
    }

    .box {
        padding: 20rpx 30rpx;
        margin-top: 20rpx;
    }
</style>