E呼即办事件分享

linwe

2024-06-14 0e7b3d2053fbde9074ff770a0a31e05fe8fc0cc6

E呼即办事件分享

 api/task/ecall.js

New file
@@ -0,0 +1,83 @@
import http from '@/http/api.js'



export const getPage = (params) => {
    return http.request({
        url: '/blade-eCallEventTwo/eCallEventTwo/page',
        method: 'GET',
        params: {
            ...params
        }
    })
}


export const getDetail = (params) => {
    return http.request({
        url: '/blade-eCallEventTwo/eCallEventTwo/detail',
        method: 'GET',
        params: {
            ...params
        }
    })
}


//添加
export const save = (data) => {
    return http.request({
        url: '/blade-taskReportForRepairs/taskReportForRepairs/save',
        method: 'POST',
        data: data
    })
}

export const checkReportForRepairsData = (data) => {
    return http.request({
        url: 'blade-taskReportForRepairs/taskReportForRepairs/checkReportForRepairs ',
        method: 'POST',
        data
    })
}

//报事报修数据统计
export const getRepairsStatistics = (params) => {
    return http.request({
        url: 'blade-taskReportForRepairs/taskReportForRepairs/getStatistics',
        method: 'GET',
        params: {
            ...params
        }
    })
}
//报事报修数据统计  (数据驾驶舱)
export const getReportStatistics = (params) => {
    return http.request({
        url: 'blade-taskReportForRepairs/taskReportForRepairs/getReportForStatistics',
        method: 'GET',
        params: {
            ...params
        }
    })
}

//报事报修处理
export const reportSave = (data) => {
    return http.request({
        url: 'blade-task/taskRepairStep/save',
        method: 'POST',
        data
    })
}

//获取e呼即办详情
export const getEcallEventDetail = (params) => {
    return http.request({
        url: 'blade-eCallEvent/eCallEvent/detail',
        method: 'GET',
        params: {
            ...params
        }
    })
}

 subPackage/ecall/detail.vue

New file
@@ -0,0 +1,620 @@
<template>
    <view class="container">
        <view class="">
            <view>
                <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
                <u--form labelPosition="left" :model="from" ref="uForm">
                    <u-form-item label="姓名" prop="applicantName" borderBottom ref="item1">
                        <u--input :disabled="true" inputAlign="center" v-model="from.applicantName"
                            border="none"></u--input>
                    </u-form-item>

                    <u-form-item labelWidth="80" label="手机" prop="applicantPhone" borderBottom ref="item1">
                        <u--input :disabled="true" inputAlign="center" v-model="from.applicantPhone"
                            border="none"></u--input>
                    </u-form-item>

                    <u-form-item labelWidth="80" label="事发地" prop="sceneAddr" borderBottom ref="item1">
                        <u--input :disabled="true" inputAlign="center" v-model="from.sceneAddr"
                            border="none"></u--input>
                    </u-form-item>


                    <u-form-item labelWidth="80" label="时间" prop="createTime" borderBottom ref="item1">
                        <u--input inputAlign="center" v-model="from.createTime" border="none"></u--input>
                    </u-form-item>

                    <u-form-item labelWidth="80" label="调度单位" prop="acptOrgName" borderBottom ref="item1">
                        <u--input :disabled="true" inputAlign="center" v-model="from.acptOrgName"
                            border="none"></u--input>
                    </u-form-item>

                    <u-form-item labelWidth="80" label="问题标题" prop="issueTitle" borderBottom ref="item1">
                        <u--input :disabled="true" inputAlign="center" v-model="from.issueTitle"
                            border="none"></u--input>
                    </u-form-item>

                    <u-form-item labelWidth="80" label="问题描述" prop="issueContent" borderBottom ref="item1">
                        <!-- <u--input v-model="from.issueContent" border="none"></u--input> -->
                        <u--textarea :disabled="true" v-model="from.issueContent" autoHeight
                            placeholder="请输入内容"></u--textarea>
                    </u-form-item>
                </u--form>
            </view>
        </view>

        <view class="footer flex a-i-c j-c-s-b" v-if="!types">
            <!-- <button class="footer-btn" @click="submit(0)">处置</button> -->
            <button class="footer-btn" @click="submit(2)">共享</button>
            <!-- <button class="footer-btn" @click="submit(1)">转办</button> -->
        </view>
        <u-picker :defaultIndex="[defaultColums]" :closeOnClickOverlay="true" @close="isPickerShow = false"
            :show="isPickerShow" ref="uPicker" :columns="columns" keyName="name" @cancel="isPickerShow = false"
            @confirm="handleConfirm"></u-picker>

        <u-picker :defaultIndex="peopleIndex" :closeOnClickOverlay="true" @close="isShowPeoplePicker = false"
            :show="isShowPeoplePicker" ref="pPicker" :columns="peopleList" keyName="name"
            @cancel="isShowPeoplePicker = false" @confirm="handlePeopleConfirm" @change="changePeople"></u-picker>

        <u-popup :show="show" mode="bottom" @close="close" :round="10" :closeable="true">
            <view class="popup-title">
                共享
            </view>
            <view style="margin-top: 20rpx 0rpx;" class="popup-content">
                <u-checkbox-group v-model="radiovalue1" @change="groupChange" iconPlacement="right" placement="column">
                    <view v-for="(item, index) in radiolist1" style="padding:10rpx 0;">
                        <u-checkbox :customStyle="{marginBottom: '8px'}" :key="index" :label="item.name" :name="item.id"
                            @change="radioChange">
                        </u-checkbox>
                    </view>
                </u-checkbox-group>
                <view class="popup-btn flex a-i-c j-c-s-b">
                    <button class="popup-btn-item" @click="pushCircle">确认</button>
                </view>
            </view>
        </u-popup>
    </view>
