隐患举报增加页面

叶松

2023-11-08 bac982d78843150c2637b7334c32b583350d1e85

隐患举报增加页面

 xcx/api/module/robeSystem.js

@@ -268,4 +268,23 @@
    //获取宿舍人头
    getDormNumsLists: (params) =>
        axios.post('/staff/dorm/findUserList', params),
		
    /*
    *隐患举报模块
    */
    //查询隐患列表
    searchHiddenLists: (params) =>
        axios.post('/secure/hiddendanger/selectPageList', params),
    //添加隐患举报
    addHiddenInfo: (params) =>
        axios.post('/secure/hiddendanger/insert', params),
    //修改隐患举报
    updateHiddenInfo: (params) =>
        axios.post('/secure/hiddendanger/update', params),
    //删除隐患举报
    deleteHiddenInfo: (params) =>
        axios.get('/secure/hiddendanger/delete?id='+params),
    //隐患举报详情
    detailsHiddenInfo: (params) =>
        axios.get('/secure/hiddendanger/selectInfo?id='+params),
}

 xcx/api/module/system.js

@@ -22,8 +22,13 @@
            },
        }),
    // 获取分公司信息
    getCompanyData: () =>
        axios.post('/engineering/company/pulldown'),
    getCompanyData: (params) =>
        axios.post('/engineering/company/pulldown',{
            header: {
                "content-type":'application/json'
            },
            ...params
        }),
    // 获取岗位信息
    getPositionData: (params) =>
        axios.post('/staff/position/findall', params),

 xcx/pages.json

