活动搜索功能

guanqb

2022-12-07 c316a2a951b65f00b583760b261cd7c6ab5eb812

活动搜索功能

 src/api/activity/index.js

@@ -2,16 +2,23 @@


/**
 * 添加活动
 * 获取活动列表
 * @param {*}   
 * @returns 
 */
export const getSecurityList = (params, requestBaseUrl = 'outside') => {
export const getSecurityList = (type, name, startTime, endTime, requestBaseUrl = 'outside') => {
    return request({
        url: `/security/security/all`,
        url: `/security/security/page`,
        method: 'get',
        requestBaseUrl,
        params
        params: {
            current: 1,
            size: 100,
            type,
            name,
            startTime,
            endTime,
        }
    })
}


 src/views/activity/index.vue

@@ -17,7 +17,12 @@
                <div>
                    <div class="category">活动类型：</div>
                    <div class="category-value">
                        <el-select size="small" v-model="activityType" placeholder="请选择">
                        <el-select
                            size="small"
                            v-model="activityType"
                            placeholder="请选择"
                            @change="activityTypeChange"
                        >
                            <el-option
                                v-for="item in activityOptions"
                                :key="item.value"
@@ -31,18 +36,32 @@
                    <div class="category">活动名称：</div>
                    <div class="category-value">
                        <input type="text" placeholder="请输入搜索条件" v-model="searchActivity" />
                        <button class="el-icon-search"></button>
                        <button class="el-icon-search" @click="searchClick"></button>
                    </div>
                </div>
                <div>
                    <div class="category">选择时间：</div>
                    <div class="category-value">
                        <el-date-picker
                        <!-- <el-date-picker
                            size="small"
                            v-model="selectTime"
                            type="date"
                            placeholder="选择日期"
                            style="width:268px"
                        ></el-date-picker>-->
                        <el-date-picker
                            v-model="selectTime"
                            type="daterange"
                            align="right"
                            unlink-panels
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd HH:mm:ss"
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            :picker-options="pickerOptions"
                            style="width:268px"
                            @change="activityTimeChange"
                        ></el-date-picker>
                    </div>
                </div>
@@ -95,12 +114,6 @@

        <div class="draw-btn-box" v-show="dialogVisible">
            <ul>
                <!-- <li>
                    <button @click="draw('point')">点</button>
                </li>
                <li>
                    <button @click="draw('billboard')">图标点</button>
                </li>-->
                <li>
                    <button @click="draw('billboard','policeman')">警员</button>
                </li>
@@ -119,30 +132,6 @@
                <li>
                    <button @click="draw('polygon','policecar')">警车范围</button>
                </li>
                <!-- <li>
                    <button @click="draw('circle')">圆</button>
                </li>
                <li>
                    <button @click="draw('rectangle')">矩形</button>
                </li>
                <li>
                    <button @click="draw('attack_arrow')">进攻箭头</button>
                </li>
                <li>
                    <button @click="draw('double_arrow')">双箭头</button>
                </li>
                <li>
                    <button @click="draw('fine_arrow')">直箭头</button>
                </li>
                <li>
                    <button @click="draw('tailed_attack_arrow')">燕尾箭头</button>
                </li>
                <li>
                    <button @click="draw('gathering_place')">聚集地</button>
                </li>
                <li>
                    <button @click="removeAll()">清除</button>
                </li>-->
            </ul>
        </div>

@@ -289,22 +278,22 @@
    data () {
        return {
            activityOptions: [{
                value: '选项1',
                value: '1',
                label: '教育活动'
            }, {
                value: '选项2',
                value: '2',
                label: '科技活动'
            }, {
                value: '选项3',
                value: '3',
                label: '公益活动'
            }, {
                value: '选项4',
                value: '4',
                label: '组织活动'
            }, {
                value: '选项5',
                value: '5',
                label: '文娱活动'
            }, {
                value: '选项6',
                value: '6',
                label: '体育活动'
            }],
            policeOption: [],
@@ -505,7 +494,8 @@
        })
    },

    updated () { },
    updated () {
    },

    methods: {
        // 生成热力图坐标
@@ -517,6 +507,39 @@
                list.push(new global.DC.Position(lng, lat))
            }
            return list
        },

        // 点击搜索
        searchClick () {
            let startTime = ''
            let endTime = ''
            if (this.selectTime) {
                startTime = this.selectTime[0]
                endTime = this.selectTime[1]
            }
            this.getSecurityList(this.activityType, this.searchActivity, startTime, endTime)
        },

        // 下拉选择值变化
        activityTypeChange () {
            let startTime = ''
            let endTime = ''
            if (this.selectTime) {
                startTime = this.selectTime[0]
                endTime = this.selectTime[1]
            }
            this.getSecurityList(this.activityType, this.searchActivity, startTime, endTime)
        },

        // 时间选中值触发
        activityTimeChange () {
            let startTime = ''
            let endTime = ''
            if (this.selectTime) {
                startTime = this.selectTime[0]
                endTime = this.selectTime[1]
            }
            this.getSecurityList(this.activityType, this.searchActivity, startTime, endTime)
        },

        // 获取活动警员分布信息
@@ -614,10 +637,11 @@
                })
            })
        },

        // 获取活动列表
        getSecurityList () {
            getSecurityList().then(res => {
                this.activityList = res.data.data
        getSecurityList (type, name, startTime, endTime) {
            getSecurityList(type, name, startTime, endTime).then(res => {
                this.activityList = res.data.data.records
                this.addActivityPoint()
            })
        },