事件上报

guoshilong

2022-09-30 e96b9fa8c6d568c07801e232f3dfb789aa20db83

事件上报

 api/taskinfo/taskinfo.js

File was renamed from api/taskinfo/list.js
@@ -11,11 +11,19 @@
        }
    })
}

export const getDetail = (id) => {
    return http.request({
        url: '/taskInfo/taskinfo/detail',
        method: 'get',
        params: {
            id
        }
    })
}
export const update = (row) =>{
    return http.request({
        url:'/taskInfo/taskinfo/submit',
        method:'POST',
        data:row
    })
}
}

 pages.json

@@ -2,7 +2,8 @@
    "easycom": {
        "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue"
    },
    "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
    "pages": [
        //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
        {
            "path": "pages/login/login-account",
            "style": {
@@ -27,6 +28,20 @@
            }
        },
        {
            "path": "pages/home/home",
            "style": {
                "navigationBarTitleText": "主页",
                "enablePullDownRefresh": false
            }
        }, 
        {
            "path": "pages/taskinfo/detail",
            "style": {
                "navigationBarTitleText": "任务详情",
                "enablePullDownRefresh": false
            }
        },
        {
            "path": "pages/taskinfo/eventsReported",
            "style": {
                "navigationBarTitleText": "事件上报",
@@ -46,23 +61,27 @@
        "borderStyle": "white",
        "backgroundColor": "#ffffff",
        "list": [{
            "pagePath": "pages/service/service",
            "iconPath": "static/images/tabbar/home.png",
            "selectedIconPath": "static/images/tabbar/home_selected.png",
            "text": "首页"
        }, {
            "pagePath": "pages/demo/demo",
            "iconPath": "static/images/tabbar/demo.png",
            "selectedIconPath": "static/images/tabbar/demo_selected.png",
            "text": "示例"
        }, {
            "pagePath": "pages/user/center",
            "iconPath": "static/images/tabbar/user.png",
            "selectedIconPath": "static/images/tabbar/user_selected.png",
            "text": "我的"
        }]
                "pagePath": "pages/service/service",
                "iconPath": "static/images/tabbar/home.png",
                "selectedIconPath": "static/images/tabbar/home_selected.png",
                "text": "首页"
            },
            {
                "pagePath": "pages/demo/demo",
                "iconPath": "static/images/tabbar/demo.png",
                "selectedIconPath": "static/images/tabbar/demo_selected.png",
                "text": "示例"
            },
            {
                "pagePath": "pages/user/center",
                "iconPath": "static/images/tabbar/user.png",
                "selectedIconPath": "static/images/tabbar/user_selected.png",
                "text": "我的"
            }
        ]
    },
    "condition": { //模式配置，仅开发期间生效
    "condition": {
        //模式配置，仅开发期间生效
        "current": 0, //当前激活的模式(list 的索引项)
        "list": [{
            "name": "", //模式名称

 pages/service/service.vue

@@ -40,6 +40,11 @@
                        img: '/static/images/service/b5.png',
                        name: '维修任务',
                        url: ''
                    },
                    {
                        img: '/static/images/service/b1.png',
                        name: '事件上报',
                        url: ''
                    }
                ],
                // 服务列表

 pages/taskinfo/detail.vue

New file
@@ -0,0 +1,357 @@
<template>
    <view class="content">
        <u-top-tips ref="uTips"></u-top-tips>
        <map style="width: 100%; height: 30vh;" scale="14" :latitude="latitude" :longitude="longitude"
            :polyline="polyline">
            <!-- <cover-view class="dingwBut" @click="getSelfLocation">
                <cover-image src="../../static/images/taskinfo/map/img/dingwei.png"></cover-image>
            </cover-view> -->
        </map>
        <view id="Umain" style="height: 71%;z-index: 9999;">
            <view class="once-b">
                巡查详情
            </view>
            <view class="once">
                <span class="once-left">
                    巡查标题
                </span>
                <span class="once-right">
                    {{taskinfoData.title}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    巡查内容
                </span>
                <span class="once-right">
                    {{taskinfoData.content}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    开始时间
                </span>
                <span class="once-right">
                    {{taskinfoData.startTime}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    预计结束
                </span>
                <span class="once-right">
                    {{taskinfoData.endTime}}
                </span>
            </view>
            <view class="once">
                <span class="once-left">
                    状态
                </span>
                <span class="once-right">
                    {{taskinfoData.state == 0?'待开始':taskinfoData.state == 1?'正在进行':'已完成'}}
                </span>
            </view>
            <view class="once-c">
                <u-button type="success">开始任务</u-button>
            </view>
        </view>
    </view>
</template>

<script>
    import {
        getDetail
    } from "@/api/taskinfo/taskinfo"
    export default {
        data() {
            return {
                id: 0,
                taskinfoData: {},
                latitude: '',
                longitude: '',
                polyline: [{
                    // LINESTRING(115.91024735502 28.6783047633229, 115.916073731654 28.6741777439167, 
                    // 115.908426611165 28.6739956695312)
                    points: [
                        // {
                        //     latitude: 28.6783047633229,
                        //     longitude: 115.91024735502
                        // },
                        // {
                        //     latitude: 28.6741777439167,
                        //     longitude: 115.916073731654
                        // },
                        // {
                        //     latitude: 28.6739956695312,
                        //     longitude: 115.908426611165
                        // }
                    ],
                    color: "#10a4ff", //线的颜色
                    width: 10, //线的宽度
                    dottedLine: false, //是否虚线
                    arrowLine: false, //带箭头的线 开发者工具暂不支持该属性
                }]
            }
        },
        methods: {
            getSelfLocation() {
                var that = this;
                uni.getLocation({
                    type: 'gcj02',
                    isHighAccuracy: true,
                    success(res) {
                        that.latitude = res.latitude
                        that.longitude = res.longitude
                    }
                })
            },
            getTaskinfoDetail() {
                var _that = this
                getDetail(_that.id).then(res => {
                    _that.taskinfoData = res.data;
                    //处理地图路线 //
                    let routeRange = _that.taskinfoData.routeRange.replace('LINESTRING', '')
                        .replace('\(', '').replace('\)', '')
                    let ranges = routeRange.split(',')
                    for (var i = 0; i < ranges.length; i++) {
                        let postion = ranges[i].split(' ')
                        _that.polyline[0].points.push({
                            longitude: postion[0],
                            latitude: postion[1]
                        })
                    }
                    _that.longitude = _that.polyline[0].points[0].longitude
                    _that.latitude = _that.polyline[0].points[0].latitude
                })

            }
        },
        onLoad: function(options) {
            if (options.id) {
                this.id = options.id
                this.getTaskinfoDetail()
            }
        }
    }
</script>

<style lang="scss">
    .content {
        // flex: 1;
        // height: 100%;
        overflow: hidden;
        // position: relative;
    }

    #Umain {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        overflow: hidden;
    }

    .once {
        width: 100%;
        min-height: 40px;
        background-color: #fff;
        display: flex;
        align-items: center;
        /* margin-bottom: 10px; */
        border-bottom: 1px solid #e8e8e8;
        padding: 0 10px;
    }

    .once-left {
        width: 25%;
        text-align: justify;
        text-align-last: justify;
        padding-right: 20px;
        box-sizing: border-box;
    }

    .once-left::after {
        content: "：";
        position: absolute;
    }

    .once-right {
        width: calc(75% - 20px);
        height: auto;
        /* border: 1px solid red; */
        box-sizing: border-box;
        word-break: break-all;
    }

    .once-right span {
        display: inline-block;
        padding: 0px 5px 1px;
        margin: 0 5px;
        background-color: #ECF5FF;
        border: 0.5px solid #e4f1ff;
        color: #429FFF;
        border-radius: 8px;
    }

    .once-c {
        width: 100%;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 8px 0;
        background-color: #fff;
        position: absolute;
        bottom: 0;
    }

    .once-b {
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #fff;
        border-bottom: 1px solid #e8e8e8;
        /* margin-bottom: 10px; */
    }

    .submits {
        margin: 60rpx 90rpx 0;
        border: none;
        width: 572rpx;
        height: 86rpx;
        // line-height: 86rpx;
        box-sizing: border-box;
        border-radius: 15rpx;
        background-color: #103289;
        color: #ffffff;

        &::after {
            content: none;
        }

        &::before {
            content: none;
        }

        &[disabled='true'] {
            background: #e4e4e4;
            font-size: 36rpx;
            font-family: Source Han Sans CN;
            font-weight: 500;
            color: #ffffff;
        }
    }


    .Info2 {
        width: 100%;
        // height: 100px;
        padding: 0 10px;

        .Info3 {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 50px;
        }

        .Info4 {
            width: 100%;
            line-height: 50px;
            font-size: 18px;
            text-align: center;
            height: 50px;
        }

        .Info5 {
            margin-bottom: 10px !important;
            width: 70%;
        }
    }

    .notOpens {
        &::after {
            content: "";
            display: block;
            width: 20px;
            height: 4px;
            background-color: rgba(202, 202, 202, 1);
            position: absolute;
            top: 10px;
            left: calc(50% - 10px);
            border-radius: 5px;
            transition: all 0.1s;
        }
    }

    .activeTip {
        background-color: #fff;
    }

    .isOpens {
        &::after {
            content: "";
            display: block;
            width: 13px;
            height: 4px;
            background-color: rgba(202, 202, 202, 1);
            position: absolute;
            top: 10px;
            left: calc(50% - 12px);
            border-radius: 5px;
            transform: rotate(30deg);
            transition: all 0.1s;
        }

        &::before {
            content: "";
            display: block;
            width: 13px;
            height: 4px;
            background-color: rgba(202, 202, 202, 1);
            position: absolute;
            top: 10px;
            left: calc(50% - 4px);
            border-radius: 5px;
            transform: rotate(-30deg);
            transition: all 0.1s;
        }
    }

    .dingwBut {
        width: 80upx;
        height: 80upx;
        background-color: #fff;
        border-radius: 20upx;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        bottom: 40upx;
        right: 40upx;
    }

    .oncePotion {
        animation: mymove 0.5s infinite;
        animation-timing-function: linear;
    }

    .dingwButtip {
        bottom: 120 upx;
        background-color: transparent;
        color: #000000;
    }

    @keyframes mymove {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(1turn);
        }
    }
</style>

 pages/taskinfo/list.vue

@@ -10,7 +10,7 @@
            <scroll-view scroll-y :style="{ height: useHeight, width: '100%' }" @scrolltolower="scrolltolower">
                <view class="onveMain">
                    <view class="once" v-for="(item, index) in taskinfoList" :key="index">
                        <view class="onve-left">
                        <view class="onve-left" @click="goToDetail(item.id)">
                            <!-- <view class="o-l-img">
                                <image src="" mode=""></image>
                            </view> -->
@@ -47,7 +47,7 @@
<script>
    import {
        getList,update
    } from "@/api/taskinfo/list.js";
    } from "@/api/taskinfo/taskinfo";
    export default {
        data() {
            return {
@@ -104,6 +104,12 @@
                    this.taskinfoList = this.taskinfoList.concat(data.records)
                })
            },
            // 跳转详情页
            goToDetail(id) {
                uni.navigateTo({
                    url: '/pages/taskinfo/detail?id=' + id
                })
            },
            //任务开始事件
            startTask(item){
                item.state = '1'

 static/images/taskinfo/map/img/dingwei.png

 static/images/taskinfo/map/img/dinw/dinw1.png

 static/images/taskinfo/map/img/dinw/dinw2.png

 static/images/taskinfo/map/img/dinw/dinw3.png

 static/images/taskinfo/map/img/dinw/dinw4.png

 static/images/taskinfo/map/img/dinw/dinw5.png

 static/images/taskinfo/map/img/dinw/dinw6.png

 static/images/taskinfo/map/img/dinw/location.png

 utils/func.js

@@ -7,8 +7,7 @@
        vm.$u.vuex('accessToken', userInfo.access_token)
        vm.$u.vuex('isLogin', true)
        uni.switchTab({
            // url: '/pages/home/home'
            url:'/pages/service/service'
            url: '/pages/service/service'
        })
    }