From eb484e374f91a24f200f9cf18eac6524edc4332e Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Sat, 31 Jul 2021 09:22:37 +0800
Subject: [PATCH] 保安员展示样式，地图细节更改
---
pages/securityStaff/exhibition.vue | 104 ++++++------
pages/securityStaff/exhibition - 副本.vue | 328 ++++++++++++++++++++++-------------------
pages/map/map.vue | 2
xcxMapSecurityPosition/css/body.css | 10
xcxMapSecurityPosition/xcxmap.html | 1
5 files changed, 237 insertions(+), 208 deletions(-)
diff --git a/pages/map/map.vue b/pages/map/map.vue
index 19a252c..83a6855 100644
--- a/pages/map/map.vue
+++ b/pages/map/map.vue
@@ -16,7 +16,7 @@
mounted() {},
onLoad: function(options) {
var data = [];
- console.log(options,"options")
+ // console.log(options,"options")
if (options.data == undefined) {
data = [{
"id": '100000',
diff --git "a/pages/securityStaff/exhibition - \345\211\257\346\234\254.vue" "b/pages/securityStaff/exhibition - \345\211\257\346\234\254.vue"
index 6040d24..0845daf 100644
--- "a/pages/securityStaff/exhibition - \345\211\257\346\234\254.vue"
+++ "b/pages/securityStaff/exhibition - \345\211\257\346\234\254.vue"
@@ -1,180 +1,204 @@
<template>
- <view class="exhibition">
- <view style="height: 44px;width: 100%;">
+ <view class="container">
+ <u-search v-model='keyValue' placeholder='请输入公司名称' shape="round" class="u-search" input-align="center"
+ height="70" @search='searchValue' @custom='searchValue' @clear='clearValue' @change='changeValue'>
+ </u-search>
- </view>
- <view class="head">
- <u-navbar :is-fixed="true" :border-bottom="false" :is-back="true" title="" :back-icon-color="'#fff'"
- :background="{ background: '#0BB9C8' }">
- <view class="search-input">
- <u-search height="50" placeholder="请输入保安员名字查询" @custom="customSearch" @change="changeSearch"
- :show-action="true" v-model="searchName" :animation="true" :margin="'80rpx'"
- :action-style="{ color: '#fff' }"></u-search>
- </view>
- </u-navbar>
- <view class="head-bg"></view>
- </view>
- <view class="container u-skeleton">
- <view v-for="(item,key,index) in securityStaffList" :key="index" class="lists">
- <!--u-skeleton-rect 绘制矩形-->
- <text class="u-skeleton-fillet lie lie1" style="padding-top: 10px;">姓名：{{item.name}}</text>
- <text class="u-skeleton-rect lie lie2">公司：{{item.obj}}</text>
- <text class="u-skeleton-rect lie lie3">地区：{{item.address}}</text>
- <text class="u-skeleton-rect lie but " @click="goToInformation(index)">点击查看详情</text>
+ <view v-if="newsList.length > 0">
+ <view class="inTmain" v-for="(item,index) in newsList">
+ <u-card :title="item.realName" @click="goDetail(item)">
+ <view class="" slot="body">
+ <view>
+ <view style="margin-bottom: 10px;" class="u-body-item-title u-line-1">公司：{{item.deptName}}
+ </view>
+ </view>
+ <view>
+ <view class="u-body-item-title u-line-1">地区：{{item.address}}</view>
+ </view>
+ </view>
+ <view class="" slot="foot">
+ </u-icon>电话：{{item.phone}}</view>
+ </u-card>
</view>
-
+ <u-loadmore class='msg' :status="status" />
</view>
- <!--引用组件-->
- <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton>
- <!-- <securityStaffs v-for="(item,index) in securityStaffList" :key="index" :datas="item">{{msg}}</securityStaffs> -->
+
+ <view class="msg" v-else>
+ 暂无数据
+ </view>
+
</view>
</template>
<script>
- import {
- data
- } from './data.js'
- import axios from 'axios'
export default {
data() {
return {
- outDataList: [],
- securityStaffList: [{
- name: '暂无',
- age: '暂无'
- }],
- searchName: '',
- loading: true,
- }
+ dataList: [],
+ newsList: [],
+ status: 'loadmore',
+ keyValue: '',
+ pagelist: 0,
+ };
},
- computed: {
- msg() {
- return this.securityStaffList[0] == 'null' ? '暂无数据' : '';
- }
+ onLoad() {
+
},
- methods: {
- getDataList() {
- var d = []
- axios({
- url: this.$store.state.piAPI + '/blade-user/page',
- method: 'get',
- }).then(res => {
- console.log(res.data.data.records);
- var b = res.data.data.records;
- for (var k in b) {
- d.push({
- name: b[k].realName,
- age: b[k].sexName,
- obj: b[k].deptName,
- honor: '扶老奶奶过马路',
- punishment: '不看红绿灯',
- imgSrc: b[k].avatar,
- cardid: b[k].cardid,
- baoanzheng: "赣06284538",
- address: b[k].address
- })
- }
- this.outDataList = d;
- console.log(d)
- setTimeout(() => {
-
- this.securityStaffList = this.outDataList;
- this.loading = false;
- }, 1000)
-
- })
- // this.outDataList = data;
-
-
- },
- customSearch() {
- if (this.searchName == '') {
- return;
- }
- this.loading = true;
- this.securityStaffList = [];
- console.log(this.searchName);
- var d = this.outDataList,
- a = [];
- for (var k in d) {
- if (d[k].name.indexOf(this.searchName) != -1) {
- a.push(d[k]);
- }
- }
- this.securityStaffList = a;
- this.loading = false;
-
- },
- goToInformation(index) {
- var data = this.securityStaffList[index];
- uni.navigateTo({
- url: `../securityStaff/information?data=${JSON.stringify(data)}`
- })
- },
- changeSearch() {
- if (this.searchName == '') {
- this.securityStaffList = this.outDataList;
- }
+ onReachBottom() {
+ var that = this;
+ if (that.dataList.length - 1 == that.pagelist) {
+ this.status = 'nomore';
+ return;
}
+ // 后续将改为与后端联动
+ this.status = 'loading';
+ setTimeout(() => {
+ for (var i = 0; i < 5; i++) {
+
+ if (that.pagelist <= that.dataList.length - 1) {
+
+ that.newsList.push(that.dataList[that.pagelist])
+
+ if (that.pagelist <= that.dataList.length - 2) {
+
+ that.pagelist += 1
+
+ if (that.dataList.length - 1 == that.pagelist) {
+ that.newsList.push(that.dataList[that.pagelist])
+ }
+
+ }
+
+ }
+
+ }
+ }, 2000);
},
mounted() {
- this.getDataList();
+ this.getCompany();
+ },
+ methods: {
+ getCompany() {
+ var that = this;
+ uni.request({
+ url: this.$store.state.piAPI + "/blade-user/page",
+ method: "get",
+ data: {
+ size: 99999
+ },
+ success: (res) => {
+ var resdata = res.data.data.records;
+ that.dataList = resdata;
+
+ for (var i = 0; i < 5; i++) {
+
+ if (that.pagelist <= that.dataList.length - 1) {
+
+ that.newsList.push(that.dataList[that.pagelist])
+
+ if (that.pagelist <= that.dataList.length - 2) {
+ that.pagelist += 1
+
+ if (that.dataList.length - 1 == that.pagelist) {
+ that.newsList.push(that.dataList[that.pagelist])
+ }
+
+ } else {
+
+ that.status = 'nomore';
+
+ }
+
+ }
+
+ }
+
+ }
+ });
+ },
+ goDetail(item) {
+ uni.navigateTo({
+ url: `../securityStaff/information?data=${JSON.stringify(item)}`
+ });
+ },
+ searchValue(value) {
+ var that = this;
+ var str = value.replace(/\s*/g, "");
+ if (str == '') {
+ return
+ } else {
+ that.newsList = [];
+ that.dataList.forEach(item => {
+ if (item.realName.indexOf(str) != -1) {
+ that.newsList.push(item)
+ }
+ })
+ that.status = 'nomore';
+ }
+ },
+ clearValue() {
+ this.keyValue = ''
+ this.newsList = [];
+ for (var i = 0; i < this.pagelist; i++) {
+ this.newsList.push(this.dataList[i])
+ }
+
+ if (this.dataList.length - 1 == this.pagelist) {
+ this.newsList.push(this.dataList[this.pagelist])
+ this.status = 'nomore';
+ } else if (this.pagelist < this.dataList.length - 1) {
+ this.status = 'loadmore';
+ }
+ },
+ changeValue(value) {
+ if (value == '') {
+ this.newsList = [];
+ for (var i = 0; i < this.pagelist; i++) {
+ this.newsList.push(this.dataList[i])
+ }
+ if (this.dataList.length - 1 == this.pagelist) {
+ this.newsList.push(this.dataList[this.pagelist])
+ this.status = 'nomore';
+ } else if (this.pagelist < this.dataList.length - 1) {
+ this.status = 'loadmore';
+ }
+ }
+ }
+
}
- }
+ };
</script>
-<style lang="scss" scoped>
- .exhibition {
- background-color: #f7f7f7;
- min-height: 100vh;
- overflow: hidden;
+<style lang="scss">
+ .u-card-wrap {
+ background-color: $u-bg-color;
+ padding: 1px;
}
- .head {
- position: fixed;
- top: 0;
- left: 0;
- z-index: 10;
+ .u-body-item {
+ font-size: 32rpx;
+ color: #333;
+ padding: 20rpx 10rpx;
}
- .container {
- width: 95%;
- margin: 0 auto;
- // position: relative;
+ .u-body-item image {
+ width: 120rpx;
+ flex: 0 0 120rpx;
+ height: 120rpx;
+ border-radius: 8rpx;
+ margin-left: 12rpx;
+ }
- .lists {
- background-color: #fff;
- width: 100%;
- height: 130px;
+ .u-search {
+ padding: 20rpx 30rpx 0 30rpx;
+ }
- .lie {
- display: block;
- margin: 10px 10px;
- }
+ .inTmain {}
- .but {
- position: relative;
- left: 70%;
- }
-
- .lie1 {
- height: 2.5rem;
- border-bottom: 1px solid rgba($color: #000000, $alpha: .1);
- padding-left: 1rem;
- font-size: 0.95rem;
- line-height: 1.25rem;
- font-weight: 600;
- }
-
- .lie2 {
- border-bottom: 1px solid rgba($color: #000000, $alpha: .1);
- padding-left: 1rem;
- }
-
- .lie3 {
- border-bottom: 1px solid rgba($color: #000000, $alpha: .1);
- padding-left: 1rem;
- }
- }
+ .msg {
+ height: 72rpx;
+ line-height: 72rpx;
+ text-align: center;
+ color: #999;
}
</style>
diff --git a/pages/securityStaff/exhibition.vue b/pages/securityStaff/exhibition.vue
index e9ba342..84aa858 100644
--- a/pages/securityStaff/exhibition.vue
+++ b/pages/securityStaff/exhibition.vue
@@ -1,6 +1,7 @@
<template>
<view class="container">
- <u-search v-model='keyValue' placeholder='请输入公司名称' shape="round" class="u-search" input-align="center"
+
+ <u-search v-model='keyValue' placeholder='请输入保安员姓名' shape="round" class="u-search" input-align="center"
height="70" @search='searchValue' @custom='searchValue' @clear='clearValue' @change='changeValue'>
</u-search>
@@ -39,6 +40,7 @@
status: 'loadmore',
keyValue: '',
pagelist: 0,
+ flag: true
};
},
onLoad() {
@@ -46,33 +48,38 @@
},
onReachBottom() {
var that = this;
- if (that.dataList.length - 1 == that.pagelist) {
+
+ if (that.dataList.length - 1 == that.pagelist && this.status != 'nomore' && that.flag == true) {
+ that.newsList.push(that.dataList[that.pagelist]);
this.status = 'nomore';
+ that.flag = false;
return;
- }
- // 后续将改为与后端联动
- this.status = 'loading';
- setTimeout(() => {
- for (var i = 0; i < 5; i++) {
-
- if (that.pagelist <= that.dataList.length - 1) {
-
- that.newsList.push(that.dataList[that.pagelist])
-
- if (that.pagelist <= that.dataList.length - 2) {
-
- that.pagelist += 1
-
- if (that.dataList.length - 1 == that.pagelist) {
- that.newsList.push(that.dataList[that.pagelist])
- }
-
- }
-
- }
-
+ } else {
+ if (that.flag == false) {
+ this.status = 'nomore';
+ return
}
- }, 2000);
+ // 后续将改为与后端联动
+ this.status = 'loading';
+
+ setTimeout(() => {
+ var flag = true;
+
+ for (var i = 0; i < 5; i++) {
+
+ if (that.pagelist <= that.dataList.length - 2 && flag == true) {
+
+ that.newsList.push(that.dataList[that.pagelist++])
+
+ if (that.dataList.length - 1 == that.pagelist) flag == false
+
+ }
+
+ }
+ }, 2000);
+
+ }
+
},
mounted() {
this.getCompany();
@@ -84,33 +91,31 @@
url: this.$store.state.piAPI + "/blade-user/page",
method: "get",
data: {
- size: 99999
+
},
success: (res) => {
var resdata = res.data.data.records;
that.dataList = resdata;
+ var flag = true;
+
for (var i = 0; i < 5; i++) {
- if (that.pagelist <= that.dataList.length - 1) {
+ if (that.pagelist <= that.dataList.length - 2) {
- that.newsList.push(that.dataList[that.pagelist])
+ that.newsList.push(that.dataList[that.pagelist++]);
- if (that.pagelist <= that.dataList.length - 2) {
- that.pagelist += 1
+ } else {
- if (that.dataList.length - 1 == that.pagelist) {
- that.newsList.push(that.dataList[that.pagelist])
- }
+ if (that.dataList.length - 1 == that.pagelist && flag == true) {
- } else {
-
- that.status = 'nomore';
-
+ that.newsList.push(that.dataList[that.pagelist]);
+ flag = false;
+ that.flag = false;
+
}
}
-
}
}
@@ -118,7 +123,7 @@
},
goDetail(item) {
uni.navigateTo({
- url: `../securityStaff/information?data=${JSON.stringify(item)}`
+ url: './companyDetail?detailData=' + JSON.stringify(item)
});
},
searchValue(value) {
@@ -129,7 +134,7 @@
} else {
that.newsList = [];
that.dataList.forEach(item => {
- if (item.realName.indexOf(str) != -1) {
+ if (item.enterprisename.indexOf(str) != -1) {
that.newsList.push(item)
}
})
@@ -142,12 +147,9 @@
for (var i = 0; i < this.pagelist; i++) {
this.newsList.push(this.dataList[i])
}
-
- if (this.dataList.length - 1 == this.pagelist) {
- this.newsList.push(this.dataList[this.pagelist])
- this.status = 'nomore';
- } else if (this.pagelist < this.dataList.length - 1) {
- this.status = 'loadmore';
+
+ if (this.flag == false) {
+ this.newsList.push(this.dataList[this.pagelist]);
}
},
changeValue(value) {
@@ -156,15 +158,12 @@
for (var i = 0; i < this.pagelist; i++) {
this.newsList.push(this.dataList[i])
}
- if (this.dataList.length - 1 == this.pagelist) {
- this.newsList.push(this.dataList[this.pagelist])
- this.status = 'nomore';
- } else if (this.pagelist < this.dataList.length - 1) {
- this.status = 'loadmore';
+
+ if (this.flag == false) {
+ this.newsList.push(this.dataList[this.pagelist]);
}
}
}
-
}
};
</script>
@@ -202,3 +201,4 @@
color: #999;
}
</style>
+
diff --git a/xcxMapSecurityPosition/css/body.css b/xcxMapSecurityPosition/css/body.css
index 7545fde..19d26b5 100644
--- a/xcxMapSecurityPosition/css/body.css
+++ b/xcxMapSecurityPosition/css/body.css
@@ -27,16 +27,20 @@
/* border: solid 1px springgreen; */
}
-#salffPopup {
+/* #salffPopup {
width: 100%;
- height: 30vh;
+ height: 3rem;
background-color: #fff;
position: fixed;
bottom: 0;
left: 0;
z-index: 10;
border-radius: 1rem 1rem 0 0;
-}
+} */
+
+/* .el-drawer__open{
+ height: 5rem !important;
+} */
.oncessalfe {
margin: 1rem;
diff --git a/xcxMapSecurityPosition/xcxmap.html b/xcxMapSecurityPosition/xcxmap.html
index 408e05f..e8c9615 100644
--- a/xcxMapSecurityPosition/xcxmap.html
+++ b/xcxMapSecurityPosition/xcxmap.html
@@ -75,6 +75,7 @@
:title="oncesSalfeData.realName"
:visible.sync="drawer"
:direction="'btt'"
+ :size="'20%'"
:with-header="false">
<!-- <span>我来啦!</span> -->
<div class="oncessalfe">
--
Gitblit v1.9.3