From f2eb32997b3b398948f3a4f71d24254f4edfeb9a Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Thu, 29 Jul 2021 09:06:25 +0800
Subject: [PATCH] 保安管理
---
pages/securityStaff/exhibition.vue | 158 +++++++++++++++++++
pages/home/home.vue | 25 ++
components/securityStaffs/securityStaffs.vue | 38 ++++
vue.config.js | 21 ++
pages.json | 22 ++
pages/securityStaff/information.vue | 122 +++++++++++++++
pages/securityStaff/certificates.vue | 12 +
pages/securityStaff/employer.vue | 12 +
pages/securityStaff/data.js | 65 ++++++++
9 files changed, 467 insertions(+), 8 deletions(-)
diff --git a/components/securityStaffs/securityStaffs.vue b/components/securityStaffs/securityStaffs.vue
new file mode 100644
index 0000000..1b793fa
--- /dev/null
+++ b/components/securityStaffs/securityStaffs.vue
@@ -0,0 +1,38 @@
+<template>
+ <view class="securityStaffs">
+ <view class="container u-skeleton">
+ <view style="margin: 20px 0">
+ <view v-for="(item,key,index) in datas" :key="index" class="lists">
+ <!--u-skeleton-rect 绘制矩形-->
+ <text class="u-skeleton-rect">{{key}}:{{item}}</text>
+ </view>
+ </view>
+ </view>
+ <!--引用组件-->
+ <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton>
+ </view>
+</template>
+
+<script>
+ export default {
+ name: "securityStaffs",
+ props: ['datas'],
+ data() {
+ return {
+ loading: true,
+ };
+ },
+ watch:{
+ datas(){
+ console.log(this.datas);
+ this.loading = false;
+ }
+ }
+ }
+</script>
+
+<style lang="scss">
+.container {
+ padding: 20rpx 60rpx;
+ }
+</style>
diff --git a/pages.json b/pages.json
index 657c29c..c19098e 100644
--- a/pages.json
+++ b/pages.json
@@ -68,7 +68,27 @@
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
- }, {
+ },
+
+ {
+ "path": "pages/securityStaff/exhibition",
+ "style": {
+ "navigationBarTitleText": "展示",
+ "enablePullDownRefresh": false,
+ "navigationStyle": "custom"
+ }
+ },{
+ "path": "pages/securityStaff/information",
+ "style": {
+ "navigationBarTitleText": "详细信息",
+ "enablePullDownRefresh": false,
+ "navigationStyle": "custom"
+ }
+ },
+
+
+
+ {
"path": "pages/company/company",
"style": {
"navigationBarTitleText": "服务单位",
diff --git a/pages/home/home.vue b/pages/home/home.vue
index 27e251b..5fea7a3 100644
--- a/pages/home/home.vue
+++ b/pages/home/home.vue
@@ -66,10 +66,14 @@
<view class="service-box">
<u-grid :col="4" :border="false">
<u-grid-item bg-color="transparent" v-for="(item, index) in serviceButton" :key="index" @click="goBusinessPage(item.url,index)">
- <navigator url="" hover-class="none" class="service-item">
+ <!-- <navigator url="" hover-class="none" class="service-item">
<image :src="item.img" mode="widthFix" class="img"></image>
<view class="name">{{ item.name }}</view>
- </navigator>
+ </navigator> -->
+ <view url="" hover-class="none" class="service-item">
+ <image :src="item.img" mode="widthFix" class="img"></image>
+ <view class="name">{{ item.name }}</view>
+ </view>
</u-grid-item>
<u-grid-item bg-color="transparent" key="8">
<navigator url="/pages/service/service" hover-class="none" class="service-item">
@@ -180,10 +184,19 @@
},
//页面跳转
goBusinessPage(url,index){
- console.log(url)
- uni.navigateTo({
- url:url
- })
+ // console.log(url,index)
+ if(index == 1){
+ console.log(index)
+ uni.navigateTo({
+ url:'../securityStaff/exhibition'
+ })
+ return;
+
+ }
+ // console.log(index)
+ // uni.navigateTo({
+ // url:url
+ // })
},
handleFocus() {
this.focus = !this.focus;
diff --git a/pages/securityStaff/certificates.vue b/pages/securityStaff/certificates.vue
new file mode 100644
index 0000000..65e3856
--- /dev/null
+++ b/pages/securityStaff/certificates.vue
@@ -0,0 +1,12 @@
+<template>
+ <view class="certificates">
+ 证件
+
+ </view>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>
diff --git a/pages/securityStaff/data.js b/pages/securityStaff/data.js
new file mode 100644
index 0000000..77ba1c6
--- /dev/null
+++ b/pages/securityStaff/data.js
@@ -0,0 +1,65 @@
+export var data = [{
+ name: '原俊袆',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '钟日健',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '唐子玉',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '曾杭',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '刘运贵',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '唐子玉',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '曾杭',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '刘运贵',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '原俊袆',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '钟日健',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '唐子玉',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '曾杭',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '刘运贵',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '唐子玉',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '曾杭',
+ age: 18,
+ obj: '适普科技'
+}, {
+ name: '刘运贵',
+ age: 18,
+ obj: '适普科技'
+}]
diff --git a/pages/securityStaff/employer.vue b/pages/securityStaff/employer.vue
new file mode 100644
index 0000000..ededfbc
--- /dev/null
+++ b/pages/securityStaff/employer.vue
@@ -0,0 +1,12 @@
+<template>
+ <view class="employer">
+ 从业单位
+
+ </view>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>
diff --git a/pages/securityStaff/exhibition.vue b/pages/securityStaff/exhibition.vue
new file mode 100644
index 0000000..be6832e
--- /dev/null
+++ b/pages/securityStaff/exhibition.vue
@@ -0,0 +1,158 @@
+<template>
+ <view class="exhibition">
+ <view style="height: 44px;width: 100%;">
+
+ </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" style="padding-top: 10px;">姓名:{{item.name}}</text>
+ <text class="u-skeleton-rect lie">性别:{{item.age}}</text>
+ <text class="u-skeleton-rect lie">公司:{{item.obj}}</text>
+ <text class="u-skeleton-rect lie but" @click="goToInformation(index)">点击查看详情</text>
+ </view>
+
+ </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>
+</template>
+
+<script>
+ import {
+ data
+ } from './data.js'
+ import axios from 'axios'
+ export default {
+ data() {
+ return {
+ outDataList: [],
+ securityStaffList: [{
+ name: '暂无',
+ age: '暂无'
+ }],
+ searchName: '',
+ loading: true,
+ }
+ },
+ computed: {
+ msg() {
+ return this.securityStaffList[0] == 'null' ? '暂无数据' : '';
+ }
+ },
+ methods: {
+ getDataList() {
+ var d = []
+ axios({
+ url: 'http://192.168.0.108:81/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
+ })
+ }
+ 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;
+ }
+ }
+ },
+ mounted() {
+ this.getDataList();
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .exhibition {
+ background-color: #f7f7f7;
+ min-height: 100vh;
+ overflow: hidden;
+ }
+
+ .head {
+ position: fixed;
+ top: 0;
+ left: 0;
+ z-index: 10;
+ }
+
+ .container {
+ width: 95%;
+ margin: 0 auto;
+ // position: relative;
+
+ .lists {
+ background-color: #fff;
+ width: 100%;
+ height: 130px;
+
+ .lie {
+ display: block;
+ margin: 10px 10px;
+ }
+
+ .but {
+ position: relative;
+ left: 70%;
+ }
+ }
+ }
+</style>
diff --git a/pages/securityStaff/information.vue b/pages/securityStaff/information.vue
new file mode 100644
index 0000000..6d22a4d
--- /dev/null
+++ b/pages/securityStaff/information.vue
@@ -0,0 +1,122 @@
+<template>
+ <view class="information">
+ <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="bodys">
+ <view class="once">
+ 照片:
+ <!-- <image :src="datalist.imgSrc" mode=""></image> -->
+ <u-image class="img" width="150rpx" height="150rpx" :src="datalist.imgSrc">
+ <view slot="error" style="font-size: 24rpx;">暂无图片</view>
+ </u-image>
+ </view>
+ <view class="once">
+ 姓名: {{datalist.name}}
+ </view>
+ <view class="once">
+ 性别: {{datalist.age}}
+ </view>
+
+ <view class="once">
+ 公司: {{datalist.obj}}
+ </view>
+ <view class="once">
+ 荣誉: {{datalist.honor}}
+ </view>
+ <view class="once">
+ 违规: {{datalist.punishment}}
+ <!-- <view class="title">
+ 违规:
+ </view>
+ <textarea name="" id="" disabled="disabled" :placeholder="datalist.punishment"></textarea> -->
+ </view>
+ <view class="once">
+ <u-button class="ubut" type="success" @click="openCertificates" size="medium" :ripple="true"
+ ripple-bg-color="#fff">查看证件</u-button>
+ </view>
+ </view>
+ <u-popup v-model="show" mode="bottom" length="30%" border-radius="10">
+ <view>证件详情</view>
+ </u-popup>
+
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ datalist: {
+ name: '原俊袆',
+ age: '男',
+ obj: '适普科技',
+ honor: '扶老奶奶过马路',
+ punishment: '不看红绿灯',
+ imgSrc: "https://gw.alipayobjects.com/zos/rmsportal/BiazfanxmamNRoxxVxka.png"
+ },
+ show: false
+ }
+ },
+ methods: {
+ openCertificates() {
+ this.show = true;
+ }
+ },
+ mounted() {
+ if (this.$route.query.data != undefined) {
+ this.datalist = JSON.parse(this.$route.query.data);
+ }
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .information {
+ background-color: #f7f7f7;
+ min-height: 100vh;
+ overflow: hidden;
+
+ .bodys {
+ width: 100%;
+ margin: 0 auto;
+
+ .once {
+ width: 100%;
+ height: auto;
+ background-color: #fff;
+ line-height: 44px;
+ padding: 0 2.5% 0 2.5%;
+ }
+
+ .img {
+ display: inline-block;
+ position: relative;
+ top: 10px;
+ }
+
+ .once:not(:nth-child(1)) {
+ margin: 10px 0 10px 0;
+ }
+
+ .once:nth-child(6),
+ .once:nth-child(5) {
+ height: 88px;
+ }
+ .once:nth-child(7){
+ background-color: transparent;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ }
+ }
+</style>
diff --git a/vue.config.js b/vue.config.js
index 91b7bf7..2721b03 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -4,5 +4,24 @@
devServer: {
disableHostCheck: true
}
- }
+ },
+ // devServer: {
+ // port: 1888,
+ // // disableHostCheck: true,
+ // proxy: {
+ // '/api': {
+ // //本地服务接口地址
+ // // target: 'http://localhost',
+ // // target: 'http://192.168.0.114:81',//钟W
+ // target: 'http://192.168.0.109:81',//tangW
+ // // target: 'http://192.168.0.104:80',//唐N
+ // //远程演示服务地址,可用于直接启动项目
+ // // target: 'https://saber.bladex.vip/api',
+ // ws: true,
+ // pathRewrite: {
+ // '^/api': '/'
+ // }
+ // }
+ // }
+ // }
}
--
Gitblit v1.9.3