场所采集

guoshilong

2023-10-30 12a9abcc3f3e51bc51d87d58e82b8cf410e33f48

场所采集

 api/label/label.js

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

//保存
export const getLabelList = (params) => {
    return http.request({
        url: 'blade-label/label/list',
        method: 'GET',
        params
    })
}

 mixin/uploadMixin.js

@@ -25,6 +25,10 @@
        }
    },

    created() {
        this.getHeader()
    },

    methods: {
        //获取头部
        getHeader() {

 subPackage/workbench/components/lineItem.vue

@@ -1,5 +1,5 @@
<template>
    <view class="line-item-container" style="margin-bottom: 1px;">
    <view class="line-item-container" style="margin-bottom: 20rpx;">

        <view v-for="(item, index) in dataInfo" :key="index" class="line-item">
            <view class="l">

 subPackage/workbench/views/cscj.vue

@@ -5,28 +5,35 @@
                <box-title title="基础信息"></box-title>
            </view>
            <view class="item">
                <u-form-item class="form-item" labelWidth="100" label="场所名称:" required prop="location">
                    <u--input border="none" v-model="form.location" placeholder="请输入当前位置">

                <!--                 <u-form-item class="form-item" labelWidth="100" label="场所地址:" required prop="location">
                    <u--input border="none" v-model="form.location" placeholder="请选择场所地址">
                    </u--input>
                </u-form-item> -->

                <u-form-item class="form-item" labelWidth="100" label="场所名称:" required prop="placeName">
                    <u--input border="none" v-model="form.placeName" placeholder="请输入当前位置">
                    </u--input>
                </u-form-item>

                <u-form-item @click="popup" class="form-item" labelWidth="100" label="标签:" required prop="location">
                <u-form-item @click="popup" class="form-item" labelWidth="100" label="标签:" required prop="label">
                    <u--input border="none" placeholder="请选择地址标签">
                    </u--input>
                    <u-icon slot="right" name="arrow-right"></u-icon>
                </u-form-item>
                <view v-if="showLabelList.length>0" class="label">
                    <view v-for="(item,index) in showLabelList" :key="index" class="activeLabel">
                        <u-tag size="mini" :text="item.text"></u-tag>
                        <u-tag closable :show="!item.isClose" size="mini" @close="delTag(item)"
                            :text="item.text"></u-tag>
                    </view>
                </view>

                <u-form-item class="form-item" labelWidth="100" label="备注:" required prop="location">
                <u-form-item class="form-item" labelWidth="100" label="备注:" prop="location">
                    <u--input border="none" v-model="form.remark" placeholder="请输入备注">
                    </u--input>
                </u-form-item>

                <u-form-item class="form-item" labelWidth="100" label="经纬度:" required prop="location">
                <u-form-item class="form-item" labelWidth="100" label="经纬度:" prop="location">
                    <u--input border="none" v-model="form.jwd" placeholder="请输入经纬度">
                    </u--input>
                </u-form-item>
@@ -37,11 +44,11 @@
            </view>

            <view class="item">
                <u-form-item class="form-item" labelWidth="100" label="场所负责人:" required prop="location">
                    <u--input border="none" v-model="form.charge" placeholder="请输入场所负责人">
                <u-form-item class="form-item" labelWidth="100" label="场所负责人:" prop="principal">
                    <u--input border="none" v-model="form.principal" placeholder="请输入场所负责人">
                    </u--input>
                </u-form-item>
                <u-form-item class="form-item" labelWidth="100" label="手机号:" required prop="location">
                <u-form-item class="form-item" labelWidth="100" label="手机号:" prop="location">
                    <u--input border="none" v-model="form.phone" placeholder="请输入手机号">
                    </u--input>
                </u-form-item>
@@ -65,16 +72,44 @@
        </u-form>

        <view class="box-title">
            <view>
                <box-title title="综治网格"></box-title>
            </view>
            <box-title title="综治网格">
                <template slot="titleMore">
                    <view class="title-more">
                        <view class="red item"></view>
                        <view class="orange item">85.9</view>
                        <view class="green item"></view>
                    </view>
                </template>
            </box-title>
        </view>

        <view class="item">
            <lineItem :dataInfo="dataInfo">
            <lineItem :dataInfo="comprehensiveData.basic">
            </lineItem>

            <lineItem :dataInfo="dataInfo1">
            <lineItem :dataInfo="comprehensiveData.scene">
                <template v-slot:pic="{scope}">
                    {{scope.value}}
                </template>
            </lineItem>
        </view>

        <view class="box-title">
            <box-title title="公安网格">
                <template slot="titleMore">
                    <view class="title-more">
                        <view class="red item"></view>
                        <view class="orange item">85.9</view>
                        <view class="green item"></view>
                    </view>
                </template></box-title>
        </view>

        <view class="item">
            <lineItem :dataInfo="comprehensiveData.basic">
            </lineItem>

            <lineItem :dataInfo="comprehensiveData.scene">
                <template v-slot:pic="{scope}">
                    {{scope.value}}
                </template>
@@ -82,9 +117,16 @@
        </view>


        <view class="bottom">
            <view class="btn">
                <u-button @click="addRent" type="primary" text="提交"></u-button>
            </view>
        </view>



        <uni-popup class="citys_win popup_win" ref="uniPopup" type="bottom">
            <wyh-tree-select :items="items" title="标签选择" :showNav="true" defaultActiveColor="#4586fe"
            <wyh-tree-select :items="labelList" title="标签选择" :showNav="true" defaultActiveColor="#4586fe"
                :activeIds="activeIds" @clickItem="labelClick" :showCancel="false" :showConfirm="false">
            </wyh-tree-select>
        </uni-popup>
@@ -96,6 +138,9 @@
<script>
    import uploadMixin from "@/mixin/uploadMixin";
    import lineItem from "@/subPackage/workbench/components/lineItem.vue"
    import {
        getLabelList
    } from "@/api/label/label";
    export default {
        mixins: [uploadMixin],
        components: {
@@ -104,77 +149,125 @@
        data() {
            return {
                form: {},
                rules: {},
                rules: {
                    'userInfo.name': {
                        type: 'string',
                        required: true,
                        message: '请填写姓名',
                        trigger: ['blur', 'change']
                    },
                },

                items: [{
                labelList: [{
                    text: '全部标签',
                    children: [{
                            text: '餐馆',
                            id: 1,
                        },
                        {
                            text: '旅馆、招待所',
                            id: 2,
                        }, {
                            text: '居民住宿',
                            id: 3
                        }
                    ],
                    children: [],
                    dot: false
                }, ],

                dataInfo: [{
                        label: "社区名称",
                        value: "暂无数据"
                    },
                    {
                        label: "网格名称",
                        value: "暂无数据"
                    },
                    {
                        label: "网格员",
                        value: "暂无数据"
                    },
                    {
                        label: "联系电话",
                        value: "暂无数据"
                    }
                ],

                dataInfo1: [{
                        label: "场所照片",
                        value: "",
                        useSlot: "pic",
                    },
                    {
                        label: "采集人",
                        value: "未完善"
                    },
                    {
                        label: "采集时间",
                        value: "未完善"
                    },
                    {
                        label: "场所负责人",
                        value: "未完善",
                    },
                    {
                        label: "采集人",
                        value: "未完善"
                    },
                    {
                        label: "采集时间",
                        value: "未完善",
                    }
                ],
                comprehensiveData: {
                    basic: [{
                            label: "社区名称",
                            value: "暂无数据"
                        },
                        {
                            label: "网格名称",
                            value: "暂无数据"
                        },
                        {
                            label: "网格员",
                            value: "暂无数据"
                        },
                        {
                            label: "联系电话",
                            value: "暂无数据"
                        }
                    ],
                    scene: [{
                            label: "场所照片",
                            value: "",
                            useSlot: "pic",
                        },
                        {
                            label: "采集人",
                            value: "未完善"
                        },
                        {
                            label: "采集时间",
                            value: "未完善"
                        },
                        {
                            label: "场所负责人",
                            value: "未完善",
                        },
                        {
                            label: "采集人",
                            value: "未完善"
                        },
                        {
                            label: "采集时间",
                            value: "未完善",
                        },
                        {
                            label: "历史事件",
                            value: "未完善",
                        }
                    ],
                },
                publicData: {
                    basic: [{
                            label: "公安局",
                            value: "暂无数据"
                        },
                        {
                            label: "派出所",
                            value: "暂无数据"
                        },
                        {
                            label: "辖区民警",
                            value: "暂无数据"
                        },
                        {
                            label: "联系电话",
                            value: "暂无数据"
                        }
                    ],
                    scene: [{
                            label: "消防照片",
                            value: "",
                            useSlot: "pic",
                        },
                        {
                            label: "采集人",
                            value: "未完善"
                        },
                        {
                            label: "采集时间",
                            value: "未完善"
                        },
                        {
                            label: "消防负责人",
                            value: "未完善",
                        },
                        {
                            label: "采集人",
                            value: "未完善"
                        },
                        {
                            label: "采集时间",
                            value: "未完善",
                        },
                        {
                            label: "历史事件",
                            value: "未完善",
                        }
                    ],
                },

                activeIds: [],
                showLabelList: []
            }
        },
        created() {

        },
        created() {},
        mounted() {

        },
@@ -182,7 +275,7 @@

        },
        onShow() {

            this.getLabel()
        },
        methods: {
            //弹出层打开
@@ -190,22 +283,44 @@
                this.$refs.uniPopup.open()
            },

            getLabel() {
                getLabelList({
                    size: -1
                }).then(res => {
                    let data = res.data.records
                    data.sort((a, b) => a.sort - b.sort)

                    data.forEach(label => {
                        this.labelList[0].children.push({
                            id: label.id,
                            text: label.labelName
                        })
                    })
                })
            },

            labelClick(item) {

                //判断label是否已在
                const label = this.showLabelList.find(e => e.id == item.id)

                if (label) {
                    //在，去掉
                    this.showLabelList = this.showLabelList.filter(e => e.id != label.id)
                    this.activeIds = this.activeIds.filter(e => id != label.id)
                    this.activeIds = this.activeIds.filter(e => e != label.id)
                } else {
                    //不在，添加
                    item.isClose = false
                    this.showLabelList.push(item)
                    this.activeIds.push(item.id)
                }

                this.showLabelList.sort((a, b) => a.id - b.id)
                this.showLabelList.sort((a, b) => a.sort - b.sort)

            },
            delTag(label) {
                label.isClose = true
                this.showLabelList = this.showLabelList.filter(e => e.id != label.id)
                this.activeIds = this.activeIds.filter(e => e != label.id)

            }
        }
@@ -216,13 +331,30 @@
    .container {
        position: relative;
        width: 100%;
        height: 100%;
        // height: 100%;
        display: flex;
        flex-direction: column;
        background: #F9F9FA;

        .box-title {
            padding: 10px 0;

            .title-more {
                display: flex;
                align-items: center;
                height: 100%;

                .item {
                    width: 50rpx;
                    height: 40rpx;
                    color: #ffffff;
                    padding: 6rpx;
                    font-size: 2rpx;
                    text-align: center;
                    line-height: 20px;
                }

            }
        }

        .item {
@@ -237,10 +369,12 @@
                padding: 10rpx 30rpx;
                display: flex;
                background-color: #ffffff;
                flex-wrap: wrap;

                .activeLabel {
                    // width: 80rpx;
                    margin-left: 10rpx;
                    margin-top: 10rpx
                }
            }

@@ -252,5 +386,31 @@
            background-color: #ffffff;
            padding: 40rpx 30rpx;
        }

        .bottom {
            padding: 20rpx;
            background-color: #ffffff;
            display: flex;
            justify-content: center;
            align-items: center;

            .btn {
                width: calc(100% - 40rpx);
            }
        }
    }

    .red {
        background-color: red;
        border-radius: 10rpx 0rpx 0rpx 10rpx;
    }

    .orange {
        background-color: orange;
    }

    .green {
        background-color: green;
        border-radius: 0rpx 10rpx 10rpx 0rpx;
    }
</style>