</template>

<script>
    import {
        getDetail
    } from '@/api/task/ecall.js'
    import {
        getPeopleType
    } from '@/api/user.js'
    import {
        handlePublish
    } from '@/api/circle/circle.js'
    import {
        minioBaseUrl
    } from "@/common/setting.js"
    import uploadMixin from "@/mixin/uploadMixin";
    export default {
        mixins: [uploadMixin],
        components: {
            // captionRow,
            // lineItem
        },
        data() {
            return {
                basicData: [{
                        label: '事发地',
                        name: 'address',
                        value: '未完善'
                    },
                    {
                        label: '姓名',
                        name: 'realName',
                        value: '未完善'
                    },
                    {
                        label: '手机号码',
                        name: 'phone',
                        value: '未完善'
                    },
                    {
                        label: '事件类型',
                        name: 'type',
                        value: '未完善'
                    },
                    {
                        label: '事件描述',
                        name: 'remark',
                        value: '未完善'
                    },
                    {
                        label: '提交时间',
                        name: 'createTime',
                        value: '未完善'
                    }
                ],
                typeList: [{
                        name: "公共维修",
                        type: 1
                    },
                    {
                        name: "居家维修",
                        type: 2
                    },
                    {
                        name: "矛盾纠纷",
                        type: 3
                    },
                    {
                        name: "投诉举报",
                        type: 4
                    },
                    {
                        name: "企业商户上报",
                        type: 5
                    },
                    {
                        name: "统战上报",
                        type: 6
                    }
                ],
                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: {},
                peopleList: [
                    [{
                            name: "网格员",
                            type: 0
                        },
                        {
                            name: "物业人员",
                            type: 2
                        }
                    ],
                    []
                ],
                // 基本案列数据
                radiolist1: [{
                        name: '邻里圈',
                        disabled: false,
                        id: 0
                    },
                    {
                        name: '协同圈',
                        disabled: false,
                        id: 1
                    }
                ],
                // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
                radiovalue1: [],
                peopleIndex: [0, 0],
                isShowPeoplePicker: false,
                transferUserId: "",
                content: "",
                confirmFlag: "",
                show: false,
                types: ''

            }
        },
        onLoad(option) {
            // const { id } = option
            // this.currentId = id

            if (option.id) {
                this.getEcallDetail(option.id)
            }
            if (option.types) {
                this.types = option.types
            }
        },
        onShow() {},
        methods: {
            getEcallDetail(id) {
                getDetail({
                    id: id
                }).then(res => {
                    this.from = res.data;
                })
            },
            pushCircle() {
                this.radiovalue1.forEach(item => {
                    let data = {
                        eventId: this.from.id,
                        evenType: 3,
                        circleType: item,
                        circleText: this.from.issueContent,
                    }
                    handlePublish(data).then(res => {
                        this.$showTips("操作成功", "success")
                        this.close()
                    })
                })
            },
            close() {
                this.show = false
            },
            groupChange(n) {
                console.log('groupChange', n);
            },
            radioChange(n) {
                console.log('radioChange', n);
            },
            getPeopleList(type) {
                getPeopleType({
                    houseCode: this.defaultData.addressCode,
                    type
                }).then(res => {
                    console.log(res);
                    this.$set(this.peopleList, 1, res.data);
                })
            },

            showPicker() {
                if (this.from == "list") {
                    this.isPickerShow = true;
                }
            },

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

            async checkReportForRepairs() {
                const {
                    confirmFlag,
                    confirmNotion
                } = this.form

                if (!confirmNotion) {
                    uni.showToast({
                        title: "请输入处理情况",
                        icon: "none"
                    })
                    return;
                }

                const res = await checkReportForRepairsData({
                    // id: this.currentId,
                    id: this.defaultData.id,
                    // confirmFlag: this.findObjValue(confirmFlag, this.columns[0], 'name').status,
                    confirmFlag: 3,
                    confirmNotion
                })

                if (res.code !== 200) {
                    uni.showToast({
                        title: "提交处理失败",
                        icon: "error"
                    })
                    return
                }

                uni.showToast({
                    title: "处理事件成功",
                    icon: "success",
                    duration: 1500,
                    complete() {
                        setTimeout(() => {
                            uni.navigateBack()
                        }, 1500)
                    }
                })
            },

            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
            },

            submit(type) {
                if (type == 1) {
                    this.isShowPeoplePicker = true;
                } else if (type == 2) {
                    this.show = true
                } else {
                    if (!this.form.confirmNotion) {
                        uni.showToast({
                            title: "请输入处理情况",
                            icon: "none"
                        })
                        return;
                    }

                    let data = {
                        confirmFlag: 3,
                        content: this.form.confirmNotion,
                        imageList: this.getFileName(this.form.imageList),
                        mobile: this.defaultData.mobile,
                        peopleType: 0,
                        repairId: this.defaultData.id,
                        videoList: this.getFileName(this.form.videoList)
                    }
                    this.submitRequest(data)
                }
                // this.checkReportForRepairs()
            },

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


            submitRequest(data) {
                reportSave(data).then(res => {
                    if (res.code == 200) {
                        uni.showToast({
                            title: "操作成功"
                        })
                        uni.navigateBack()
                    }
                })
            },

            handleConfirm(e) {
                this.form.confirmFlag = e.value[0].name
                this.isPickerShow = false
            },
            findObjValue(value, obj, word) {
                const res = obj.find(item => {
                    return item[word] == value
                })
                return res
            },

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


            changePeople(e) {
                console.log(e);
                const {
                    columnIndex,
                    value,
                    values, // values为当前变化列的数组内容
                    index,
                    // 微信小程序无法将picker实例传出来，只能通过ref操作
                    picker = this.$refs.pPicker
                } = e
                if (columnIndex === 0) {
                    // picker为选择器this实例，变化第二列对应的选项
                    // picker.setColumnValues(1, this.columnData[index])
                    this.getPeopleList(value[0].type)
                }
            },

            handlePeopleConfirm(e) {
                console.log(e)
                let {
                    value,
                    indexs
                } = e;
                this.transferUserId = value[1].id
                this.peopleIndex = indexs;
                // this.content = `事件已移交至${value[0].distictName}${value[1].distictName}`
                let data = {
                    addressCode: this.defaultData.addressCode,
                    confirmFlag: 1,
                    content: `事件已移交至${value[0].name}${value[1].name}`,
                    peopleType: 1,
                    repairId: this.defaultData.id,
                    transferUserId: value[1].id
                }
                console.log(data);
                this.submitRequest(data)
            },

        }
    }