@@ -237,6 +237,38 @@
                    }
                },
                {
                    "path":"safeManage/areaPolling",
                    "style": {
                        "navigationBarTitleText": "区域巡检",
                        "navigationBarBackgroundColor": "#1976FF",
                        "navigationBarTextStyle": "white"
                    }
                },
                {
                    "path":"safeManage/hiddenReport",
                    "style": {
                        "navigationBarTitleText": "隐患举报",
                        "navigationBarBackgroundColor": "#1976FF",
                        "navigationBarTextStyle": "white"
                    }
                },
                {
                    "path": "safeManage/addHidden",
                    "style": {
                        "navigationBarTitleText": "添加",
                        "navigationBarBackgroundColor": "#1976FF",
                        "navigationBarTextStyle": "white"
                    }
                },
                {
                    "path": "safeManage/detailsHidden",
                    "style": {
                        "navigationBarTitleText": "详情",
                        "navigationBarBackgroundColor": "#1976FF",
                        "navigationBarTextStyle": "white"
                    }
                },
                {
                    "path": "dataBoard/productMonitor",
                    "style": {
                        "navigationBarTitleText": "生产监控",

 xcx/pages/robeHome/index.vue

@@ -216,6 +216,13 @@
                    border-radius: 10rpx;
                    margin-bottom: 20rpx;
                    background-color: #FFFFFF;
                    &:nth-child(3){
                        .users_content{
                            .users_menu{
                                margin-left: -30px;
                            }
                        }
                    }
                    .users_title{
                        height: 8vh;
                        display: flex;

 xcx/robePages/safeManage/addHidden.vue

对比新文件
@@ -0,0 +1,191 @@
<template>
    <view class="check_add_index">
        <u-form
            ref="form"
            :model="formCheck"
            :rules="rulesCkeck"
            labelWidth="auto"
            labelPosition="left">
            <view style="overflow: auto;width: 100%;background-color: #FFFFFF;" class="upload_items items_tyle">
                <u-form-item label="问题照片">
                    <u-upload
                        :fileList="formCheck.imageList"
                        @afterRead="afterRead"
                        @delete="deleteImage"
                        name="66"
                        :previewFullImage="true"
                        :maxCount="6"
                        width="150"
                        height="150">
                        <image src="https://pipe.thhy-tj.com/group1/M00/00/02/bx5d1GSihuWAA-kBAAAICqDtUn8566.png" mode="widthFix" style="width:64px;height: 100px;display: flex;justify-content: center;"></image>
                        <view style="text-align: center;font-size: 16px;color: #666666;">上传照片</view>
                    </u-upload>
                </u-form-item>
            </view>
            <u-form-item
                    label="隐患地点"
                    prop="dangerLocation"
                    borderBottom>
                <u-input
                    v-model="formCheck.dangerLocation"
                    placeholder="请输入隐患地点"
                    border="none">
                </u-input>
            </u-form-item>
            <view class="items_tyle">
                <u-form-item
                    label="隐患标题"
                    prop="title"
                    borderBottom>
                    <u--textarea v-model="formCheck.title" placeholder="请输入隐患标题" height="100"></u--textarea>
                </u-form-item>
            </view>
        </u-form>
        <view class="submit_bnt">
            <u-button type="primary" color="#1976FF" text="提交" @click="submitInsertForm()"></u-button>
        </view>
        <u-picker 
            :show="showUser" 
            :columns="userColumns" 
            keyName="realName"
            @cancel="showUser = false"
            @confirm="selectCompany">
        </u-picker>
    </view>
</template>

<script>
    import { throttle } from '../../plugins/public.js';
    import { basrUrl } from '@/api/http';
    export default{
        data(){
            return{
                showUser: false,//整改人弹框显隐
                formCheck:{
                    imageList:[],//上传图片
                    userId:'',//整改人
                },
                rulesCkeck: {
                    dangerLocation: [{
                        required: true,
                        message: '请输入隐患地点',
                        trigger: 'blur'
                    }],
                    title: [{
                        required: true,
                        message: '请输入隐患标题',
                        trigger: 'blur'
                    }],
                }
            }
        },
        onLoad(option) {
        },
        methods:{
            //提交按钮
            submitInsertForm: throttle(function() {
                this.$refs.form.validate().then((valid) => {
                    if(valid) {
                        const params = Object.assign({}, this.formCheck);
                        params.imgEntities = this.formCheck.imageList.map(item=>{
                            return {
                                imgPath:item.data,
                            }
                        });
                        delete params.userId
                        delete params.imageList;
                        this.$api.reboSystem.addHiddenInfo(params).then((res) => {
                            if(res.success) {
                                uni.$u.toast("提交成功！");
                                uni.redirectTo({
                                    url: './hiddenReport'
                                });
                            } else {
                                uni.$u.toast(res.statusMsg);
                            }
                        })
                    }
                })
            }, 3000),
            // 读取图片后
            afterRead(event) {
                this.formCheck.imageList.push({
                    status: 'loading',
                    message: '上传中',
                })
                uni.uploadFile({
                    url: `${basrUrl}/file/file/upload`,
                    fileType: event.file.type,
                    filePath: event.file.url,
                    name: 'file',
                    success: (res) => {
                        const data = JSON.parse(res.data);
                        console.log(data,event,'名字')
                        this.$set(this.formCheck.imageList, this.formCheck.imageList.length - 1, {
                            id: this.formCheck.imageList.length + 1,
                            status: 'success',
                            message: '',
                            data: data.data,
                            url: `https://pipe.thhy-tj.com/${data.data}`
                        })
                    },
                    fail: (error) => {
                        uni.$u.toast('上传失败！');
                    }
                })
            },
            // 删除图片
            deleteImage(event) {
                this.$nextTick(() => {
                    this.formCheck.imageList.splice(event.index, 1);
                })
            },
        }
    }
</script>

<style lang="scss" scoped>
    .check_add_index{
        background-color: #F6F6F6;
        padding: 0 15px;
        position: relative;
        height: 100vh;
        overflow: hidden;
    }
    .submit_bnt {
        position: absolute;
        bottom: 5%;
        width: calc(100% - 30px);
    }
	
	
    ::v-deep .u-input__content__field-wrapper__field {
        text-align: right !important;
    }
    ::v-deep .u-form-item{
        margin: 15px 0;
        padding: 0 10px;
        background-color: #FFFFFF;
        line-height: 40px;
        border-radius: 4px;
    }
    ::v-deep .u-upload{
        flex: none !important;
        justify-content: center;
        align-items: center;
    }
    ::v-deep .u-textarea{
        background-color: #EFEFEF !important;
        color: #999999 !important;
    }
	
</style>
<style scoped>
    .items_tyle /deep/.u-form-item__body{
        flex-direction: column !important;
    }
    .upload_items /deep/.u-upload__wrap{
        flex-wrap: nowrap;
        align-items: center;
    }
</style>

 xcx/robePages/safeManage/areaPolling.vue

对比新文件
@@ -0,0 +1,11 @@
<template>
    <view class="areaPolling">
        区域巡检
    </view>
</template>

<script>
</script>

<style>
</style>

 xcx/robePages/safeManage/detailsHidden.vue

对比新文件
@@ -0,0 +1,106 @@
<template>
    <view class="check_details_index">
        <view class="check_details_matter">
            <view class="check_details_card" >
                <view class="hidden_text">问题照片</view>
                <view class="check_details_phone hidden_datas" v-for="(item,index) in hiddenPhone">
                    <!-- <u-image :src="`https://pipe.thhy-tj.com/${item.imgPath}`" ></u-image> -->
                    <u-album :urls="[`https://pipe.thhy-tj.com/${item.imgPath}`]"></u-album>
                </view>
            </view>
            <view class="check_details_card">
                <view class="hidden_text">举报时间</view>
                <view class="hidden_datas">{{hiddenDetails.createTime}}</view>
            </view>
            <view class="check_details_card">
                <view class="hidden_text">隐患地点</view>
                <view class="hidden_datas">{{hiddenDetails.dangerLocation}}</view>
            </view>
            <view class="check_details_card">
                <view class="hidden_text">隐患标题</view>
                <view class="hidden_datas">{{hiddenDetails.title}}</view>
            </view>
        </view>
    </view>
</template>

<script>
    export default{
        data(){
            return{
                hiddenDetails:[],//隐患举报详情
                hiddenPhone:[],//隐患举报图片
            }
        },
        onLoad(option) {
            this.getDetailsInfo(option.id)
        },
        methods:{
            //获取信息详情
            getDetailsInfo(val){
                this.$api.reboSystem.detailsHiddenInfo(val).then(res=>{
                    if(res.statusMsg === 'ok'){
                        this.hiddenDetails = res.data
                        this.hiddenPhone = res.data.imgEntities
                    }else{
                        uni.$u.toast(res.statusMsg);
                    }
                })
            }
        }
    }
</script>

<style lang="scss" scoped>
    .check_details_index{
        height: 100vh;
        overflow: hidden;
        background-color: #F6F6F6;
        padding: 15px;
		
        .check_details_matter{
            height: calc(100vh - 112px);
            background-color: #FFFFFF;
            border-radius: 6px;
			
            .check_details_card{
                padding: 15px 10px;
                display: flex;
                justify-content: space-between;
				
                .hidden_text{
                    color: rgba(153, 153, 153, 1);
                    font-size: 16px;
                    flex: none;
                }
                .hidden_datas{
                    color: rgba(51, 51, 51, 1);
                    font-size: 15px;
                    text-align: left;
                    flex: 1;
                    margin-left: 15px;
                }
            }
            .check_details_contents{
                height: calc(100% - 460px);
                margin: 15px;
                padding: 15px;
                display: flex;
                // align-items: center;
                background-color: #F6FAFF;
                color:#666666 ;
            }
            .check_details_phone{
                margin-top: 5px;
                margin-left: 15px;
                display: flex;
                justify-content: center;
                overflow: auto;
            }
        }
    }
    ::v-deep image{
        width: 320px!important;
        height: 240px!important;
    }
</style>

 xcx/robePages/safeManage/hiddenReport.vue

对比新文件
@@ -0,0 +1,290 @@
<template>
    <view class="check_index">
        <view class="check_select">
            <view @click="startClick()">
                <u--input placeholder="举报起始时间" disabled disabledColor="#FFFFFF" placeholderStyle="color:#999999;padding-left:10px"  v-model="search.startTime" border="none" suffixIcon="calendar" suffixIconStyle="color: #666666;font-size:30px;"></u--input>
            </view>
            <view @click="endClick()">
                <u--input placeholder="举报截止时间" disabled disabledColor="#FFFFFF"  placeholderStyle="color:#999999;padding-left:10px" v-model="search.endTime" border="none" suffixIcon="calendar" suffixIconStyle="color: #666666;font-size:30px;"></u--input>
            </view>
            <view style="width:60px">
                <u-button type="primary" color="#1977FF" text="查询" @click="searchCheckList()"></u-button>
            </view>
        </view>
        <view class="hidden_add">
            <u-button type="primary" color="#1977FF" text="添加" @click="goAddHidden()"></u-button>
        </view>
        <view class="check_main">
            <scroll-view
                scroll-y="true"
                class="check_index_scroll"
                :scroll-top="scrollTop" 
                refresher-enabled="true" 
                refresher-background="#EAEAEA"
                :refresher-triggered="triggered" 
                @refresherpulling="refresherrefresh"
                @scrolltolower="scrolltoLower">
                <view class="check_card_index" v-for="(item,index) in hiddenDatas" :key="index">
                    <view class="check_card_header">
                        <view class="check_header_times">{{item.createTime}}</view>
                        <view class="check_header_names" @click="goDetailsPage(item)">详情></view>
                    </view>
                    <view class="check_card_main">
                        <view class="check_main_items">
                            <view class="check_main_items_titles">隐患地点</view>
                            <view class="check_main_items_datas">{{item.dangerLocation}}</view>
                        </view>
                        <view class="check_main_items">
                            <view class="check_main_items_titles">隐患标题</view>
                            <view class="check_main_items_datas">{{item.title}}</view>
                        </view>
                    </view>
                </view>
                <u-loadmore :status="status" :icon-type="iconType" :load-text="loadText" />
            </scroll-view>
        </view>
        <u-datetime-picker
            :show="showStart"
            v-model="startTime"
            mode="date"
            @confirm="changeStart"
            @cancel="showStart = false"
        ></u-datetime-picker>
        <u-datetime-picker
            :show="showEnd"
            v-model="endTime"
            mode="date"
            @confirm="changeEnd"
            @cancel="showEnd = false"
        ></u-datetime-picker>
        <u-popup :show="showResult" @close="closeResult" mode="center" :round="6" :closeable="true">
            <view class="result_main_style">
                {{resultContent===null?'':resultContent}}
            </view>
        </u-popup>
    </view>
</template>

<script>
    import {changeTime,throttle} from '@/plugins/public.js'
    export default{
        data(){
            return{
                showResult:false,//是否展示检查结果弹框
                resultContent:"",//检查结果内容
                search:{},//查询条件
                showStart:false,//是否显示起始时间
                showEnd:false,//是否展示截止时间弹框
                startTime:Number(new Date()),//起始时间默认当天
                endTime:Number(new Date()),//截止时间默认当天
                hiddenDatas:[{}],//列表数据
                pageNum: 1,
                pageSize: 10,
                loadPage: 0,
                scrollTop: 0,
                triggered: true,
                status: 'loading',
                loadText: {
                    loading: '努力加载中',
                    nomore: '没有更多数据了'
                },
            }
        },
        onLoad(options) {
            this.searchCheckList()
        },
        methods:{
            //关闭弹框
            closeResult(){
                this.showResult = false
            },
            //跳转详情页
            goDetailsPage(val){
                uni.navigateTo({
                    url: `./detailsHidden?id=${val.id}`
                })
            },
            //跳转隐患举报添加按钮
            goAddHidden(){
                uni.navigateTo({
                    url: `./addHidden`
                })
            },
            //查询列表
            searchCheckList(){
                this.triggered = true;
                this.hiddenDatas = [];
                let params =Object.assign({},this.search,{
                    pageNum: this.pageNum,
                    pageSize:this.pageSize,
                })
                this.$api.reboSystem.searchHiddenLists(params).then(res=>{
                    if(res.statusMsg === 'ok'){
                        this.hiddenDatas = res.data.list
                        this.loadPage = res.data.pages;
                        this.triggered = false;
                        this.status = 'nomore';
                    }else{
                        uni.$u.toast(res.statusMsg);
                    }
                }).catch((err) => {
                    uni.$u.toast('请检查网络服务或联系管理员！')
                })
            },
            //自定义下拉刷新
            refresherrefresh: throttle(function() {
                this.status = 'loading';
                this.pageNum = 1;
                this.searchCheckList();
                uni.$u.toast('刷新成功');
            }, 500),
            //触底刷新
            scrolltoLower: throttle(function() {
                this.status = 'loading';
                if(this.pageNum >= this.loadPage) {
                    setTimeout(() => {
                        this.status = 'nomore'
                        uni.$u.toast('没有更多数据了');
                    },1000)
                    return
                } else {
                    this.pageNum+=1
                    let params =Object.assign({},this.search,{
                        pageNum: this.pageNum,
                        pageSize:this.pageSize,
                    })
                    this.$api.reboSystem.searchHiddenLists(params).then(res=>{
                        if(res.statusMsg === 'ok'){
                            this.hiddenDatas.push(...res.data.list)
                            this.loadPage = res.data.pages;
                            this.triggered = false;
                            this.status = 'nomore';
                        }else{
                            uni.$u.toast(res.statusMsg);
                        }
                    }).catch((err) => {
                        uni.$u.toast('请检查网络服务或联系管理员！')
                    })
                }
            }, 1500),
            //点击弹出选择起始时间
            startClick(){
                this.showStart = true
                this.$set(this.search,'startTime','')
            },
            //确定选择的起始时间
            changeStart({value}){
                this.showStart = false
                this.$set(this.search,'startTime',changeTime(value))
            },
            //点击弹出选择截止时间
            endClick(){
                this.showEnd = true
                this.$set(this.search,'endTime','')
            },
            //确定选择的起始时间
            changeEnd({value}){
                this.showEnd = false
                this.$set(this.search,'endTime',changeTime(value))
            }
        }
    }
</script>

<style scoped lang="scss">
    .check_index{
        height: 100vh;
        background-color: #F6F6F6;
        padding: 10px 15px;
		
        .hidden_add{
            width: 100%;
            line-height:20px;
            margin-bottom: 10px;
        }
		
        .check_select{
            display: flex;
            margin-bottom: 10px;
        }
        .check_main{
            height: calc(100% - 135px);
            .check_index_scroll{
                height: 95%;
				
                .check_card_index{
                    height: 120px;
                    background-color: #FFFFFF;
                    border-radius: 6px;
                    margin-bottom: 10px;
                    .check_card_header{
                        line-height: 40px;
                        border-bottom: 1px solid #F2F2F2;
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        .check_header_times{
                            font-size: 15px;
                            padding-left: 28px;
                            color: #333333;
                            position: relative;
                            &::before{
                                width: 15px;
                                height: 15px;
                                content: "";
                                background: url('../../static/times.png') no-repeat;
                                position: absolute;
                                top: 13px;
                                left: 10px;
                            }
                        }
                        .check_header_names{
                            padding-right: 15px;
                            font-size: 17px;
                            color: #1977FF;
                        }
                    }
                    .check_card_main{
                        display: flex;
                        flex-direction: column;
                        justify-content: space-around;
                        .check_main_items{
                            display: flex;
                            line-height: 30px;
                            .check_main_items_titles{
                                padding-left: 15px;
                                width: 80px;
                                flex: none;
                                color: #999999;
                                font-size: 15px;
                            }
                            .check_main_items_datas{
                                padding-right: 10px;
                                color: #333333;
                                font-size: 15px;
                                flex: 1;
                                text-align: left;
                                overflow: hidden;
                                text-overflow: ellipsis;
                                white-space: nowrap;
                            }
                        }
                    }
                }
            }
        }
    }
    ::v-deep .u-input {
        margin-right: 10px!important;
        background-color: #FFFFFF;
        border-radius: 0px;
        height: 40px;
    }
    .result_main_style{
        width: 200px;
        height: 200px;
        padding: 30px 15px 15px;
        overflow: auto;
        margin-right: 15px;
    }
</style>