</script>

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

    .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: 80%;
            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;
    }

    .popup-title {
        padding: 20rpx 0;
        text-align: center;

    }

    .popup-content {
        padding: 20rpx;
    }

    .popup-btn {
        padding: 20rpx;


        .popup-btn-item {
            width: 100%;
            height: 78rpx;
            line-height: 78rpx;
            border-radius: 36rpx;
            color: #fff;
            background: linear-gradient(163deg, #01BDFC 0%, #017BFC 100%);
            font-size: 28rpx;
        }

        .popup-btn-item:after {
            border: none;
        }
    }
</style>

 subPackage/ecall/index.vue

New file
@@ -0,0 +1,271 @@
<template>
    <view>
        <u-sticky>
            <view class="hander">
                <view class="tab">
                    <!-- <u-tabs :list="tabList" :scrollable="false" :current="tabIndex" @click="changeTab"
                        :inactiveStyle="{color:'#999999'}" :activeStyle="{color:'#017BFC'}">
                    </u-tabs> -->
                    <view class="search flex j-c-s-b a-i-c">
                        <view class="tab-filter flex j-c-c a-i-c" @click="showDateModal">
                            <text class="f-28">时间筛选</text>
                            <u-icon name="arrow-down"></u-icon>
                        </view>
                        <u-search placeholder="请输入需要查询信息的姓名" v-model="keyWord" :clearabled="true" :showAction="true"
                            :animation="true" @search="searchConfirm" @clear="clearConfirm"></u-search>
                    </view>
                </view>
            </view>
        </u-sticky>
        <view class="list">
            <view class="list-item bgc-ff mb-20" v-for="item in reportList" :key="item.id" @click="pushPage(item)">
                <!-- <view class="item-title flex a-i-c j-c-s-b mb-20">
                    <text class="f-32 fw">{{ findObjValue(item.type, typeList, 'type').name }}</text>
                    <u-tag class="u_tag" size="mini" plain plainFill
                        :text="findObjValue(item.confirmFlag, tabList, 'status').name"
                        :type="findObjValue(item.confirmFlag, tabList, 'status').type"></u-tag>
                </view> -->
                <view class="item-row flex a-i-c j-c-s-b">
                    <text class="f-28">姓名</text>
                    <text class="f-28 c-66">{{ item.applicantName }}</text>
                </view>
                <view class="item-row flex a-i-c j-c-s-b">
                    <text class="f-28">手机</text>
                    <text class="f-28 c-66">{{ item.applicantPhone }}</text>
                </view>
                <view class="item-row flex a-i-c j-c-s-b">
                    <text class="f-28">事发地</text>
                    <text class="address f-28 c-66">{{ item.sceneAddr || "" }}</text>
                </view>
                <view class="item-row flex a-i-c j-c-s-b f-28">
                    <text>时间</text>
                    <text class="c-66">{{item.createTime}}</text>
                </view>
            </view>
        </view>
        <u-loadmore :status="loadingStatus" loadmoreText="开始加载" loadingText="数据加载中" nomoreText="没有更多了" line />
        <date-range-modal ref="dateRane" @comfirm="handleComfirmDate" @rest="handleRestDate" />
    </view>
</template>

<script>
    import {
        getPage
    } from '@/api/task/ecall.js'
    import dateRangeModal from '@/components/dateRangeModal/modal.vue';
    export default {
        components: {
            dateRangeModal
        },
        data() {
            return {
                reportList: [],
                pagingParams: {
                    current: 1,
                    size: 10
                },
                tabList: [

                    {
                        name: "全部",
                        status: "",
                    },
                    {
                        name: "待处理",
                        status: 1,
                        type: 'warning'
                    },
                    {
                        name: "处理中",
                        status: 2,
                        type: 'success'
                    },
                    {
                        name: "已处理",
                        status: 3,
                        type: 'success'
                    },
                ],
                typeList: [{
                        name: "公共维修",
                        type: 1
                    },
                    {
                        name: "居家维修",
                        type: 2
                    },
                    {
                        name: "矛盾纠纷",
                        type: 3
                    },
                    {
                        name: "投诉举报",
                        type: 4
                    },
                    {
                        name: "企业商户上报",
                        type: 5
                    },
                    {
                        name: "统战上报",
                        type: 6
                    }
                ],
                tabIndex: 0,
                tabStatus: "",
                keyWord: '',
                loadingStatus: 'nomore',
                selectDate: [],
                houseCode: ""
            }
        },

        onLoad(option) {
            if (option.from) {
                this.tabIndex = 1;
                this.tabStatus = 1;
            }
            if (option.code) {
                this.houseCode = option.code;
            }
        },

        onShow() {
            this.currentRole = uni.getStorageSync("activeRole")
            this.reportList = []
            this.pagingParams.current = 1;
            this.getPageList()
        },
        onReachBottom() {
            this.pagingParams.current++
            this.getPageList()
        },
        methods: {
            async getPageList() {
                this.loadingStatus = 'loadingmore'
                const params = {
                    realName: this.keyWord,
                    confirmFlag: this.tabStatus
                }
                if (this.selectDate.length) {
                    params.startTime = this.selectDate[0]
                    params.endTime = this.selectDate[1]
                }
                if (this.houseCode) {
                    params.addressCode = this.houseCode;
                }
                const {
                    roleName
                } = this.currentRole
                const res = await getPage({
                    ...params,
                    roleName,
                    ...this.pagingParams
                })
                const {
                    code,
                    data: {
                        records
                    }
                } = res
                if (code !== 200) {
                    uni.showToast({
                        title: '数据请求失败',
                        icon: 'error'
                    })
                    return
                }
                this.reportList = [...this.reportList, ...records]
                this.loadingStatus = 'nomore'
            },
            changeTab(e) {
                this.tabStatus = e.status;
                this.resetParams()
                this.getPageList()
            },
            searchConfirm() {
                this.resetParams()
                this.getPageList()
            },
            clearConfirm() {
                this.keyWord = ''
                this.searchConfirm()
            },
            resetParams() {
                this.reportList = []
                this.pagingParams.current = 1
            },
            findObjValue(value, obj, word) {
                const res = obj.find(item => {
                    return item[word] == value
                })
                return res
            },
            pushPage(item) {
                // const data = JSON.stringify(item)
                // uni.setStorageSync("ecallDetail", item)
                this.$u.func.globalNavigator('/subPackage/ecall/detail?id=' + item.id)
            },

            showDateModal() {
                this.$refs.dateRane.open();
            },

            handleRestDate() {
                this.selectDate = [];
                this.resetParams();
                this.getPageList()
            },
            handleComfirmDate(val) {
                this.selectDate = val;
                this.resetParams();
                this.getPageList()
            }
        }
    }
</script>

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

    .hander {
        background-color: #fff;

        .tab {
            width: 100%;
        }

        .tab-filter {
            padding: 0 20rpx;
        }

        .search {
            padding: 20rpx 30rpx;
        }
    }

    .list {
        margin: 20rpx 30rpx 0;
    }

    .list-item {
        padding: 0 30rpx 20rpx;
        border-radius: 8rpx;

        .item-title {
            padding: 30rpx 0;
            border-bottom: 1px solid #F5F5F5;
        }

        .item-row {
            padding: 10rpx 0;

            .address {
                width: 75%;
                text-align: right;
            }
        }
    }
</style>