18058587597
/
vue_qsw_fk_web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

大叶审批更改

This commit is contained in:
18058587597 2024-03-27 11:02:14 +08:00
parent f98fdf6d73
commit 10a7699f59
76 changed files with 26134 additions and 200 deletions

2
.eslintignore
View File

@ -1,2 +0,0 @@
build/*.js
config/*.js

32
.eslintrc.js
View File

@ -1,32 +0,0 @@
module.exports = {
root: true,
parser: 'babel-eslint',
parserOptions: {
sourceType: 'module'
},
// https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
extends: 'standard',
// required to lint *.vue files
plugins: [
'html'
],
// add your custom rules here
'rules': {
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
'no-multiple-empty-lines': ['error', {
max: 2,
maxEOF: 2,
maxBOF: 2
}],
'space-before-function-paren':0,
'semi':0,
'no-new':0,
'no-unused-vars':0,
'no-undef':0
}
}

16
build/webpack.base.conf.js
View File

@ -35,17 +35,7 @@ module.exports = {
fallback: [path.join(__dirname, '../node_modules')]
},
module: {
preLoaders: [{
test: /\.vue$/,
loader: 'eslint',
include: projectRoot,
exclude: /node_modules/
}, {
test: /\.js$/,
loader: 'eslint',
include: projectRoot,
exclude: /node_modules/
}],
preLoaders: [],
loaders: [{
test: /\.vue$/,
loader: 'vue'
@ -73,9 +63,7 @@ module.exports = {
}
}]
},
eslint: {
formatter: require('eslint-friendly-formatter')
},
vue: {
loaders: utils.cssLoaders({
sourceMap: useCssSourceMap

2
config/index.js
View File

@ -8,7 +8,7 @@ module.exports = {
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: '/',
productionSourceMap: true,
productionSourceMap: false,
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
// Before setting to `true`, make sure to:

2
index.html
View File

@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<title>sell</title>
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
<link rel="stylesheet" href="static/css/reset.css">
</head>

16453
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

27
package.json
View File

@ -2,23 +2,26 @@
"name": "sell",
"version": "1.0.0",
"description": "sell app",
"author": "<simonzhangr@foxmail.com>",
"author": " <simonzhangr@foxmail.com>",
"private": true,
"scripts": {
"dev": "node build/dev-server.js",
"build": "node build/build.js",
"lint": "eslint --ext .js,.vue src"
"build": "node build/build.js"
},
"dependencies": {
"axios": "^0.15.3",
"babel-runtime": "^6.9.0",
"better-scroll": "^0.1.10",
"eslint-config-standard": "^6.2.1",
"echarts": "^5.4.3",
"element-ui": "^2.15.14",
"fastclick": "^1.0.6",
"html2canvas": "^1.4.1",
"iscroll": "^5.2.0",
"moment": "^2.17.1",
"qrcodejs2": "^0.0.2",
"stylus": "^0.54.5",
"v-tap": "^2.0.2",
"vant": "^2.13.2",
"vue": "^2.1.0",
"vue-resource": "^1.0.3",
"vue-router": "^2.1.1",
@ -30,7 +33,6 @@
"devDependencies": {
"autoprefixer": "^6.4.0",
"babel-core": "^6.0.0",
"babel-eslint": "^7.0.0",
"babel-loader": "^6.0.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-preset-es2015": "^6.0.0",
@ -40,13 +42,6 @@
"chalk": "^1.1.3",
"connect-history-api-fallback": "^1.1.0",
"css-loader": "^0.25.0",
"eslint": "^3.7.1",
"eslint-config-standard": "^6.1.0",
"eslint-friendly-formatter": "^2.0.5",
"eslint-loader": "^1.5.0",
"eslint-plugin-html": "^1.3.0",
"eslint-plugin-promise": "^3.5.0",
"eslint-plugin-standard": "^2.0.1",
"eventsource-polyfill": "^0.9.6",
"express": "^4.13.3",
"extract-text-webpack-plugin": "^1.0.1",
@ -72,5 +67,11 @@
"engines": {
"node": ">= 4.0.0",
"npm": ">= 3.0.0"
}
},
"main": "index.js",
"repository": {
"type": "git",
"url": "https://gitee.com/aylinn/vue_takeout_system.git"
},
"license": "ISC"
}

20
src/App.vue
View File

@ -5,7 +5,7 @@
width:100%
height:40px
line-height:40px
border-1px(rgba(7,17,27,0.1))
align-items:center
.tab-item
flex:1
text-align:center
@ -20,21 +20,10 @@
<template>
<div>
<v-header :seller="seller"></v-header>
<div class="tab">
<div class="tab-item">
<router-link to="/goods">商品</router-link>
</div>
<div class="tab-item">
<router-link to="/ratings">评论</router-link>
</div>
<div class="tab-item">
<router-link to="/seller">商家</router-link>
</div>
</div>
<keep-alive>
<router-view :seller="seller"></router-view>
<router-view :seller="seller" v-if="$route.meta.keepAlice"></router-view>
</keep-alive>
<router-view :seller="seller" v-if="!$route.meta.keepAlice"></router-view>
</div>
</template>
@ -52,9 +41,6 @@ export default {
}
},
created() {
axios.get('static/data.json').then((res) => {
this.seller = res.data.seller
})
},
components: {
'v-header': header

50
src/api/config.js Normal file
View File

@ -0,0 +1,50 @@
import axios from 'axios'
import ElementUI from "element-ui"
import router from '../router'
import VueRouter from 'vue-router'
// 通过axios.create方法 配置默认请求属性
// const baseURL = process.env.NODE_ENV === 'development' ? '/api' : 'http://chst.vip:1901'
axios.defaults.baseURL = "http://dazhao.site:8012/api"
axios.create({
timeout: 3000,
withCredentials: true// 开启携带认证
})
// 编写拦截器
// 请求拦截器 给每个请求都添加上headers['authorzation']
axios.interceptors.request.use(config => {
// 判断请求路径 如果请求的是登入接口或者注册接口 那么直接放行
if (config.url === '/Admin/Login') {
return config
}
const token = localStorage.getItem('wf_token');
config.headers.authorization = "Bearer "+token;
return config // 相当于给请求放行
})
// let path = router.history.current.path;//获取
// 响应拦截器
axios.interceptors.response.use(config => {
const { data } = config
// if(config.headers['access-token']){
// localStorage.setItem("wf-token", config.headers['access-token']);
// localStorage.setItem("re-token", config.headers['x-access-token']);
// }
// //todo:可放接口返回异常处理
// loading.methods.stopLoading();
return config
},error=>{
if(error.response){
if(error.response.status === 401){
localStorage.clear();
ElementUI.Message.error("登录过期，请重新登录...");
router.push("/login");
}
}
})
export default axios

78
src/api/index.js Normal file
View File

@ -0,0 +1,78 @@
import axios from './config'
// 登录
export const Login = (page) => axios({
url: '/Admin/Login',
method: 'post',
params: page
})
// 删除装修队成员
export const DeleteDecorationTeamPerson = (id) => axios({
url: '/Decoration/DeleteDecorationTeamPerson/'+id,
method: 'delete',
data: {}
})
// 删除装修队
export const DeleteDecorationTeams = (id) => axios({
url: '/Decoration/DeleteDecorationTeams/'+id,
method: 'delete',
data: {}
})
// 装修队完工报告
export const FinishDecorationTeam = (id) => axios({
url: '/Decoration/FinishDecorationTeam/'+id,
method: 'put',
data: {}
})
// 获取装修队
export const GetDecorationTeams = (page) => axios({
url: '/Decoration/GetDecorationTeams',
method: 'get',
params: page
})
// 获取装修队成员
export const GetDecorationTeamPersons = (id) => axios({
url: '/Decoration/GetDecorationTeamPersons/'+id,
method: 'get',
params: {}
})
// 添加装修队
export const AddDecorationTeam = (json) => axios({
url: '/Decoration/AddDecorationTeam',
method: 'post',
data: json
})
// 添加装修队成员
export const AddDecorationTeamPerson = (id,json) => axios({
url: '/Decoration/AddDecorationTeamPerson/'+id,
method: 'post',
data: json
})
// 添加用户
export const AddPerson = (json) => axios({
url: '/Person/AddPerson',
method: 'post',
data: json
})
// 获取用户
export const GetPersons = (parm) => axios({
url: '/Person/GetPersons'+parm,
method: 'get',
params: {}
})
// 添加用户
export const UploadPerson = (json) => axios({
url: '/Person/UploadPerson',
method: 'post',
data: json
})

127
src/components/applySelect/applySelect.vue Normal file
View File

@ -0,0 +1,127 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-loading="loading">
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">请选择来访事由</div>
<div style="margin: auto;width: 90%;height: auto;">
<div style="height: 2.5rem;width: 100%;display: flex;align-items: center;border-bottom: 0.7px solid #f0f0f0;font-family: '黑体';" v-for="(a,i) in list" :key="i" @click="select(a)">
{{a.name}}
</div>
</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
active:0,
loading:false,
popShow:false,
selectJson:{},
color:"#00c76c",
lfTimeJson: { prop: "lftime", title: "到访时间" },
url:"",
list:[],
user:{},
openid:"",
showlist:[
{
}
]
};
},
props:["handlyChange"],
components:{},
activated() {
},
mounted() {
this.url = this.$store.state.url;
this.getInit();
},
methods: {
select(value){
this.handlyChange(value);
},
deletefklog(id){
axios
.delete(this.url + "/Visitor/DeleteVisitor/"+id, {})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.getInit();
} else {
this.$toast.fail(result.msg);
}
});
},
viewQrcode(code,visitTime){
this.$router.push("/applyQrcode?code="+code+"&visitTime="+visitTime+"&name="+this.user.name);
},
getInit(){
axios
.get(this.url + "/Visitor/GetVisitorReasons", {})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.list = result.data;
} else {
this.$toast.fail(result.msg);
}
});
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
// history.go(-1)
this.$router.push("/invite");
},
onClickRight(){
},
submitBack(val){
this.popShow = false;
this.form.carNumber = val;
},
keysShow(){
this.popShow = true
},
tabChange(val){
this.getInit();
},
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
.van-button--square {
height: 100%;
}
</style>

205
src/components/applyfor/applyforJf.vue Normal file
View File

@ -0,0 +1,205 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-if="user.id && !selectShow">
<van-notice-bar mode="closeable">访客进入申请页，填写您的信息，确保无误。申请后，您将畅通无阻访问您的好友</van-notice-bar>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">访客申请</div>
<div style="height: 2.5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 1.5rem;width:90%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">慈溪浅水湾-住宅-{{user.fjNum}}</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客姓名</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.name" placeholder="请输入访客姓名">
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;">
<el-radio-group v-model="form.sex" size="mini" text-color="#fff" :fill="color">
<el-radio-button label="先生"></el-radio-button>
<el-radio-button label="女士"></el-radio-button>
</el-radio-group>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">来访事由</div>
<div style="height: 2rem;width:100%;display: flex;" @click="selectShow = true">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.reason" readonly placeholder="请输入来访事由">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">到访时间</div>
<div style="height: 2rem;width:100%;display: flex;" @click="startClick">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.visitTime" placeholder="请选择到访时间">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 4rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #393939;align-items: center;display: flex;">
是否驾车
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;align-items: center;">
<el-switch v-model="form.isCar" :active-color="color"></el-switch>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;" v-if="form.isCar">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客车牌号</div>
<div style="height: 2rem;width:100%;display: flex;" @click="keysShow">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.licensePlate" placeholder="请选择车牌">
</div>
</div>
</div>
<div style="height: 7rem;width:90%;margin: auto;display: flex;align-items: center;">
<van-button :color="color" @click="submit" style="width: 100%;">提交申请</van-button>
</div>
</div>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
<apply-select :handlyChange="handlyChange" v-if="selectShow"></apply-select>
<vant2-datetime-picker ref="vant2DatetimePicker" :selectJson="selectJson" :confirm="confirm"></vant2-datetime-picker>
</div>
</template>
<script>
import axios from "axios";
import Keyboards from '../keyboards/keyboards.vue'
import ApplySelect from '../applySelect/applySelect.vue'
import Vant2DatetimePicker from '../vant2DatetimePicker/vant2DatetimePicker.vue'
import Vant2Select from '../vant2Select/vant2Select.vue'
export default {
data() {
return {
loading:false,
popShow:false,
selectShow:false,
selectJson:{},
color:"#00c76c",
lfTimeJson: { prop: "visitTime", title: "到访时间" },
url:"",
user:{},
form:{
name:"",
sex:"先生",
reason:"",
visitTime:"",
isCar:false,
licensePlate:"",
respondentsId:"",
visitorMode:2,
},
reasonObj:{},
openid:"",
showlist:[
{
}
]
};
},
components:{Keyboards,Vant2DatetimePicker,Vant2Select,ApplySelect},
activated() {
},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:1,name:"王德法",telphone:'18058587597',unit:'',fjNum:'101'}))
this.url = this.$store.state.url;
if(this.$route.query.id && this.$route.query.fjNum){
this.user = this.$route.query;
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
handlyChange(value){
this.selectShow = false;
this.reasonObj = value;
this.form.reason = this.reasonObj.name;
},
replacePhoneNumber(phone) {
return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
},
startClick(){
this.selectJson = this.lfTimeJson;
this.$refs.vant2DatetimePicker.show = true;
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
this.$router.push("/personalCenter");
},
onClickRight(){
this.$router.push("/applylog");
},
submitBack(val){
this.popShow = false;
this.form.licensePlate = val;
},
keysShow(){
this.popShow = true
},
submit(){
if(!this.form.name || !this.form.reason || !this.form.visitTime){
this.$toast.fail("必填项不能为空");
return
}
if(this.form.isCar){
if (!this.form.licensePlate){
this.$toast.fail("必填项不能为空");
return
}
}
this.form.reason = this.reasonObj.value;
this.form.respondentsId = this.user.id;
axios
.post(this.url + "/Visitor/AddVisitor", this.form)
.then((res) => {
let result = res.data;
if (result.code == 0) {
console.log(result.data)
this.$router.push("/success?content=申请");
// this.$router.push("/success?content=邀请&button=查看访客记录&url=/applylog");
} else {
this.$toast.fail(result.msg);
}
});
}
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
</style>

0
src/components/applyfor/applyforQsw.vue Normal file
View File

8
src/components/cartcontrol/cartcontrol.vue
View File

@ -26,7 +26,11 @@ export default {
methods: {
addCart(event) {
console.log(event.target);
if (!event._constructed) {
// if (!event._constructed) {
// return
// }
if(this.food.count==1){
this.$toast.fail("每样菜最多点一份");
return
}
if (!this.food.count) {
@ -36,7 +40,7 @@ export default {
this.$root.eventHub.$emit('cart.add', event.target)
},
decreaseCart() {
if (!event._constructed || !this.food.count) {
if (!this.food.count) {
return
}
this.food.count--;

54
src/components/echartsBlock/echartsBlock.vue Normal file
View File

@ -0,0 +1,54 @@
<template>
<div ref="chartEl" style="height:100%"></div>
</template>
<script>
import * as echarts from 'echarts'
const ChartBlock = {
name: 'ChartBlock',
props: {
option: {
type: Object,
default: () => {}
}
},
data() {
return {
chart: null,
// data: [5, 20, 36, 10, 10, 20, 5, 20, 36, 10, 20, 36, 10, 10, 20, 5, 20, 36, 10]
}
},
watch: {
option: {
handler(newValue, oldValue) {
this.chart.setOption(newValue)
},
// 因为option是个对象，而我们对于echarts的配置项，要更改的数据往往不在一级属性里面
// 所以这里设置了deep:true，vue文档有说明
deep: true
}
},
mounted() {
this.chart = echarts.init(this.$refs.chartEl)
this.chart.setOption(this.option)
this.chart.resize();
// setInterval(this.changeOption, 2000)
},
methods: {
/* changeOption() {
var r = Math.floor(Math.random() * 12)
// splice会改变原来的数组
// var data = this.data.splice(r,6);
var d = this.data.slice(r, r + 6)
this.option.series[0].data = d
console.log(this.option.series[0].data)
} */
}
}
/* 注册组件的方法 */
ChartBlock.install = (Vue) => {
Vue.component(ChartBlock.name, ChartBlock)
}
export default ChartBlock
</script>

216
src/components/filter/filter.vue Normal file
View File

@ -0,0 +1,216 @@
<template lang="html">
<div>
<div style="height: 100vh; width: 100%; background: #f7f8fa">
<div
style="
height: 3rem;
width: 90%;
display: flex;
align-items: center;
font-size: 14px;
color: rgba(69, 90, 100, 0.6);
margin: auto;
"
>
选择订餐日期/餐别
</div>
<van-field
v-model="date"
type="text"
name="订餐日期"
label="订餐日期"
placeholder="请选择订餐日期"
readonly
@click="changeDate"
/>
<van-field
v-model="type"
type="text"
name="餐别"
label="餐别"
readonly
placeholder="请选择餐别"
@click="changeType"
/>
<div
style="
width: 90%;
margin: auto;
display: flex;
justify-content: center;
margin-top: 3rem;
flex-wrap: wrap;
"
>
<van-button style="width: 80%" round block type="info" @click="onSubmit"
>订餐</van-button
>
<van-button
style="width: 80%; margin-top: 1rem"
round
block
type="warning"
@click="onYjSubmit"
>应急订餐</van-button
>
</div>
</div>
<van-datetime-picker
v-model="currentDate"
style="position: absolute; bottom: 0; width: 100%"
v-if="dateShow"
type="date"
title="选择年月日"
:min-date="minDate"
:max-date="maxDate"
@confirm="confirm"
@cancel="cancel"
/>
<van-picker
title="餐别"
v-if="typeShow"
style="position: absolute; bottom: 0; width: 100%"
show-toolbar
:columns="columns"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</template>
<script>
import axios from "axios";
import { Dialog } from "vant";
import { format } from "../../utils/date.js";
export default {
data() {
return {
columns: [],
dateShow: false,
typeShow: false,
minDate: new Date(),
maxDate: this.yearDate(),
currentDate: new Date(),
date: "",
type: "",
};
},
activated() {
this.getInit();
},
mounted() {this.getInit();},
methods: {
getInit() {
if (this.$route.query.id) {
localStorage.setItem(
"dc_personid",
JSON.stringify({
id: this.$route.query.id,
gh: this.$route.query.gh,
name: this.$route.query.name,
})
);
this.getCb();
} else {
this.$toast.fail("暂无人员信息");
}
},
yearDate() {
return new Date(new Date().getTime() + 1000 * 60 * 60 * 24 * 7);
},
getCb() {
let url = this.$store.state.url;
axios
.get(url + "/canteen/cb-select")
.then((res) => {
let data = res.data;
if (data.succeeded) {
this.columns = data.data;
} else {
this.$toast.fail(data.errors);
}
})
.catch((error) => {});
},
changeType() {
this.typeShow = true;
this.dateShow = false;
},
changeDate() {
this.dateShow = true;
this.typeShow = false;
},
onConfirm(val) {
this.typeShow = false;
this.type = val;
},
onCancel() {
this.typeShow = false;
},
confirm(val) {
this.dateShow = false;
this.date = format(val);
},
cancel() {
this.dateShow = false;
},
onYjSubmit() {
let url = this.$store.state.url;
axios.get(url + "/canteen/yj-day-menu-details", {}).then((res) => {
let data = res.data;
if (data.succeeded) {
let date = data.data.date;
let cb = data.data.cb;
Dialog.confirm({
title: "应急订餐",
message: "确定订" + date + cb + "？",
})
.then(() => {
localStorage.setItem(
"updateCanteen",
JSON.stringify({ date: date, cb: cb })
);
this.$router.push(
"/goods?date=" + date + "&cb=" + cb + "&type=0"
);
})
.catch(() => {
// on cancel
});
} else {
this.$toast.fail(data.errors);
}
});
},
onSubmit() {
if (!this.type || !this.date) {
this.$toast.fail("必填项不能为空");
return;
}
let url = this.$store.state.url;
axios
.get(url + "/canteen/day-menu-details", {
params: { date: this.date, cb: this.type },
})
.then((res) => {
let data = res.data;
if (data.succeeded) {
let menus = data.data.menus;
localStorage.setItem(
"updateCanteen",
JSON.stringify({ date: this.date, cb: this.type })
);
this.$router.push("/goods?date=" + this.date + "&cb=" + this.type);
} else {
this.$toast.fail(data.errors);
}
});
},
},
};
</script>
<style lang="stylus" scoped></style>

26
src/components/food/food.vue
View File

@ -1,26 +0,0 @@
<template lang="html">
<div class="food" v-show="showDetails">
</div>
</template>
<script>
export default {
props: {
food: Object
}
}
</script>
<style lang="stylus" scoped>
.food
position fixed
left 0
top 0
right 0
bottom 48px
width 100%
background white
z-index 30
</style>

81
src/components/formView/formView.vue Normal file
View File

@ -0,0 +1,81 @@
<template>
<div style="width: 100%;height: auto;display: flex;flex-wrap: wrap;align-items: flex-end;">
<el-form :model="forms.form" ref="ruleForm" :rules="forms.rules">
<el-form-item :label="item.lable" :prop="item.prop" v-for="(item,index) in forms.items">
<el-input v-if="item.type=='input'" v-model="object[item.prop]" :placeholder="'请选择'+item.lable" :type="item.inputType"></el-input>
<el-select v-model="value" placeholder="请选择" v-if="item.type=='select'">
<el-option
v-for="(a,i) in item.options"
:key="item.value"
:label="a.label"
:value="a.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">提交</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: "searchBar",
props: ['forms','submit'],
data() {
return {
object:{},
color:'#1372bb',
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now();
},
shortcuts: [{
text: '今天',
onClick(picker) {
picker.$emit('pick', new Date());
}
}, {
text: '昨天',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
picker.$emit('pick', date);
}
}, {
text: '一周前',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', date);
}
}]
},
};
},
computed: {},
mounted() {
if (localStorage.getItem("theme")) {
this.color = localStorage.getItem("theme");
}
},
methods: {
onSubmit(){
this.submit(this.object);
},
changePay(val){
this.$forceUpdate();
},
search(){
this.handleSearch(this.object);
},
change(val){
this.appoint_change(val)
},
}
};
</script>
<style scoped></style>

259
src/components/goods/goods copy.vue Normal file
View File

@ -0,0 +1,259 @@
<template lang="html">
<div class="goods">
<div class="menu-wrapper" ref="menuWrapper">
<ul>
<li v-for="(item,index) in goods" @click="menuClick(index,$event)" :class="index==menuCurrentIndex?'menu-item-selected':'menu-item'">
<span class="text">
<iconMap v-show="item.type>0" :iconType="item.type"></iconMap>
{{item.name}}
</span>
</li>
</ul>
</div>
<div class="foods-wrapper" id="wrapper" ref="foodsWrapper">
<ul>
<li v-for="item in goods" class="food-list food-list-hook">
<h1>{{item.name}}</h1>
<ul>
<li v-for="food in item.foods" class="food-item" @click="goDetail(food)">
<div class="icon">
<img width="57" height="57" :src="food.icon"/>
</div>
<div class="content">
<h2>{{food.name}}</h2>
<p class="description" v-show="food.description">{{food.description}}</p>
<div class="sell-info">
<span class="sellCount">月售{{food.sellCount}}份</span>
<span class="rating">好评率{{food.rating}}%</span>
</div>
<div class="price">
<span class="newPrice"><span class="unit">￥</span>{{food.price}}</span>
<span v-show="food.oldPrice" class="oldPrice">￥{{food.oldPrice}}</span>
</div>
<div class="cartcontrol-wrapper">
<cartcontrol :food="food"></cartcontrol>
</div>
</div>
</li>
</ul>
</li>
</ul>
</div>
<shopCart :deliveryPrice="seller.deliveryPrice" :minPrice = "0" :selectFoods="selectFoods"></shopCart>
<foodDetail :food="selectedFood" v-if="selectedFood" ref="myFood"></foodDetail>
</div>
</template>
<script>
import iconMap from 'components/iconMap/iconMap'
import BScroll from 'better-scroll'
import shopCart from 'components/shopCart/shopCart'
import cartcontrol from 'components/cartcontrol/cartcontrol'
import foodDetail from 'components/foodDetail/foodDetail'
import axios from 'axios'
import Vue from 'vue'
const ERR_OK = 0
const eventHub = new Vue()
export default {
props: {
seller: Object
},
mounted(){
axios.get('static/data.json').then((res) => {
this.goods = res.data.goods
this.$nextTick(() => {
this._initScroll(); // 初始化scroll
this._calculateHeight(); // 初始化列表高度列表
})
});
},
created() {
},
data() {
return {
goods: [],
listHeight: [],
foodsScrollY: 0,
selectedFood: ''
}
},
computed: {
menuCurrentIndex() {
for (let i = 0, l = this.listHeight.length; i < l; i++) {
let topHeight = this.listHeight[i]
let bottomHeight = this.listHeight[i + 1]
if (!bottomHeight || (this.foodsScrollY >= topHeight && this.foodsScrollY < bottomHeight)) {
return i
}
}
return 0
},
selectFoods() {
let foods = []
this.goods.forEach((good) => {
good.foods.forEach((food) => {
if (food.count) {
foods.push(food)
}
})
})
return foods
}
},
methods: {
_initScroll() {
this.menuWrapper = new BScroll(this.$refs.menuWrapper, {
click: true
});
this.foodsScroll = new BScroll(this.$refs.foodsWrapper, {
click: true,
probeType: 3
});
// 监控滚动事件
this.foodsScroll.on('scroll', (pos) => {
this.foodsScrollY = Math.abs(Math.round(pos.y))
})
},
_calculateHeight() {
let foodList = this.$refs.foodsWrapper.querySelectorAll('.food-list-hook')
let height = 0
this.listHeight.push(height)
for (let i = 0, l = foodList.length; i < l; i++) {
let item = foodList[i]
height += item.clientHeight
this.listHeight.push(height)
}
},
menuClick(index, event) {
if (!event._constructed) {
return
}
this.foodsScroll.scrollTo(0, -this.listHeight[index], 300)
},
goDetail(food) {
this.selectedFood = food
this.$nextTick(() => {
this.$refs.myFood.showToggle()
})
}
},
components: {
iconMap,
shopCart,
cartcontrol,
foodDetail
}
}
</script>
<style lang="stylus">
@import '../../common/stylus/mixin'
.goods
display flex
position absolute
top 174px
bottom 46px
width 100%
overflow hidden
.menu-wrapper
flex 0 0 80px
width 80px
background #f8f8f8
margin-top: 2px;
.menu-item-selected
background white
font-weight 700
margin-top -1px
.menu-item,.menu-item-selected
position relative
display table
height 54px
line-height 14px
width 56px
padding 0 12px
&:last-child:after
content none
.menu-item:after
position: absolute
content: ''
left: 12px
width: 56px
bottom: 0
border-bottom: 1px solid rgba(7,17,27,0.1)
.text
display table-cell
vertical-align middle
font-size 12px
font-weight 200
white-space normal
line-height 14px
.iconMap
vertical-align middle
.foods-wrapper
flex 1
margin-top: 2px;
.food-list
h1
height 26px
line-height 26px
padding-left 12px
font-size 12px
color rgb(147,153,159)
background #f3f5f7
border-left 2px solid #d9dde1
.food-item
position relative
display flex
margin: 0 18px;
padding: 18px 0;
border-bottom 1px solid rgba(7,17,27,0.1)
.icon
flex 0 0 57px
&:last-child
border-bottom none
.content
flex 1
padding-left 10px
h2
margin 2px 0 8px 0
font-size 14px
line-height 14px
height 14px
font-weight 700
color rgb(7,17,27)
.sell-info,.description
font-size 10px
color rgb(147,153,159)
line-height 10px
.sellCount
margin-right 4px
.description
font-size 10px
margin-bottom 8px
line-height: 12px
.price
font-size 10px
font-weight 700
line-height 24px
.newPrice
font-size 14px
color rgb(240,20,20)
.unit
font-size 10px
font-weight normal
.oldPrice
text-decoration line-through
color rgb(147,153,159)
padding-left 4px
.cartcontrol-wrapper
position: absolute
right: 0
bottom 12px
z-index 20
</style>

99
src/components/goods/goods.vue
View File

@ -1,31 +1,31 @@
<template lang="html">
<div class="goods">
<div class="menu-wrapper" ref="menuWrapper">
<!-- <div class="menu-wrapper" ref="menuWrapper">
<ul>
<li v-for="(item,index) in goods" @click="menuClick(index,$event)" :class="index==menuCurrentIndex?'menu-item-selected':'menu-item'">
<span class="text">
<iconMap v-show="item.type>0" :iconType="item.type"></iconMap>
<iconMap v-show="item.type>0" :iconType="item.type"></iconMap>
{{item.name}}
</span>
</li>
</ul>
</div>
<div class="foods-wrapper" id="wrapper" ref="foodsWrapper">
<ul>
</div> -->
<div class="foods-wrapper" id="wrapper" ref="foodsWrapper" style="overflow-y: scroll;">
<ul >
<li v-for="item in goods" class="food-list food-list-hook">
<h1>{{item.name}}</h1>
<ul>
<li v-for="food in item.foods" class="food-item" @click="goDetail(food)">
<li v-for="food in item.foods" class="food-item" >
<div class="icon">
<img width="57" height="57" :src="food.icon"/>
<img width="57" height="57" :src="food.picUrl?food.picUrl:'../../../static/img/no_image.png'"/>
</div>
<div class="content">
<h2>{{food.name}}</h2>
<h2>{{food.dishesName}}</h2>
<p class="description" v-show="food.description">{{food.description}}</p>
<div class="sell-info">
<span class="sellCount">月售{{food.sellCount}}份</span>
<span class="rating">好评率{{food.rating}}%</span>
<span class="sellCount">剩余{{food.num}}份</span>
<!-- <span class="rating">好评率{{food.rating}}%</span> -->
</div>
<div class="price">
<span class="newPrice"><span class="unit">￥</span>{{food.price}}</span>
@ -38,9 +38,10 @@
</li>
</ul>
</li>
</ul>
</div>
<shopCart :deliveryPrice="seller.deliveryPrice" :minPrice = "seller.minPrice" :selectFoods="selectFoods"></shopCart>
<shopCart :deliveryPrice="seller.deliveryPrice" :minPrice = "0" :selectFoods="selectFoods" :menuId="menuId" :type="type"></shopCart>
<foodDetail :food="selectedFood" v-if="selectedFood" ref="myFood"></foodDetail>
</div>
@ -61,21 +62,56 @@ export default {
props: {
seller: Object
},
created() {
axios.get('static/data.json').then((res) => {
this.goods = res.data.goods
mounted(){
// axios.get('static/data.json').then((res) => {
// this.goods = res.data.goods
// this.$nextTick(() => {
// this._initScroll(); // 初始化scroll
// this._calculateHeight(); // 初始化列表高度列表
// })
// });
},
activated(){
this.url = this.$store.state.url;
if(this.$route.query.type){
this.type = this.$route.query.type;
}
if(this.$route.query.date && this.$route.query.cb){
this.parm = this.$route.query;
} else{
if(localStorage.getItem('updateCanteen')){
this.parm = JSON.parse(localStorage.getItem('updateCanteen'));
}
}
if(this.parm){
axios.get(this.url+'/canteen/day-menu-details',{params:this.parm}).then((res) => {
this.goods = res.data.data.menus;
this.menuId = res.data.data.menuId;
this.$nextTick(() => {
this._initScroll(); // 初始化scroll
// this._initScroll(); // 初始化scroll
this._calculateHeight(); // 初始化列表高度列表
})
});
}
},
created() {
},
data() {
return {
goods: [],
listHeight: [],
foodsScrollY: 0,
selectedFood: ''
selectedFood: '',
parm:{},
menus:[],
url:'',
menuId:0,
type:''
}
},
computed: {
@ -102,19 +138,19 @@ export default {
}
},
methods: {
_initScroll() {
this.menuWrapper = new BScroll(this.$refs.menuWrapper, {
click: true
});
this.foodsScroll = new BScroll(this.$refs.foodsWrapper, {
click: true,
probeType: 3
});
// 监控滚动事件
this.foodsScroll.on('scroll', (pos) => {
this.foodsScrollY = Math.abs(Math.round(pos.y))
})
},
// _initScroll() {
// this.menuWrapper = new BScroll(this.$refs.menuWrapper, {
// click: true
// });
// this.foodsScroll = new BScroll(this.$refs.foodsWrapper, {
// click: true,
// probeType: 3
// });
// // 监控滚动事件
// this.foodsScroll.on('scroll', (pos) => {
// this.foodsScrollY = Math.abs(Math.round(pos.y))
// })
// },
_calculateHeight() {
let foodList = this.$refs.foodsWrapper.querySelectorAll('.food-list-hook')
let height = 0
@ -129,6 +165,7 @@ export default {
if (!event._constructed) {
return
}
console.log(this.listHeight[index])
this.foodsScroll.scrollTo(0, -this.listHeight[index], 300)
},
goDetail(food) {
@ -153,14 +190,14 @@ export default {
.goods
display flex
position absolute
top 174px
top 140px
bottom 46px
width 100%
overflow hidden
.menu-wrapper
flex 0 0 80px
width 80px
background #F3F5BD
background #f8f8f8
margin-top: 2px;
.menu-item-selected
background white

48
src/components/header/header.vue
View File

@ -6,26 +6,35 @@
<div class="content">
<div class="title">
<span class="brand"></span>
<span class="name">{{seller.name}}</span>
<!-- <span class="name">{{seller.name}}</span> -->
<span class="name">先锋食堂</span>
</div>
<div class="description">
<!-- <div class="description">
{{seller.description + ' / ' + seller.deliveryTime + '分钟送达'}}
</div>
<div class="supports" v-if="seller.supports">
</div> -->
<div class="description">
姓名：{{person.name}}
</div>
<div class="description">
工号：{{person.gh}}
</div>
<!-- <div class="supports" v-if="seller.supports">
<div class="supports_desc">
<span class="icon" :class="iconClassMap[seller.supports[0].type]"></span>
<span class="text">{{seller.supports[0].description}}</span>
</div>
</div>
</div> -->
</div>
<div class="support-count" v-if="seller.supports" @click="showDetails()">
<span class="count">{{seller.supports.length+'个'}}</span>
<div class="support-count" v-if="seller.supports" @click="showOrderList()">
<!-- <span class="count">{{seller.supports.length+'个'}}</span> -->
<span class="count">我的订单</span>
<i class="icon-keyboard_arrow_right"></i>
</div>
</div>
<div class="bulletin-wrapper" @click="showDetails()">
<span class="bulletin-title"></span>
<span class="bulletin-text">{{seller.bulletin}}</span>
<!-- <span class="bulletin-text">{{seller.bulletin}}</span> -->
<span class="bulletin-text"></span>
<i class="icon-keyboard_arrow_right"></i>
</div>
<div class="background">
@ -35,27 +44,28 @@
<div v-if="detailShow" class="detail">
<div class="detail-wrapper clearfix">
<div class="detail-main">
<h1 class="name">{{seller.name}}</h1>
<h1 class="name">先锋食堂</h1>
<div class="star-wrapper">
<star :size="48" :score="seller.score"></star>
<star :size="48" :score="5"></star>
</div>
<div class="title">
<div class="line"> </div>
<div class="text">优惠信息</div>
<div class="line"></div>
</div>
<ul v-if="seller.supports" class="supports">
<!-- <ul v-if="seller.supports" class="supports">
<li class="support-item" v-for="item in seller.supports">
<span class="icon" :class="iconClassMap[item.type]"></span>
<span class="text">{{item.description}}</span>
</li>
</ul>
</ul> -->
<div class="title">
<div class="line"> </div>
<div class="text">商家公告</div>
<div class="line"></div>
</div>
<div class="bulletin">{{seller.bulletin}}</div>
<!-- <div class="bulletin">{{seller.bulletin}}</div> -->
<div class="bulletin">暂无公告</div>
</div>
</div>
<div class="detail-close">
@ -78,16 +88,26 @@ export default {
},
created() {
this.iconClassMap = ['decrease', 'discount', 'special', 'invoice', 'guarantee']
if(localStorage.getItem("dc_personid")){
this.person = JSON.parse(localStorage.getItem("dc_personid"));
} else{
this.$toast.fail("暂无人员信息");
return
}
},
components: {
star
},
data() {
return {
detailShow: false
detailShow: false,
person:{},
}
},
methods: {
showOrderList(){
this.$router.push('/orderList');
},
showDetails() {
this.detailShow = true;
},

209
src/components/invite/inviteJf.vue Normal file
View File

@ -0,0 +1,209 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-if="!selectShow">
<van-nav-bar
title=""
right-text="访客记录"
left-arrow
@click-left="onClickLeft"
@click-right="onClickRight"
/>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">访客通行</div>
<div style="height: 4rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 1.5rem;width:90%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">慈溪浅水湾-住宅-{{user.fjNum}}</div>
<div style="height: 1.5rem;width:90%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">{{user.name}}，{{user.telphone}}</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客姓名</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.name" placeholder="请输入访客姓名">
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;">
<el-radio-group v-model="form.sex" size="mini" text-color="#fff" :fill="color">
<el-radio-button label="先生"></el-radio-button>
<el-radio-button label="女士"></el-radio-button>
</el-radio-group>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">来访事由</div>
<div style="height: 2rem;width:100%;display: flex;" @click="selectShow = true">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.reason" readonly placeholder="请输入来访事由">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">到访时间</div>
<div style="height: 2rem;width:100%;display: flex;" @click="startClick">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.visitTime" placeholder="请选择到访时间">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 4rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #393939;align-items: center;display: flex;">
是否驾车
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;align-items: center;">
<el-switch v-model="form.isCar" :active-color="color"></el-switch>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;" v-if="form.isCar">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客车牌号</div>
<div style="height: 2rem;width:100%;display: flex;" @click="keysShow">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.licensePlate" placeholder="请选择车牌">
</div>
</div>
</div>
<div style="height: 7rem;width:90%;margin: auto;display: flex;align-items: center;">
<van-button :color="color" @click="submit" style="width: 100%;">邀请访客</van-button>
</div>
</div>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
<apply-select :handlyChange="handlyChange" v-if="selectShow"></apply-select>
<vant2-datetime-picker ref="vant2DatetimePicker" :selectJson="selectJson" :confirm="confirm"></vant2-datetime-picker>
</div>
</template>
<script>
import axios from "axios";
import Keyboards from '../keyboards/keyboards.vue'
import Vant2DatetimePicker from '../vant2DatetimePicker/vant2DatetimePicker.vue'
import Vant2Select from '../vant2Select/vant2Select.vue'
import ApplySelect from '../applySelect/applySelect.vue'
export default {
data() {
return {
loading:false,
popShow:false,
selectShow:false,
selectJson:{},
color:"#00c76c",
lfTimeJson: { prop: "visitTime", title: "到访时间" },
url:"",
user:{},
form:{
name:"",
sex:"先生",
reason:"",
visitTime:"",
isCar:false,
licensePlate:"",
respondentsId:"",
visitorMode:1
},
reasonObj:{},
openid:"",
showlist:[
{
}
]
};
},
components:{Keyboards,Vant2DatetimePicker,Vant2Select,ApplySelect},
activated() {
},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:1,name:"王德法",telphone:'18058587597',unit:'',fjNum:'101'}))
this.url = this.$store.state.url;
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
handlyChange(value){
this.selectShow = false;
this.reasonObj = value;
this.form.reason = this.reasonObj.name;
},
replacePhoneNumber(phone) {
return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
},
startClick(){
this.selectJson = this.lfTimeJson;
this.$refs.vant2DatetimePicker.show = true;
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
this.$router.push("/personalCenter");
},
onClickRight(){
this.$router.push("/applylog");
},
submitBack(val){
this.popShow = false;
this.form.licensePlate = val;
},
keysShow(){
this.popShow = true
},
submit(){
if(!this.form.name || !this.form.reason || !this.form.visitTime){
this.$toast.fail("必填项不能为空");
return
}
if(this.form.isCar){
if (!this.form.licensePlate){
this.$toast.fail("必填项不能为空");
return
}
}
this.form.reason = this.reasonObj.value;
this.form.respondentsId = this.user.id;
axios
.post(this.url + "/Visitor/AddVisitor", this.form)
.then((res) => {
let result = res.data;
if (result.code == 0) {
console.log(result.data)
this.$router.push("/applyQrcode?code="+result.data+"&visitTime="+this.form.visitTime+"&name="+this.form.name+"&sex="+this.form.sex);
// this.$router.push("/success?content=邀请&button=查看访客记录&url=/applylog");
} else {
this.$toast.fail(result.msg);
}
});
}
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
</style>

415
src/components/keyboards/keyboards.vue Normal file
View File

@ -0,0 +1,415 @@
<template>
<div id="container">
<div id="carLicenseBox">
<div class="carLicenseMain">
<ul>
<li class="active">省</li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li class="xinnengyuan"></li>
</ul>
</div>
<button class="submitBtn" id="submitBtn">确定</button>
</div>
<!--键盘-->
<div id="keyboardBox">
<div class="provienceBox" id="provienceBox">
<ul>
<li>京</li>
<li>津</li>
<li>渝</li>
<li>沪</li>
<li>冀</li>
<li>晋</li>
<li>辽</li>
<li>吉</li>
<li>黑</li>
<li>苏</li>
</ul>
<ul>
<li>浙</li>
<li>皖</li>
<li>闽</li>
<li>赣</li>
<li>鲁</li>
<li>豫</li>
<li>鄂</li>
<li>湘</li>
<li>粤</li>
<li>琼</li>
</ul>
<ul>
<li>川</li>
<li>贵</li>
<li>云</li>
<li>陕</li>
<li>甘</li>
<li>青</li>
<li>蒙</li>
<li>桂</li>
<li>宁</li>
<li>新</li>
</ul>
<ul>
<li class="changeContentBtn other">ABC</li>
<li>藏</li>
<li>使</li>
<li>领</li>
<li>警</li>
<li>学</li>
<li>港</li>
<li>澳</li>
<li class="deleteBtn other">删除</li>
</ul>
</div>
<div class="textBox" id="textBox">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>0</li>
</ul>
<ul>
<li>Q</li>
<li>W</li>
<li>E</li>
<li>R</li>
<li>T</li>
<li>Y</li>
<li>U</li>
<!-- <li>I</li> -->
<!-- <li>O</li> -->
<li>P</li>
</ul>
<ul>
<li>A</li>
<li>S</li>
<li>D</li>
<li>F</li>
<li>G</li>
<li>H</li>
<li>J</li>
<li>K</li>
<li>L</li>
</ul>
<ul>
<li class="changeContentBtn other">返回</li>
<li>Z</li>
<li>X</li>
<li>C</li>
<li>V</li>
<li>B</li>
<li>N</li>
<li>M</li>
<li class="deleteBtn other">删除</li>
</ul>
</div>
</div>
</div>
</template>
<script>
// import { submitCarNumber } from '../../api/global'
import { Toast } from 'vant';
import $ from '../../../static/js/jquery-3.3.1.min.js';
export default {
data() {
return {
}
},
props:['submitBack'],
mounted(){
let that = this;
$(document).ready(function() {
//键盘隐藏，点击触发显示
// $("#keyboardBox").hide()
// $(".carLicenseMain").on("click",function(){
// $("#keyboardBox").show()
// })
//键盘点击动画
$(".textBox ul li").each(function(){
$(this).click(function(){
$(this).addClass("activeKey")//添加动画效果
$(this).siblings().removeClass("activeKey")//移除动画效果
var interval=setTimeout(function(){//定时器及时清除自身动画效果
$(this).removeClass("activeKey")
window.clearInterval(interval)
}.bind(this),200);
})
})
var num = 7;//需要输入的车牌数
//切换键盘
$('.changeContentBtn').click(function(){
$('li').siblings().removeClass("activeKey")
if($(this).html()=='ABC'){
$('#textBox').show();
$('#provienceBox').hide();
}else{
$('#textBox').hide();
$('#provienceBox').show();
}
})
//新能源点击事件
$('.xinnengyuan').click(function(){
num = 7;
$(this).removeClass('xinnengyuan');
})
//获取当前车牌数字索引
function getIndex(){
var index = 0;
$('.carLicenseMain ul li').each(function(){
var reg = new RegExp('active');
if(reg.test($(this).attr('class'))){
index = $(this).index();
}
})
return index;
}
//自定义键盘处理函数
function keyboard(num,self){
var index = getIndex();
if(index<=num){
if(index == num){
$('.carLicenseMain ul li.active').html($(self).html());
}else{
$('.carLicenseMain ul li.active').html($(self).html()).removeClass('active').next().addClass('active');
}
$('#textBox').show();
$('#provienceBox').hide();
}
}
//省份键盘点击事件
$('#provienceBox ul li:not(.other)').click(function(){
$(this).addClass("activeKey")//添加动画效果
$(this).siblings().removeClass("activeKey")//移除动画效果
var interval=setTimeout(function(){//定时器及时清除自身动画效果
$(this).removeClass("activeKey")
var self = this;
keyboard(num,self);
window.clearInterval(interval)
}.bind(this),200);
//省份点击后键盘切换
//var self = this;
//keyboard(num,self);
})
//文本键盘点击事件
$('#textBox ul li:not(.other)').click(function(){
var self = this;
keyboard(num,self);
})
//回退按钮点击事件
$('.deleteBtn').click(function(){
var index = getIndex();
if(index == num){
if($('.carLicenseMain ul li.active').html() != ''){
$('.carLicenseMain ul li.active').html('');
}else{
if(index == 7){
$('.carLicenseMain ul li:last-of-type').addClass('xinnengyuan');
num = 7;
}
$('.carLicenseMain ul li.active').removeClass('active').prev().addClass('active').html('');
}
}else if(index < num && index > 1){
$('.carLicenseMain ul li.active').removeClass('active').prev().addClass('active').html('');
}else if(index == 1){
$('.carLicenseMain ul li.active').removeClass('active').prev().addClass('active').html('省');
}
})
//提交按钮点击事件
$('#submitBtn').click(function(){
var carNum=""
$(".carLicenseMain ul li").each(function(index){
carNum+=$(this).html()
})
that.back(carNum);
})
})
},
methods: {
back(number){
this.submitBack(number);
},
}
}
</script>
<style scoped>
ul,ol{
list-style: none;
}
*{
padding: 0;
margin: 0;
}
#container{
width: 100%;
height: 100%;
/* padding-top: 50px; */
}
#carLicenseBox{
width: 80%;
/*height: 100%;*/
border-radius: 10px;
margin: 0 auto;
padding-bottom: 20px;
overflow: hidden;
background-color: #ffffff;
}
#carLicenseBox .carLicenseTitle{
width: 100%;
height: 70px;
background-color: #fff;
text-align: center;
line-height: 70px;
color: black;
font-size: 18px;
}
#carLicenseBox .carLicenseMain{
width: 100%;
height: 160px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
#carLicenseBox .carLicenseMain ul{
width: 100%;
height: 36px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
#carLicenseBox .carLicenseMain ul li{
width: 34px;
height: 40px;
border: 1px solid #cccccc;
text-align: center;
line-height: 40px;
float: left;
}
#carLicenseBox .carLicenseMain ul li:last-of-type{
margin: 0;
}
#carLicenseBox .carLicenseMain ul li.active{
border: 2px solid #f3483e;
}
#carLicenseBox .carLicenseMain ul li.xinnengyuan{
background: #9eefa4;
background-size: 100% 100%;
border: 2px dashed #CCCCCC;
}
#carLicenseBox .submitBtn{
width: 80%;
height: 45px;
background-color: #1191fe;
border: none;
border-radius: 6px;
text-align: center;
line-height: 45px;
color: white;
font-size: 20px;
margin-left: 10%;
}
#keyboardBox{
width: 100%;
position: absolute;
bottom: 0px;
left: 0px;
z-index: 999;
}
#keyboardBox .provienceBox,#keyboardBox .textBox{
width: 100%;
background-color: #D0D5D9;
padding-top: 10px;
padding-bottom: 4px;
}
#keyboardBox .provienceBox ul,#keyboardBox .textBox ul{
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
margin-top: 10px;
}
#keyboardBox .provienceBox ul:first-of-type, #keyboardBox .textBox ul:first-of-type{
margin-top: 0px;
}
#keyboardBox .provienceBox ul li,#keyboardBox .textBox ul li{
width: 30px;
height: 43px;
border-radius: 6px;
text-align: center;
line-height: 43px;
float: left;
background-color: #ffffff;
}
#keyboardBox .textBox{
display: none;
}
#keyboardBox .provienceBox ul .changeContentBtn,#keyboardBox .provienceBox ul .deleteBtn,#keyboardBox .textBox ul .changeContentBtn,#keyboardBox .textBox ul .deleteBtn{
width: 40px;
height: 40px;
background-color: #ACB3BB;
text-align: center;
line-height: 40px;
}
#keyboardBox .provienceBox ul .deleteBtn img,#keyboardBox .textBox ul .deleteBtn img{
width: 23px;
height: 16px;
margin: 0px;
margin-top: 12px;
}
.img-jpg{
width: 80%;
margin: 0 auto;
}
.img-jpg img{
width: 100%;
}
.textBox ul li:click{
background: #0088CC;
}
@keyframes scaleDraw { /*定义关键帧、scaleDrew是需要绑定到选择器的关键帧名称*/
0%{
transform: scale(1); /*开始为原始大小*/
}
25%{
transform: scale(1.3); /*放大1.1倍*/
}
50%{
transform: scale(1.3);
}
100%{
transform: scale(1);
}
}
.activeKey{
background-color: #ACB3BB !important;
/*background: #999 !important;*/
opacity: 0.8;
color: #fff;
-webkit-animation-name: scaleDraw; /*关键帧名称*/
-webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
-webkit-animation-duration: 0.2s; /*动画所花费的时间*/
}
</style>

150
src/components/orderDetail/orderDetail.vue Normal file
View File

@ -0,0 +1,150 @@
<template lang="html">
<div style="background-color:#f4f4f4 ;height: auto;min-height: 100vh;" >
<div style="width: 90%;height: 3rem;margin: auto;display: flex;align-items: center;">
<div style="width:10%;height:100%;display: flex;align-items: center;" @click="back"> <i class="el-icon-arrow-left" style="font-size: 1.2rem;"></i></div>
<div style="width: 90%;height:2rem ;border-radius: 1rem;display: flex;align-items: center;">
</div>
</div>
<div style="width: 90%;height: 2rem;margin: auto;font-size: 1.2rem;font-weight: bold;">
{{state}} <i class="el-icon-arrow-right" style="font-size:0.8rem;color: #000;"></i>
</div>
<div style="height: auto;width: 90%;margin: auto;">
<div style="height: auto;width: 100%;">
<div style="width:100%;height:0.7rem"></div>
<div style="width:100%;height:auto;background:#fff;border-radius: 0.5rem;">
<div style="width: 90%;height:0.7rem;"></div>
<div style="width: 90%;height:1rem;font-size: 0.9rem;color: #565658;display: flex;align-items: center;margin: auto;">感谢您的信任，期待再次光临。</div>
<div style="width: 90%;height:1rem;font-size: 0.7rem;color: #858688;display: flex;align-items: center;margin: auto;">温馨提示：请厉行节约，拒绝浪费。</div>
<div style="width: 90%;height:1.2rem;display: flex;align-items: center;margin: auto;">
<div style="width: 90%;height:1px;width: 100%;background-color: #f1f1f1;"></div>
</div>
<div style="width: 90%;height: auto;display: flex;flex-wrap: wrap;margin: auto;">
<!-- <div style="width: 20%;height:3rem;">
<div style="width: 100%;height: 50%;display: flex;align-items: center;justify-content: center;">
<van-icon name="cash-back-record" size="1.6rem" color="orange"/>
</div>
<div style="width: 100%;height: 50%;display: flex;align-items: center;justify-content: center;font-size: 0.7rem;color: orange;">
再来一单
</div>
</div> -->
<div style="width: 20%;height:3rem;" @click="evaluate">
<div style="width: 100%;height: 50%;display: flex;align-items: center;justify-content: center;">
<van-icon name="chat" size="1.6rem" color="orange"/>
</div>
<div style="width: 100%;height: 50%;display: flex;align-items: center;justify-content: center;font-size: 0.7rem;color: orange;">
评价
</div>
</div>
</div>
<div style="width: 90%;height:0.7rem;"></div>
</div>
</div>
</div>
<div style="height: auto;width: 90%;margin: auto;">
<div style="height: auto;width: 100%;">
<div style="width:100%;height:0.7rem"></div>
<div style="width:100%;height:auto;background:#fff;border-radius: 0.5rem;">
<div style="width: 90%;height:0.7rem;"></div>
<div style="width: 90%;height:2rem;font-size: 0.9rem;display: flex;align-items: center;margin: auto;font-weight: bold;border-bottom: 1px solid #f1f1f1;">订单详情 </div>
<div style="width: 90%;height:auto;margin: auto;">
<div style="width:100%;height:0.7rem"></div>
<van-card
:num="item.num"
:price="item.price+'.00'"
desc=" "
:title="item.dishesName"
:thumb="item.picUrl?item.picUrl:'../../../static/img/no_image.png'"
v-for="(item,index) in list"
>
<template #tags>
<!-- <van-tag plain type="danger">热</van-tag> -->
<van-tag plain type="success" v-if="item.type=='素菜'">素</van-tag>
<van-tag plain type="warning" v-if="item.type=='荤菜'">荤</van-tag>
</template>
<!-- <template #footer>
<van-button plain type="warning" size="small">评价</van-button>
</template> -->
</van-card>
<div style="width:90%;height:0.7rem;margin: auto;border-bottom: 1px solid #f1f1f1;"></div>
</div>
<div style="width: 90%;height:2rem;display: flex;align-items: center;justify-content: flex-end;color: #323232;font-size: 1rem;">合计 <span style="color: #000;font-size: 1rem;">￥{{orderPrice?orderPrice:0}}.00</span></div>
<div style="width: 90%;height:0.7rem;"></div>
</div>
</div>
</div>
<div style="width: 90%;height:1rem;"></div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
list:[],
url: "",
orderId:0,
state:'',
orderPrice:0
};
},
activated(){
this.url = this.$store.state.url;
this.orderId = this.$route.query.orderId;
this.orderPrice = this.$route.query.orderPrice;
let orderStatus = this.$route.query.orderStatus;
if(this.orderId && orderStatus){
this.getData();
switch(orderStatus){
case '正常':
this.state = '订单进行中';
break;
case '撤销':
this.state = '订单关闭';
break;
case '消费':
this.state = '订单完成';
break;
}
} else{
this.$toast.fail("未查询到订单信息");
}
},
created(){
},
mounted() {
},
methods: {
evaluate(){
this.$toast("功能维护中");
},
getData() {
axios
.get(this.url + "/canteen/order-details/" + this.orderId, { })
.then((res) => {
let data = res.data;
if (data.succeeded) {
this.list = data.data;
} else {
this.$toast.fail(data.errors);
}
});
},
back(){
this.$router.push('/orderList');
},
},
};
</script>
<style lang="stylus" scoped></style>

422
src/components/orderList/orderList.vue Normal file
View File

@ -0,0 +1,422 @@
<template lang="html">
<div style="background-color: #f4f4f4; height: auto; min-height: 100vh">
<div
style="
width: 90%;
height: 3rem;
margin: auto;
display: flex;
align-items: center;
"
>
<div
style="width: 10%; height: 100%; display: flex; align-items: center"
@click="back"
>
<i class="el-icon-arrow-left" style="font-size: 1.2rem"></i>
</div>
<div
style="
width: 90%;
height: 2rem;
background-color: #fff;
border-radius: 1rem;
display: flex;
align-items: center;
"
>
<div
style="
width: 15%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
"
>
<i class="el-icon-search" style="font-size: 1.2rem"></i>
</div>
<div
style="width: 85%; height: 100%; display: flex; align-items: center" @click="changeDate"
>
<input
type="text"
style="
width: auto;
flex: 1;
height: 100%;
border-radius: 1rem;
font-size: 0.8rem;
"
disabled
v-model="page.date"
placeholder="选择日期搜索我的订单"
/>
</div>
</div>
</div>
<div style="width: 100%; height: 3.5rem">
<van-tabs
v-model="active"
animated
background="#f4f4f4"
color="#f7d144"
@change="changeTabs"
>
<van-tab
v-for="(item, index) in tabList"
:title="item"
title-style="font-size:0.8rem;font-weight:bold"
>
</van-tab>
</van-tabs>
</div>
<div style="height: auto; width: 90%; margin: auto" v-if="list.length > 0">
<div
style="height: auto; width: 100%"
v-for="(item, index) in list"
:key="index"
@click="showDetail(item.id, item.orderStatus, item.orderPrice)"
>
<div style="width: 100%; height: 0.7rem"></div>
<div
style="
width: 100%;
height: auto;
background: #fff;
border-radius: 0.5rem;
"
>
<div style="width: 90%; height: 0.7rem"></div>
<div
style="
width: 90%;
height: 1.4rem;
align-items: center;
display: flex;
justify-content: space-between;
margin: auto;
"
>
<span
style="font-size: 0.9rem; font-weight: bold; font-family: '黑体'"
>先锋食堂<i
class="el-icon-arrow-right"
style="font-size: 0.7rem"
></i
></span>
<span
style="font-size: 0.7rem; color: orange"
v-if="item.orderStatus == '正常'"
>订单进行中
<span v-if="item.orderType=='应急' && item.orderStatus == '正常'" style="color: orange;font-size: 0.7rem;">(应急)</span>
<!-- <van-tag plain type="warning">应急</van-tag> -->
</span
>
<span
style="font-size: 0.7rem; color: #7f7f7f"
v-if="item.orderStatus == '撤销'"
>订单关闭</span
>
<span
style="font-size: 0.7rem; color: green"
v-if="item.orderStatus == '消费'"
>订单完成</span
>
</div>
<div
style="
width: 90%;
height: 4rem;
align-items: center;
display: flex;
justify-content: space-between;
margin: auto;
"
>
<div style="width: 4rem; height: 4rem">
<img
src="http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/750/h/750"
style="width: 100%; height: 100%; border-radius: 0.5rem"
/>
</div>
<div
style="width: calc(100% - 4rem); height: 4rem; margin-left: 1rem"
>
<!-- <div style="width: 100%; height: 10%"></div> -->
<div
style="
width: 100%;
height: 33.3%;
color: #656565;
display: flex;
align-items: center;
font-size: 0.8rem;
"
>
下单时间：{{ item.createdTime }}
</div>
<div
style="
width: 100%;
height: 33.3%;
color: #656565;
display: flex;
align-items: center;
font-size: 0.8rem;
"
>
餐别：{{ item.cb }}
</div>
<div
style="
width: 100%;
height: 33.3%;
color: #656565;
display: flex;
align-items: center;
font-size: 0.8rem;
"
>
总价：￥{{ item.orderPrice }}
</div>
<!-- <div style="width: 100%; height: 10%"></div> -->
</div>
</div>
<div style="width: 100%; height: 0.8rem"></div>
<div style="width: 90%; height: 1.6rem; display: flex; margin: auto">
<div
style="
width: 20%;
height: 100%;
display: flex;
align-items: center;
color: #656565;
font-size: 0.8rem;
"
>
更多
</div>
<div
style="
width: 80%;
height: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
"
>
<div
style="
width: 30%;
height: 100%;
border: 1px solid #d8d8d8;
display: flex;
justify-content: center;
align-items: center;
font-size: 0.8rem;
color: #656565;
border-radius: 0.8rem;
"
@click.stop="eva"
v-if="item.orderStatus == '消费'"
>
评价
</div>
<div
style="
width: 30%;
height: 100%;
border: 1px solid #f3bda4;
display: flex;
justify-content: center;
align-items: center;
font-size: 0.8rem;
color: #e96d35;
border-radius: 0.8rem;
margin-left: 0.7rem;
"
v-if="item.orderStatus == '正常'"
@click.stop="cancelOrder(item.id)"
>
取消订单
</div>
</div>
</div>
<div style="width: 90%; height: 0.7rem"></div>
</div>
</div>
</div>
<div style="height: 8rem; width: 90%; margin: auto" v-else>
<van-empty description="无订单" />
</div>
<div style="width: 90%; height: 1rem"></div>
<van-datetime-picker
v-model="currentDate"
style="position: absolute; bottom: 0; width: 100%"
v-if="dateShow"
type="date"
title="选择年月日"
:min-date="minDate"
:max-date="maxDate"
@confirm="confirm"
@cancel="cancel"
/>
</div>
</template>
<script>
import axios from "axios";
import { Dialog } from "vant";
import $ from '../../../static/js/jquery-3.3.1.min.js';
import {format} from '../../utils/date.js';
export default {
data() {
return {
active: 0,
tabList: ["全部", "待消费", "订餐关闭", "订餐完成"],
list: [],
datalength:0,
total:0,
url: "",
scrollFun:null,
dateShow: false,
minDate: new Date(2020, 0, 1),
maxDate: new Date(2050, 10, 1),
currentDate: new Date(),
personid:'',
page: {
pageIndex: 1,
pageSize: 10,
orderstatus: "",
date:'',
},
};
},
activated() {
if(localStorage.getItem("dc_personid")){
let person = JSON.parse(localStorage.getItem("dc_personid"));
this.personid = person.id;
this.url = this.$store.state.url;
this.getData();
var start = 1;//当前页
var length = 10;//每页条数
let that = this;
this.scrollFun = function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()) {
start += 1;
console.log(start)
length = start * 10;
that.page.pageSize = length;
if (that.datalength != that.total) {
that.getData();
} else {
that.$toast("已经到底了");
}
}
}
$(window).on("scroll", this.scrollFun);
} else{
this.$toast.fail("暂无人员信息");
}
},
destroyed() {
},
beforeRouteLeave(to, from, next) {
$(window).off("scroll", this.scrollFun);
next();
},
created() {},
mounted() {},
methods: {
changeDate() {
this.dateShow = true;
},
confirm(val) {
this.dateShow = false;
this.page.date = format(val);
this.getData();
},
cancel() {
this.dateShow = false;
},
evaluate() { this.$toast("功能维护中");},
showDetail(orderId, orderStatus, orderPrice) {
this.$router.push(
"/orderDetail?orderId=" +
orderId +
"&orderStatus=" +
orderStatus +
"&orderPrice=" +
orderPrice
);
},
getData() {
axios
.get(this.url + "/canteen/orders/" + this.personid, { params: this.page })
.then((res) => {
let data = res.data;
if (data.succeeded) {
this.list = data.data.items;
this.datalength = data.data.items.length;
this.total = data.data.totalCount;
} else {
this.$toast.fail(data.errors);
}
});
},
cancelOrder(id) {
Dialog.confirm({
title: "撤销订单",
message: "确定撤销该笔订单吗？(撤销订单后需重新订单)",
})
.then(() => {
axios.delete(this.url + "/canteen/order/" + id, {}).then((res) => {
let data = res.data;
console.log(data);
if (data.succeeded) {
this.$toast.success("撤销成功");
this.getData();
} else {
this.$toast.fail(data.errors);
}
});
})
.catch(() => {
// on cancel
});
},
back() {
this.$router.push("/goods");
},
changeTabs(val) {
console.log(val);
switch (val) {
case 0:
this.page.orderstatus = "";
this.getData();
break;
case 1:
this.page.orderstatus = "1";
this.getData();
break;
case 2:
this.page.orderstatus = "2";
this.getData();
break;
case 3:
this.page.orderstatus = "3";
this.getData();
break;
}
},
},
};
</script>
<style lang="stylus" scoped></style>

57
src/components/ordered/ordered.vue Normal file
View File

@ -0,0 +1,57 @@
<template lang="html">
<div style="padding: 10px">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span style="font-size: 0.7rem;">已订餐详情</span>
</div>
<div>
<van-card
num="1"
price="2.00"
desc="描述这碗粥"
title="皮蛋瘦肉粥"
thumb="http://fuss10.elemecdn.com/c/cd/c12745ed8a5171e13b427dbc39401jpeg.jpeg?imageView2/1/w/750/h/750"
v-for="a in 8"
>
<template #tags>
<van-tag plain type="danger">热</van-tag>
<van-tag plain type="success">素</van-tag>
</template>
<template #footer>
<van-button plain type="warning" size="small">评价</van-button>
</template>
</van-card>
</div>
</el-card>
<div style="width: 100%;height:3rem;"></div>
<div style="width: 100%;height:2.5rem;display: flex;align-items: center;justify-content: center;position: fixed;bottom: 1rem;">
<div style="width: 90%;height: 2.5rem;margin: auto;background-color: #333333;border-radius:1.25rem;display: flex;">
<div style="width:50%;height:100%;margin-left: 15px;color: #fff;display: flex;align-items: center;font-size: 0.7rem;">合计 ￥<span style="font-size: 1.1rem;">35</span></div>
<div style="width:50%;height:100%;display: flex;justify-content: end;">
<!-- <div style="width: 50%;height:100%;background-color: yellow;color: #000;display: flex;align-items: center;justify-content: center;font-size: 0.7rem;">取消订单</div> -->
<div style="width: 50%;height:100%;;background-color: #f9e55e;color: #000;border-radius: 0 1.25rem 1.25rem 0;display: flex;align-items: center;justify-content: center;font-size: 0.7rem;" @click="cancel">取消订单</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
mounted() {},
methods: {
cancel(){
this.$router.push('/goods');
},
},
};
</script>
<style lang="stylus" scoped></style>

111
src/components/searchView/searchView.vue Normal file
View File

@ -0,0 +1,111 @@
<template>
<div style="width: 100%;height: auto;display: flex;flex-wrap: wrap;align-items: flex-end;">
<div v-for="(item,index) in list" :key="index" :style="index>2? index%3==0?'width: 25%;margin-top:10px':'width: 25%;margin-left: 15px;margin-top:10px':index==0?'width: 25%;':'width: 25%;margin-left: 15px;'">
<el-input
:placeholder="item.placeholder"
v-model="object[item.prop]"
v-if="item.type=='input'"
></el-input>
<el-select
v-model="object[item.prop]"
:placeholder="item.placeholder"
style="width: 100%;"
filterable
@change="changePay"
v-if="item.type=='select'"
>
<el-option v-for="(a,i) in item.options" :key="i" :label="a.name" :value="a.value"> </el-option>
</el-select>
<el-select
v-model="object[item.prop]"
:placeholder="item.placeholder"
multiple
style="width: 100%;"
v-if="item.type=='multiple_select'"
>
<el-option v-for="(a,i) in item.options" :key="i" :label="a.name" :value="a.value"> </el-option>
</el-select>
<el-select
v-model="object[item.prop]"
:placeholder="item.placeholder"
style="width: 100%;"
filterable
@change="change"
v-if="item.type=='appoint_select'"
>
<el-option v-for="(a,i) in item.options" :key="i" :label="a.name" :value="a.value"> </el-option>
</el-select>
<el-date-picker
v-model="object[item.prop]"
:type="item.dateType"
style="width: 100%;"
value-format="yyyy-MM-dd"
placeholder="选择日期"
v-if="item.type=='date_select'"
:picker-options="pickerOptions">
</el-date-picker>
<br v-if="index%3==0">
</div>
<el-button type="primary" @click="search" :style="'margin-left: 15px;height: 40px;background:'+color"
>查询</el-button
>
</div>
</template>
<script>
export default {
name: "searchBar",
props: ['list','handleSearch','appoint_change'],
data() {
return {
object:{},
color:'#1372bb',
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now();
},
shortcuts: [{
text: '今天',
onClick(picker) {
picker.$emit('pick', new Date());
}
}, {
text: '昨天',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24);
picker.$emit('pick', date);
}
}, {
text: '一周前',
onClick(picker) {
const date = new Date();
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', date);
}
}]
},
};
},
computed: {},
mounted() {
if (localStorage.getItem("theme")) {
this.color = localStorage.getItem("theme");
}
},
methods: {
changePay(val){
this.$forceUpdate();
},
search(){
this.handleSearch(this.object);
},
change(val){
this.appoint_change(val)
},
}
};
</script>
<style scoped></style>

75
src/components/shopCart/shopCart.vue
View File

@ -15,10 +15,10 @@
￥{{totalPrice}}
</div>
<div class="desc">
另需要配送费￥{{deliveryPrice}}元
<!-- 另需要配送费￥{{deliveryPrice}}元 -->
</div>
</div>
<div class="content-right" :class="{'enough':totalPrice>=minPrice}">
<div class="content-right" :class="{'enough':totalPrice>=minPrice}" @click="onSubmit">
{{payDesc}}
</div>
</div>
@ -40,7 +40,7 @@
<div class="list-content" ref="foodlist">
<ul>
<li class="food" v-for="food in selectFoods">
<span class="name">{{food.name}}</span>
<span class="name">{{food.dishesName}}</span>
<div class="price">
<span>￥{{food.price * food.count}}</span>
</div>
@ -63,6 +63,7 @@
import cartcontrol from 'components/cartcontrol/cartcontrol'
import backdrop from 'components/backdrop/backdrop'
import BScroll from 'better-scroll'
import axios from "axios";
export default {
props: {
@ -74,6 +75,14 @@ export default {
type: Number,
default: 0
},
menuId: {
type: Number,
default: 0
},
type: {
type: String,
default: ''
},
minPrice: {
type: Number,
default: 0
@ -130,17 +139,61 @@ export default {
return false
},
payDesc() {
let diff = this.minPrice - this.totalPrice
if (!this.totalPrice) {
return `￥${this.totalPrice}起送`
} else if (diff > 0) {
return `还差￥${diff}元`
} else {
return '去结算'
}
// let diff = this.minPrice - this.totalPrice
// if (!this.totalPrice) {
// return `￥${this.totalPrice}起送`
// } else if (diff > 0) {
// return `还差￥${diff}元`
// } else {
// return '去结算'
// }
return '提交订单'
}
},
methods: {
onSubmit(){
console.log(this.type)
if(this.selectFoods==0){
this.$toast.fail("请选择菜品");
return;
}
let id = '';
if(localStorage.getItem("dc_personid")){
let person = JSON.parse(localStorage.getItem("dc_personid"));
id = person.id;
} else{
this.$toast.fail("暂无人员信息");
return
}
let obj = {};
obj.personId = id;
obj.menuId = this.menuId;
if(this.type){
obj.orderType = 2;
} else{
obj.orderType = 1;
}
obj.canteenOrderDetailAddDtos = [];
let allPrice = 0;
this.selectFoods.forEach(e => {
obj.canteenOrderDetailAddDtos.push({dishesId:e.dishesId,num:e.count,price:e.price});
allPrice += e.price;
});
obj.orderPrice = allPrice;
let url = this.$store.state.url;
axios.post(url+'/canteen/order',obj).then((res) => {
let data = res.data;
if(data.succeeded){
this.$router.push('/success');
} else{
this.$toast.fail(data.errors);
}
console.log(res.data)
});
// this.$router.push('/success');
},
drop(el) {
for (let i = 0, l = this.balls.length; i < l; i++) {
let ball = this.balls[i]

69
src/components/subMenu/subMenu.vue Normal file
View File

@ -0,0 +1,69 @@
<template>
<div class="subMenu">
<div v-for="item in menu">
<!-- 具有子菜单 -->
<el-submenu index="1"
v-if="item.children&&item.children.length>0">
<template slot="title">
<i :class="item.meta.icon"
style="color:#b3e0dc;margin-right:10px;font-size:20px"></i>
<span slot="title">{{item.meta.title}}</span>
</template>
<el-menu-item-group>
<sub-menu :sideMenu="item.children"
:parentPath="'/'+item.path"></sub-menu>
<sub-menu :sideMenu="item.children"
:parentPath="'/'+item.path"></sub-menu>
</el-menu-item-group>
</el-submenu>
<!-- 常规菜单 -->
<el-menu-item v-else
:index="item.path"
@click="jumpRoute(item.path,item.meta.title)">
<i :class="item.meta.icon"
style="margin-right:10px;font-size:20px;color:#b3e0dc;"></i>
<span slot="title">{{item.meta.title}}</span>
</el-menu-item>
</div>
</div>
</template>
<script>
export default {
name: 'sub-menu', // 给组件取名字之后 可以递归
props: {
parentPath: {
type: String,
default: ""
},
backPath: {
type: Function,
default: ""
},
sideMenu: {
type: Array,
default: () => [] // 定义默认数据
}
},
data() {
return {
menu:this.sideMenu,
isCollapse: false,
}
},
methods: {
jumpRoute(name,title) {
this.$router.push(name)
this.backPath(name,title);
}
},
mounted() {
// this.menu = this.sideMenu.filter(e=>e.path!='/')
}
}
</script>
<style>
i.iconfont {
color: #b3e0dc;
}
</style>

35
src/components/success/success.vue Normal file
View File

@ -0,0 +1,35 @@
<template lang="html">
<div style="padding: 10px">
<div style="width: 100%;height: 100vh;display: flex;align-items: center;justify-content: center;">
<el-result icon="success" title="注册成功" subTitle="3秒后跳转...">
<template slot="extra">
<!-- <el-button type="warning" size="medium" @click="goOrder">查看订单</el-button> -->
</template>
</el-result>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
created() {
// let that = this; setTimeout(function(){ that.$router.push('/orderList');},3000)
},
mounted() { },
methods: {
goOrder(){
this.$router.push('/orderList');
},
},
};
</script>
<style lang="stylus" scoped></style>

140
src/components/tableView/tableView.vue Normal file
View File

@ -0,0 +1,140 @@
<template lang="html">
<div>
<div :style="width?'height: auto; width: '+width+'; margin: auto':'height: auto; width: 96%; margin: auto'">
<el-table
:data="list"
stripe
:header-cell-style="getRowClass"
style="width: 100%"
>
<el-table-column
:prop="item.prop"
align="center"
:label="item.label"
:width="item.width"
v-for="(item, index) in propList"
:key="index"
>
<template slot-scope="scope" >
<span v-if="slots.indexOf(item.prop)==-1">{{scope.row[item.prop]}}</span>
<div v-else>
<slot :name="item.prop + '_slot'" :data='scope.row'></slot>
</div>
</template>
</el-table-column>
<el-table-column align="center" label="操作" :width="buttonLength*100" v-if="buttonLength">
<template slot-scope="scope">
<slot name="tableButton" :data='scope.row'></slot>
</template>
</el-table-column>
</el-table>
<div style="width: 100%; height: 20px"></div>
<el-pagination
v-if="isPage"
background
layout="total, sizes, prev, pager, next, jumper"
@current-change="changePage"
@size-change="changeSize"
:page-sizes="[5,10, 20, 30, 40, 50]"
:page-size="1"
:total="total"
>
</el-pagination>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
list: [],
total: 0,
order:{},
};
},
props: ["url", "page", "propList","isPage","buttonLength","slots","datalist",'width'],
components: {},
activated() {},
created() {},
mounted() {
console.log(this.datalist)
if (this.url || this.datalist) {
this.getInit();
}
},
methods: {
changeSize(size) {
this.page.pageRows = size;
this.getInit();
},
changePage(page) {
this.page.pageIndex = page;
this.getInit();
},
getInit() {
console.log(this.datalist)
if(this.datalist){
this.list = this.datalist;
} else{
axios
.get(this.url, { params: this.page })
.then((res) => {
let result = res.data;
if (result.succeeded) {
if(this.url.endsWith('/order-total')){
this.list = result.data.canteenMenuDetailDtos;
this.order.orderCancelCount = result.data.orderCancelCount;
this.order.orderCount = result.data.orderCount;
this.order.orderMoney = result.data.orderMoney;
} else{
this.list = result.data;
}
if(this.url.endsWith('/dishes')){
this.list.forEach(e => {
e.num = 1;
e.window= "窗口A";
});
}
if(this.isPage){
this.total = parseInt(result.total) ;
}
} else {
this.$message.error(result.errors);
}
})
.catch((error) => {});
}
},
getRowClass({ row, column, rowIndex, columnIndex }) {
if (rowIndex == 0) {
return "background:#fafafa ";
}
},
},
};
</script>
<style>
.van-dropdown-menu__bar {
box-shadow: unset !important;
height: 30px !important;
}
.van-dropdown-menu__title {
font-size: 13px !important;
}
html {
font-size: 0.8rem;
}
</style>

55
src/components/vant2DatetimePicker/vant2DatetimePicker.vue Normal file
View File

@ -0,0 +1,55 @@
<template lang="html">
<div>
<van-datetime-picker
v-if="show"
style="position: fixed; bottom: 0; width: 100%"
v-model="currentDate"
type="datetime"
:title="selectJson.title"
:min-date="minDate"
:max-date="maxDate"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</template>
<script>
import axios from "axios";
import {formatDateTime} from '../../utils/date.js';
export default {
data() {
return {
show:false,
currentDate:new Date(),
minDate: new Date(2020, 0, 1),
maxDate: new Date(2025, 10, 1),
};
},
props:['selectJson','confirm'],
activated() {
},
mounted() {},
methods: {
onConfirm(val){
console.log(this.selectJson)
this.show = false;
this.confirm(formatDateTime(val),this.selectJson.prop);
},
onCancel(){
this.show = false;
},
onShow(){
this.show = true;
},
},
};
</script>
<style scoped>
</style>

50
src/components/vant2Select/vant2Select.vue Normal file
View File

@ -0,0 +1,50 @@
<template lang="html">
<div>
<van-picker
:title="selectJson.title"
show-toolbar
v-if="show"
style="position: fixed; bottom: 0; width: 100%"
:columns="selectJson.columns"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
show:false
};
},
props:['selectJson','confirm'],
activated() {
},
mounted() {
},
methods: {
onConfirm(val){
this.show = false;
this.confirm(val,this.selectJson.prop);
},
onCancel(){
this.show = false;
},
onShow(){
this.show = true;
},
},
};
</script>
<style scoped>
</style>

84
src/main.js
View File

@ -1,53 +1,65 @@
import Vue from 'vue'
import App from './App'
import VueRouter from 'vue-router'
import goods from 'components/goods/goods'
import ratings from 'components/ratings/ratings'
import seller from 'components/seller/seller'
import vueTap from 'v-tap'
import fastclick from 'fastclick'
import Vuex from 'vuex'
import Vue from "vue";
import App from "./App";
import VueRouter from "vue-router";
import ElementUI from 'element-ui';
import router from './router'
import ChartBlock from '../src/components/echartsBlock/echartsBlock.vue'
Vue.use(vueTap)
Vue.use(VueRouter)
Vue.use(Vuex)
import tableFlexWidth from './utils/tableFlexWidth'
import vueTap from "v-tap";
import fastclick from "fastclick";
import Vuex from "vuex";
import { NavBar,DatetimePicker, Button, Form, Field, Picker, Toast,Card,Tag,Tab, Tabs,Icon,Empty,Dialog,Step, NoticeBar,Steps,Popup,Uploader,RadioGroup, Radio,Checkbox, CheckboxGroup ,CountDown,Cell, CellGroup,SwipeCell} from "vant";
import "vant/lib/index.css";
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ChartBlock)
Vue.use(vueTap);
Vue.use(VueRouter);
Vue.use(Vuex);
Vue.use(ElementUI);
Vue.use(tableFlexWidth);
Vue.use(SwipeCell).use(DatetimePicker).use(NavBar).use(CountDown).use(Cell).use(CellGroup).use(Checkbox).use(CheckboxGroup).use(Button).use(Form).use(Field).use(Picker).use(Toast).use(Card).use(Tag).use(Tab).use(Tabs).use(Icon).use(Empty).use(Dialog).use(Step).use(Steps).use(Popup).use(Uploader).use(RadioGroup).use(Radio).use(NoticeBar);
const store = new Vuex.Store({
state: {
count: 0
count: 0,
url:'http://dazhao.site:8012/api',
go:'http://localhost:8080/#/',
canteen:{}
},
// 添加的商品元素
addCartEl: {},
mutations: {
increment(state) {
state.count++
}
}
})
const router = new VueRouter({
routes: [{
path: '/goods',
component: goods
}, {
path: '/ratings',
component: ratings
}, {
path: '/seller',
component: seller
}],
linkActiveClass: 'active'
})
state.count++;
},
updateCanteen(state,obj) {
state.canteen = obj;
},
},
});
router.beforeEach((to, from, next) => {
if (to.meta.title) {
document.title = to.meta.title
}
next()
})
new Vue({
router,
store,
template: '<App/>',
template: "<App/>",
components: {
App
App,
},
data: {
eventHub: new Vue()
}
}).$mount('#app')
eventHub: new Vue(),
},
}).$mount("#app");
router.push('goods')
// router.push("filter");

207
src/router/index.js Normal file
View File

@ -0,0 +1,207 @@
import Vue from "vue";
import VueRouter from "vue-router";
import confirmRes from "../views/visitor/confirmRes.vue";
import confirmCome from "../views/visitor/confirmCome.vue";
import applyfor from "../views/visitor/applyfor.vue";
import applySelf from "../views/visitor/applySelf.vue";
import applylog from "../views/visitor/applylog.vue";
import applyApprovalCar from "../views/visitor/applyApprovalCar.vue";
import applyCar from "../views/visitor/applyCar.vue";
import applyAddCar from "../views/visitor/applyAddCar.vue";
import applyFamily from "../views/visitor/applyFamily.vue";
import applyAddFamily from "../views/visitor/applyAddFamily.vue";
import applyQrcode from "../views/visitor/applyQrcode.vue";
import applyforQrcode from "../views/visitor/applyforQrcode.vue";
import person from "../views/visitor/person.vue";
import login from "../views/visitor/login.vue";
import bind from "../views/visitor/bind.vue";
import invite from "../views/visitor/invite.vue";
import qrcode from "../views/visitor/qrcode.vue";
import success from "../views/visitor/success.vue";
import personList from "../views/repulsebay/question/personList.vue";
import question from "../views/repulsebay/question/question.vue";
import questionList from "../views/repulsebay/question/questionList.vue";
import renovationList from "../views/repulsebay/question/renovationList.vue";
import design from "../views/repulsebay/question/design.vue";
import personalCenter from "../views/repulsebay/question/personalCenter.vue";
import community from "../views/repulsebay/question/community.vue";
import questionStatistics from "../views/repulsebay/question/questionStatistics.vue";
import questionSuccess from "../views/repulsebay/question/questionSuccess.vue";
import prompt from "../views/jifeng/prompt.vue";
import index from "../views/index.vue";
Vue.use(VueRouter);
const routes = [
{
path: "/index",
component: index,
meta: { hideHeader: true, title: "" },
children: [
{
path: "/personList",
component: personList,
meta: {
hideHeader: true,
title: "人员管理",
web: true,
icon: "el-icon-s-custom",
},
},
{
path: "/questionList",
component: questionList,
meta: {
hideHeader: true,
title: "问卷管理",
web: true,
icon: "el-icon-tickets",
},
},
{
path: "/renovationList",
component: renovationList,
meta: {
hideHeader: true,
title: "装修管理",
web: true,
icon: "el-icon-smoking",
},
},
{
path: "/design",
component: design,
meta: { hideHeader: true, title: "问卷设计", icon: "el-icon-phone" },
},
],
},
{
path: "/applyApprovalCar",
component: applyApprovalCar,
meta: { hideHeader: true, title: "" },
},
{
path: "/applyAddFamily",
component: applyAddFamily,
meta: { hideHeader: true, title: "" },
},
{
path: "/applyFamily",
component: applyFamily,
meta: { hideHeader: true, title: "" },
},
{
path: "/applyAddCar",
component: applyAddCar,
meta: { hideHeader: true, title: "" },
},
{
path: "/applyCar",
component: applyCar,
meta: { hideHeader: true, title: "" },
},
{
path: "/applylog",
component: applylog,
meta: { hideHeader: true, title: "" },
},
{
path: "/applyforQrcode",
component: applyforQrcode,
meta: { hideHeader: true, title: "访客申请码" },
},
{
path: "/applyQrcode",
component: applyQrcode,
meta: { hideHeader: true, title: "访客邀请码" },
},
{
path: "/prompt",
component: prompt,
meta: { hideHeader: true, title: "" },
},
{
path: "/questionSuccess",
component: questionSuccess,
meta: { hideHeader: true, title: "问卷调查" },
},
{
path: "/questionStatistics",
component: questionStatistics,
meta: { hideHeader: true, title: "问卷统计" },
},
{
path: "/community",
component: community,
meta: { hideHeader: true, title: "社区风采" },
},
{
path: "/personalCenter",
component: personalCenter,
meta: { hideHeader: true, title: "个人中心" },
},
{
path: "/question",
component: question,
meta: { hideHeader: true, title: "问卷调查" },
},
{
path: "/invite",
component: invite,
meta: { hideHeader: true, title: "访客系统" },
},
{
path: "/bind",
component: bind,
meta: { hideHeader: true, title: "注册中心" },
},
{
path: "/confirmRes",
component: confirmRes,
meta: { hideHeader: true, title: "访客审批" },
},
{
path: "/confirmCome",
component: confirmCome,
meta: { hideHeader: true, title: "访客系统" },
},
{
path: "/applyfor",
component: applyfor,
meta: { hideHeader: true, title: "访客自助申请" },
},
{
path: "/applySelf",
component: applySelf,
meta: { hideHeader: true, title: "自助申请" },
},
{
path: "/success",
component: success,
meta: { hideHeader: true, title: "访客系统" },
},
{
path: "/login",
component: login,
meta: { hideHeader: true, title: "登录", },
},
{
path: "/person",
component: person,
meta: { hideHeader: true, title: "" },
},
{
path: "/qrcode",
component: qrcode,
meta: { hideHeader: true, title: "" },
},
];
const router = new VueRouter({
routes,
});
export default router;

14
src/utils/dataUtils.js Normal file
View File

@ -0,0 +1,14 @@
/**
* 时间格式转化为日期字符串
**/
function decryptJWT(token) {
token = token.replace(/_/g, "/").replace(/-/g, "+");
var json = decodeURIComponent(escape(window.atob(token.split(".")[1])));
return json;
}
export {
decryptJWT
}

27
src/utils/date.js Normal file
View File

@ -0,0 +1,27 @@
/**
* 时间格式转化为日期字符串
**/
function format(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
m = m < 10 ? "0" + m : m;
var d = date.getDate();
d = d < 10 ? "0" + d : d;
return y + "-" + m + "-" + d;
};
function formatDateTime(date) {
var y = date.getFullYear();
var m = date.getMonth() + 1;
m = m < 10 ? "0" + m : m;
var d = date.getDate();
d = d < 10 ? "0" + d : d;
var h = date.getHours();
h=h < 10 ? ('0' + h) : h;
var minute = date.getMinutes();
minute = minute < 10 ? ('0' + minute) : minute;
return y + "-" + m + "-" + d +' '+h+':'+minute;
};
export {
format,formatDateTime
}

47
src/utils/tableFlexWidth.js Normal file
View File

@ -0,0 +1,47 @@
/**
* 全局el-table内容自适应方法 flexWidth
* @param prop 每列的prop 可传''
* @param tableData 表格数据
* @param title 标题长内容短的，传标题 可不传
* @param num 列中有标签等加的富余量
* @returns 列的宽度
* 注：prop,title有一个必传
*/
exports.install = function(Vue, options) {
Vue.prototype.flexWidth = function(prop, tableData, title, num = 0) {
if (tableData.length === 0) { //表格没数据不做处理
return;
}
let flexWidth = 0; //初始化表格列宽
let columnContent = ''; //占位最宽的内容
let canvas = document.createElement("canvas");
let context = canvas.getContext("2d");
context.font = "14px Microsoft YaHei";
if ((prop === '') && title) { //标题长内容少的，取标题的值,
columnContent = title
} else { // 获取该列中占位最宽的内容
let index = 0;
for (let i = 0; i < tableData.length; i++) {
const now_temp = tableData[i][prop] + '';
const max_temp = tableData[index][prop] + '';
const now_temp_w = context.measureText(now_temp).width
const max_temp_w = context.measureText(max_temp).width
if (now_temp_w > max_temp_w) {
index = i;
}
}
columnContent = tableData[index][prop]
//比较占位最宽的值跟标题、标题为空的留出四个位置
const column_w = context.measureText(columnContent).width
const title_w = context.measureText(title).width
if (column_w < title_w) {
columnContent = title || '留四个字'
}
}
// 计算最宽内容的列宽
let width = context.measureText(columnContent);
flexWidth = width.width + 40 + num
return flexWidth + 'px';
}
}

468
src/views/index.vue Normal file
View File

@ -0,0 +1,468 @@
<template>
<div class="home">
<el-container>
<!-- 侧边菜单栏 -->
<el-aside width="250px" :style="'background:' + color">
<h1 class="logo" style="display: flex;justify-content: center;align-items: center;">
<img src="../../static/img/e75ce57e12699e6f5c216c6249447fa.png" style="width: 70%;height:100%;" alt="">
</h1>
<el-menu
:default-active="$route.path"
class="el-menu-vertical-demo"
:background-color="color"
text-color="#b3e0dc"
ref="sideMenu"
active-text-color="#fff"
:collapse="isCollapse"
>
<subMenu :sideMenu="sideMenu" :backPath="backPath"></subMenu>
</el-menu>
</el-aside>
<el-container>
<!-- 顶栏布局 -->
<el-header :style="'background:' + color">
<div
style="
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
"
>
<div class="shouqi grid-content">
<i
:class="[
'iconfont',
isCollapse ? 'icon-zhankai' : 'icon-shouqi',
]"
@click="isCollapse = !isCollapse"
></i>
</div>
<div class="grid-content" style="font-weight: 100"></div>
<div class="grid-content" style="display: flex">
<!-- <el-avatar shape="circle"
:size="35"
fit="fill"
:src="userInfo.headimgurl"></el-avatar> -->
<span>欢迎您:</span>
<el-dropdown @command="handleCommand">
<span class="el-dropdown-link nickname">
{{
companyId
}}<i class="el-icon-arrow-down el-icon--right"></i>
</span>
<!-- <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="修改密码">修改密码</el-dropdown-item>
</el-dropdown-menu> -->
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="更换主题"
>更换主题</el-dropdown-item
>
</el-dropdown-menu>
</el-dropdown>
<span class="nickname"
>{{
user.Role
}}</span>
<span class="quit" @click="quit">退出</span>
</div>
</div>
</el-header>
<!-- main内容布局 -->
<el-main>
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/allCompanyCardList' }">首页</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: path }">{{pathTitle}}</el-breadcrumb-item>
</el-breadcrumb>
<router-view></router-view>
</el-main>
<el-footer
style="
height: 30px;
display: flex;
align-items: center;
justify-content: flex-end;
"
>
<template slot="default" slot-scope="{ isMobile }">
<div style="display: flex; justify-content: space-between">
<div
style="
display: flex;
flex-direction: column;
align-items: flex-end;
font-size: 12px;
color: #cccccc;
font-family: '黑体';
width: 100%;
height: 100%;
justify-content: center;
"
>
<span
>copyright@宁波大招科技有限公司 0574-23668886 23668889</span
>
</div>
</div>
</template>
</el-footer>
</el-container>
</el-container>
<el-dialog
title="修改密码"
:visible.sync="dialogVisible"
width="30%"
:center="true"
>
<el-form
label-position="center"
label-width="80px"
:model="form"
:rules="rules"
ref="ruleForm"
style="width: 80%; margin: auto"
>
<el-form-item label="原密码" prop="oldpassword">
<el-input
placeholder="请输入原密码"
auto-complete="off"
type="password"
v-model="form.oldpassword"
></el-input>
</el-form-item>
<el-form-item label="新密码" prop="newpassword">
<el-input
placeholder="请输入新密码"
auto-complete="off"
type="password"
v-model="form.newpassword"
></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="onSubmit">确 定</el-button>
</span>
</el-dialog>
<el-drawer
:wrapperClosable="false"
title="配色方案"
:visible.sync="drawer"
direction="rtl"
size="27%"
>
<div
style="
width: 80%;
height: auto;
margin: auto;
display: flex;
flex-wrap: wrap;
"
>
<div
class="theme"
style="background-color: #ffb800"
@click="theme_change('#ffb800')"
></div>
<div
class="theme"
style="background-color: #1372bb"
@click="theme_change('#1372bb')"
></div>
<div
class="theme"
style="background-color: #009688"
@click="theme_change('#009688')"
></div>
<div
class="theme"
style="background-color: #67c23a"
@click="theme_change('#67c23a')"
></div>
<div
class="theme"
style="background-color: #e6a23c"
@click="theme_change('#e6a23c')"
></div>
<div
class="theme"
style="background-color: #909399"
@click="theme_change('#909399')"
></div>
</div>
</el-drawer>
</div>
</template>
<script>
import subMenu from "../components/subMenu/subMenu.vue";
import VueRouter from "vue-router";
import { decryptJWT } from "../utils/dataUtils.js";
export default {
data() {
return {
path:"",
pathTitle:"",
sideMenu: [],
rules: {
oldpassword: [
{ required: true, message: "请输入密码", trigger: "blur" },
],
newpassword: [
{ required: true, message: "请输入密码", trigger: "blur" },
],
},
companyId:"",
color: "#1372bb",
// 控制menu是否收起
isCollapse: false,
drawer: false,
user: {},
dialogVisible: false,
url:"",
form: {
oldpassword: "",
newpassword: "",
id: "",
},
};
},
computed: {},
created() {
let route = this.$router.options.routes[0].children.filter((e) => e.meta.web);
this.url = this.$store.state.url;
this.sideMenu = route;
if(localStorage.getItem("wf_token")){
this.user = JSON.parse(decryptJWT(localStorage.getItem("wf_token")));
}
if (localStorage.getItem("theme")) {
this.color = localStorage.getItem("theme");
}
},
mounted() {
},
methods: {
backPath(path,title){
console.log(path,title)
this.path = path;this.pathTitle = title
},
theme_change(color) {
this.color = color;
localStorage.removeItem("theme");
localStorage.setItem("theme", color);
// 刷新页面
window.location.reload();
},
handleCommand(command) {
if (command == "修改密码") {
this.update_password();
}
if (command == "更换主题") {
this.drawer = true;
}
},
onSubmit() {
this.$refs["ruleForm"].validate((valid) => {
if (valid) {
this.form.id = this.user.UserId;
changePassword(this.form).then((res) => {
let result = res.data;
if (result.succeeded) {
this.drawer = false;
this.$message.success("修改成功,请重新登录...");
this.quit();
} else {
this.$message.error(result.errors);
}
});
}
});
},
update_password() {
this.dialogVisible = true;
this.form = {
oldpassword: "",
newpassword: "",
id: "",
};
},
goOn(url) {
this.$router.push("/" + url);
},
quit() {
// 情况localstorage中的token
localStorage.clear();
// 跳转到登入页
this.$router.push("/login");
// 刷新页面
window.location.reload();
},
},
mounted() {},
components: {
subMenu,
},
};
</script>
<style>
.el-menu-item {
font-family: "黑体";
}
/* .el-menu-item.is-active{
background-color: rgb(15,91,150) !important;
} */
</style>
<style scoped>
.el-aside{
min-height: 100vh;
height: auto;
}
.company-info-left,
.company-info-right {
display: flex;
flex-direction: column;
align-items: center;
font-size: 12px;
color: #cccccc;
font-family: "黑体";
}
.company-name {
font-size: 14px;
font-weight: bold;
margin-bottom: 5px;
font-family: "黑体";
margin-top: 7px;
}
.company-contact-info {
display: flex;
flex-direction: column;
font-family: "黑体";
}
.company-contact-info div {
font-family: "黑体";
}
.el-icon-message,
.el-icon-phone {
margin-right: 5px;
}
.theme {
width: 100px;
height: 80px;
margin-left: 30px;
margin-top: 20px;
}
.count_div {
cursor: pointer;
width: 31%;
height: 75px;
background-color: #f7f7f9;
border-radius: 10px;
display: flex;
justify-content: space-between;
}
.nickname {
margin-left: 10px;
color: #fff;
font-weight: 700;
font-size: 15px;
text-decoration: underline;
cursor: pointer;
}
/* 退出按钮 */
.quit {
color: red;
cursor: pointer;
margin-left: 10px;
font-size: 14px;
}
/* asside样式 */
.logo {
height: 60px;
/* background: linear-gradient(135deg, #4c67ff, #5635df); */
/* background-image: url("../../assets/imgs/sufu.png"); */
background-size: 30%;
background-repeat: no-repeat;
background-position: center;
}
/* header模块样式 */
.shouqi {
padding-left: 10px;
text-align: left;
}
.icon-shouqi,
.icon-zhankai {
font-size: 18px;
cursor: pointer;
color: #fff;
}
/* 修改avatar的样式 */
.el-avatar.el-avatar--shouqiuare,
.el-avatar.el-avatar--circle {
vertical-align: middle;
margin-right: 10px;
}
/* layout顶栏样式 */
.grid-content {
border-radius: 4px;
font-weight: bold;
font-family: "黑体";
font-size: 20px;
min-height: 60px;
}
.row-bg {
/* background-color: #41b883; */
}
/* container样式 */
.el-header {
background: linear-gradient(135deg, #4c67ff, #5635df);
-webkit-box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.29);
box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.29);
padding-left: 0;
background-color: #41b883;
color: #fff;
text-align: center;
line-height: 60px;
}
.el-aside {
background: linear-gradient(135deg, #5635df, #4c67ff);
}
.el-menu {
border-right: solid 1px #48a916 !important;
}
.el-main {
background-color: #fff;
color: #333;
-webkit-box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.29);
box-shadow: 0 2px 9px 0 rgba(0, 0, 0, 0.29);
text-align: center;
}
body > .el-container {
margin-bottom: 40px;
}
.el-container:nth-child(5) .el-aside,
.el-container:nth-child(6) .el-aside {
line-height: 260px;
}
.el-container:nth-child(7) .el-aside {
line-height: 320px;
}
.el-menu-vertical-demo:not(.el-menu--collapse) {
width: 250px;
min-height: 500px;
}
</style>

174
src/views/jifeng/prompt.vue Normal file
View File

@ -0,0 +1,174 @@
<template lang="html">
<div >
<div style="padding: 30px" v-if="!codeShow">
<div style="width: 100%; height: 2rem"></div>
<div
style="
width: 100%;
height: 3rem;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
font-family: '黑体';
"
>
访 客 人 员 须 知
</div>
<div
style="
width: 100%;
height: 3rem;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
font-family: '黑体';
"
>
Visitor Notice
</div>
<div style="width: 100%; height: 2rem"></div>
<div class="text">
<p>当 您 进 入 吉 风 工 厂 内,</p>
</div>
<div class="e_text">
<p>After youenter Jf factory,</p>
</div>
<div class="text">
<p>请 注 意 观 察 离 您 最 近 的 安 全 通 道。</p>
</div>
<div class="e_text">
<p>Please take notice the nearest ‘EXIT’ way.</p>
</div>
<div class="text">
<p>遇 紧 急 情 况 发 生 ( 听 到 警 报 声 )，保 持 冷 静,</p>
</div>
<div class="text">
<p>请 跟 随 我 方 工 作 人 员 迅 速 逃 离 现 场。</p>
</div>
<div class="e_text">
<p>Once the emergency happens, Keepcalm,</p>
</div>
<div class="e_text">
<p>
Please follow our coworker to leave the building when you hear alarm
bell.
</p>
</div>
<div class="text">
<p>进 入 生 产 车 间 请 佩 戴 劳 动 防 护 用 品。</p>
</div>
<div class="e_text">
<p>Please ware PPE once you enter workshop.</p>
</div>
<div class="text">
<p>会客结束，请将访客证归还至门卫。</p>
</div>
<div class="e_text">
<p>After visit, pls return the badge to Security room.</p>
</div>
<div style="width: 100%; height: 2rem"></div>
<div
style="
width: 100%;
height: 3rem;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
font-family: '黑体';
"
>
<el-button type="success" plain @click="confrim">我已阅读,获取访客码</el-button>
</div>
</div>
<div v-show="codeShow" style="height: 100vh;width:100%;background-color: #f7f8fa;">
<div style="height: 10rem;width: 80%;margin: auto;display: flex;align-items: center;justify-content: center;color: red;">
注：请妥善保管您的访客码，到门卫处出示该访客码
</div>
<div style="height: auto;width: 80%;display: flex;justify-content: center;margin: auto;">
<div style="width: 100%;height: 3rem;background-color: #fff;display: flex;">
<div style="width: 16.66%;height: 100%;border-right: 0.5px solid #f6f7f8;display: flex;justify-content: center;align-items: center;font-weight: bold;" v-for="(item,index) in codeList" :key="index">{{item}}</div>
</div>
<!-- <div id="qrCode" ref="qrCodeDiv"></div> -->
</div>
</div>
</div>
</template>
<script>
import QRCode from "qrcodejs2";
export default {
data() {
return {
code: "",
codeShow: false,
codeList:[],
};
},
created() {},
mounted() {
if (this.$route.query.code) {
this.code = this.$route.query.code
}
},
methods: {
confrim(){
if(this.code){
this.codeShow = true;
this.codeList = this.code.split('');
console.log(this.codeList)
// this.bindQRCode();
} else{
this.$toast.fail("无访客码信息");
}
},
bindQRCode: function () {
console.log(this.$refs.qrCodeDiv)
new QRCode(this.$refs.qrCodeDiv, {
text: this.code,
width: 200,
height: 200,
colorDark: "#333333", //二维码颜色
colorLight: "#ffffff", //二维码背景色
correctLevel: QRCode.CorrectLevel.L//容错率，L/M/H
})
}
},
};
</script>
<style scoped>
p {
text-align: center;
color: #474747;
}
.text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
.e_text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1.2rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
</style>

34
src/views/repulsebay/question/community.vue Normal file
View File

@ -0,0 +1,34 @@
<template lang="html">
<div style="background-color: #f2f2f2; min-height: 100vh">
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
url: "",
user: {},
};
},
activated() {
},
mounted() {this.getInit();},
methods: {
getInit() {
this.$toast.fail("维护中...");
},
},
};
</script>
<style scoped>
</style>

366
src/views/repulsebay/question/componet/renovationPersonList.vue Normal file
View File

@ -0,0 +1,366 @@
<template lang="html">
<div class="product" >
<div
style="
width: 100%;
height: auto;
margin: auto;
display: flex;
margin-top: 20px;
margin-bottom: 20px;
"
>
<div style="display: flex; width: 60%; flex-wrap: wrap">
</div>
<div style="flex: 1">
<el-button
style="float: right;"
type="primary"
icon="el-icon-plus"
@click="dialogFormVisible=true"
>添加成员</el-button
>
</div>
</div>
<!-- 表格 -->
<div class="stu-table">
<el-table
:data="list"
v-loading="loading"
stripe
:header-cell-style="getRowClass"
style="width: 100%"
>
<el-table-column prop="name" align="center" label="姓名" :min-width="flexWidth('name', list, '姓名')">
</el-table-column>
<el-table-column prop="sfzhm" align="center" label="身份证" :min-width="flexWidth('sfzhm', list, '身份证')">
</el-table-column>
<el-table-column prop="telphone" align="center" label="手机号" :min-width="flexWidth('telphone', list, '手机号')">
</el-table-column>
<el-table-column prop="carNo" align="center" label="车牌号" :min-width="flexWidth('carNo', list, '车牌号')">
</el-table-column>
<el-table-column prop="isFace" align="center" label="是否上传人脸" :min-width="flexWidth('isFace', list, '是否上传人脸')">
<template slot-scope="scope">
<el-tag type="success" v-if="scope.row.isFace">已上传</el-tag>
<el-tag type="info" v-if="!scope.row.isFace">未上传</el-tag>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="280" fixed="right" >
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
icon="el-icon-minus"
@click.native.stop="deleteZx(scope.row.id)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="添加成员" :visible.sync="dialogFormVisible" width="30%" :close-on-click-modal="false" :modal="false">
<el-form :model="form" :rules="rules" ref="ruleForm">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" placeholder="请输入名称" ></el-input>
</el-form-item>
<el-form-item label="身份证" prop="sfzhm">
<el-input type="number" v-model="form.sfzhm" placeholder="请输入名称" ></el-input>
</el-form-item>
<el-form-item label="手机号" prop="telphone">
<el-input type="number" v-model="form.telphone" placeholder="请输入名称" ></el-input>
</el-form-item>
<el-form-item label="车牌号" prop="carNo">
<el-input v-model="form.carNo" placeholder="请输入车牌号" ></el-input>
</el-form-item>
<el-form-item label="人脸上传" prop="carNo" style="position: relative;min-height: 200px;">
<div style="width: 100%;position: absolute;left: 0;top:50px">
<el-upload
action="https://jsonplaceholder.typicode.com/posts/"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-change="handleChange"
:auto-upload="false"
style="float: left;"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="submit">确 定</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogTableVisible" fullscreen :close-on-click-modal="false">
</el-dialog>
</div>
</template>
<script>
import axios from "axios";
import searchView from "../../../../components/searchView/searchView.vue";
export default {
data() {
return {
list:[],
dialogFormVisible:false,
dialogTableVisible:false,
dialogImageUrl: '',
dialogVisible: false,
loading:false,
fjList:[],
personList:[],
zxPersonList:[],
form:{
name:"",
sfzhm:"",
telphone:"",
carNo:"",
facePhoto:null,
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' },
],
sfzhm: [
{ required: true, message: '请输入身份证', trigger: 'blur' }
],
telphone: [
{ required: true, message: '请输入手机号', trigger: 'blur' }
],
}
}
},
props:["zxid"],
components: {
"search-view": searchView,
},
activated() {
},
mounted() {
this.url = this.$store.state.url;
console.log(this.zxid)
this.getInit();
},
methods: {
handleChange(file){
console.log(file)
this.form.facePhoto = file.raw;
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
deleteZx(id){
this.$confirm('此操作将永久删除该装修队成员, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
axios
.delete(this.url + "/Decoration/DeleteDecorationTeamPerson/"+id,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.$message.success("删除成功");
this.getInit();
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
})
},
searchs(object) {
this.page = {
fjNum: object.fjNum,
isFinish: object.isFinish,
};
this.getInit();
},
getInit(){
axios
.get(this.url + "/Decoration/GetDecorationTeamPersons/"+this.zxid,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.list = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
getFj(){
axios
.get(this.url + "/Person/GetFjs",)
.then((res) => {
let result = res.data;
if(result.code==0){
this.fjList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
search(){
this.getPerons();
},
roleChange(){
this.getPerons();
},
fjChange(val){
this.getPerons(val)
},
getPerons(val){
axios
.get(this.url + "/Person/GetPersons",{params:{fjNum:val}})
.then((res) => {
let result = res.data;
if(result.code==0){
this.personList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
getZxPerons(){
axios
.get(this.url + "/Decoration/GetDecorationTeamPersons/"+this.zxid,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.personList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
handleSelectionChange(val){
this.personIdList = val.map(e => e.id);
},
getRowClass({ row, column, rowIndex, columnIndex }) {
if (rowIndex == 0) {
return "background:#fafafa ";
}
},
submit(){
this.$refs['ruleForm'].validate((valid) => {
if(valid){
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.form.telphone)) {
this.$message.error("请输入正确的手机号码");
return;
}
const formData = new FormData();
formData.append('facePhoto', this.form.facePhoto);
formData.append('name', this.form.name);
formData.append('sfzhm', this.form.sfzhm);
formData.append('telphone', this.form.telphone);
formData.append('carNo', this.form.carNo);
axios
.post(this.url + "/Decoration/AddDecorationTeamPerson/"+this.zxid,formData)
.then((res) => {
let result = res.data;
if(result.code==0){
this.getInit();
this.dialogFormVisible =false;
this.$message.success('添加成功');
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
}
})
},
},
};
</script>
<style scoped>
.product{
width: 96%;
height: auto;
margin: auto;
}
.el-form-item__content {
margin-left: 0;
}
.search {
line-height: 60px;
text-align: left;
margin: 20px 0;
}
.select-class {
line-height: 40px;
text-align: left;
margin-bottom: 20px;
}
.stu-table .btn {
width: 65px;
height: 25px;
padding: 0;
}
.pagination {
margin-top: 20px;
}
.el-table tr {
background: #081832;
color: #fff;
}
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
background: rgb(36, 148, 215);
color: #fff;
}
.el-table__body tr.current-row > td.el-table__cell {
background: rgb(4, 75, 137);
color: #fff;
}
</style>

624
src/views/repulsebay/question/design.vue Normal file
View File

@ -0,0 +1,624 @@
<template lang="html">
<div>
<div style="width: 100%;height: 60px;background-color: #f5f5f5;display: flex;align-items: center;">
<el-page-header @back="goBack" content="设计问卷模板" style="margin-left: 20%;">
</el-page-header>
</div>
<div style="display: flex;background-color: #f5f5f5;width: 100%;height: auto;min-height: 100vh;">
<div style="width:20%;height: 100vh;"></div>
<div style="width:60%;height: 100vh;">
<div style="width: 100%;height:1vh"></div>
<div style="width: 100%;height:98vh;display: flex;">
<div style="width: 30%;height: 100%;background-color: #fff;">
<div style="width: 90%;height: 100%;margin: auto;">
<!-- 左侧栏 -->
<div style="width: 100%;height:auto;" v-for="(item,index) in leftTab" :key="index">
<div
style="width: 100%;height:40px;display: flex;align-items: center;color: #000;font-weight: bold;font-size: 16px;">
<i class="el-icon-caret-bottom"></i>
<span style="margin-left:5px">{{item.title}}</span>
</div>
<div style="width: 100%;height:auto;display: flex;flex-wrap: wrap;">
<div style="width:33.3%;height:40px;display: flex;align-items: center;" v-for="(a,i) in item.list">
<i :class="a.icon" style="color: #0095ff;"></i>
<span class="tab" @click="edit(a.name)">{{a.name}}</span>
</div>
</div>
</div>
</div>
</div>
<div style="width: 1%;height: 100%;"></div>
<div style="width: 69%;height: 100%;background-color: #fff;overflow-y: auto;">
<!-- 顶部模块 -->
<div style="width:100%;height:auto;">
<div style="width: 94%;height: auto;background-color: #fff;margin: auto;">
<div style="width: 100%;height: 1rem;"></div>
<div style="width: 100%;height: auto;display: flex;">
<div style="width: 4%;height: 100%;"></div>
<div style="width:92%;height: 100%;">
<!-- 标题 -->
<div
style="height: auto;width: 100%;color: #000;font-size: 1.6rem;font-weight: bold;line-height:2.3rem;"
@click="editFor('标题')">
{{json.title}}
</div>
<!-- 状态 -->
<div style="width: 100%;height:2.5rem;display: flex;align-items: center;">
<van-tag type="primary" size="medium" v-if="json.state==0">进行中</van-tag>
<van-tag type="primary" size="medium" v-if="json.state==1" color="#666666">已终止</van-tag>
</div>
<!-- 发起人 -->
<div style="width: 100%;height:2.5rem;display: flex;align-items: center;color: #666666;"
@click="editFor('发起人')">
发起人：{{json.promoter}}
</div>
<!-- 说明 -->
<div style="height: auto;width: 100%;color: #666666;line-height: 22px;"
v-if="json.description" @click="editFor('问卷说明')">
<div style="height: auto;width: 100%;text-align: start;">
<p style="white-space: pre-wrap;">{{json.description}}</p>
</div>
</div>
<div style="width: 100%;height: 1rem;"></div>
<!-- 图片 -->
<div style="width: 100%;height:10rem;display: flex;align-items: center;" v-if="json.image">
<img :src="json.image" style="width: 10rem;height:10rem;" alt="">
</div>
</div>
<div style="width: 4%;height: 100%;"></div>
</div>
<div style="width: 100%;height: 1rem;"></div>
</div>
</div>
<!-- 选项模块 -->
<div style="width:100%;height:auto;" v-for="(item,index) in json.optlist" :key="index">
<div style="width: 10%;height: 1rem;"></div>
<div style="width: 94%;height: auto;background-color: #fff;margin: auto;cursor: pointer;"
@click="editFor(item.optionType,index)">
<div style="width: 10%;height: 1rem;"></div>
<div style="width: 100%;height: auto;display: flex;">
<div style="width: 4%;height: 100%;"></div>
<div style="width:92%;height: 100%;">
<div style="height: auto;width: 100%;font-size: 1.1rem;line-height:1.8rem;">
<span style="color: red;" v-if="item.required">* </span>
<span> {{index+1}}. {{item.problem}}</span>
<span v-if="item.optionType=='multiple'"> (最多选择{{item.max}}个)</span>
<van-tag type="primary" round size="medium" v-if="item.optionType=='multiple'">多选</van-tag>
<van-tag type="primary" round size="medium" v-if="item.optionType=='radio'">单选</van-tag>
</div>
<div style="height: auto;width: 100%;">
<van-radio-group v-model="item.key" v-if="item.optionType=='radio'">
<div v-for="(a,i) in item.options" style="text-align: start;" :key="i" class="option"><van-radio :name="a">{{a}}</van-radio>
</div>
</van-radio-group>
<van-checkbox-group v-model="item.key" :max="item.max" v-if="item.optionType=='multiple'">
<div class="option" v-for="(a,i) in item.options" style="text-align: start;" :key="i"> <van-checkbox
:name="a">{{a}}</van-checkbox></div>
</van-checkbox-group>
<div class="option" v-if="item.optionType=='input'" @click="editFor('填空题',index)">
<input :type="item.inputType" style="background-color: #fff;border: 0;"
:placeholder="item.placeholder" v-model="item.key">
</div>
</div>
</div>
<div style="width: 4%;height: 100%;"></div>
</div>
<div style="width: 100%;height: 1rem;"></div>
</div>
</div>
<div style="width: 100%;height:40px;"></div>
<div style="width: 100%;height:40px;display: flex;justify-content: center;align-items: center;"
v-if="json.optlist.length>0">
<el-button style="width: 50%;" type="primary" @click="submit">保存模板</el-button>
</div>
</div>
</div>
<div style="width: 100%;height:1vh"></div>
</div>
<div style="width:20%;height: 100vh;"></div>
<el-dialog :title="'编辑'+visTitle" :wrapperClosable="false" :close-on-click-modal="false"
:visible.sync="dialogFormVisible" width="30%">
<!-- 顶部内容设计 -->
<el-form v-if="visTitle=='标题'">
<el-form-item label="标题" :rules="[{ required: true, message: '请输入标题', trigger: 'blur' }]">
<el-input v-model="json.title" autocomplete="off" maxlength="20"></el-input>
</el-form-item>
</el-form>
<el-form v-if="visTitle=='问卷说明'">
<el-form-item label="问卷说明">
<el-input type="textarea" v-model="json.description" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<el-form v-if="visTitle=='图片'">
<el-form-item label="图片">
<el-upload action="https://jsonplaceholder.typicode.com/posts/" list-type="picture-card"
:on-change="handleChange" :auto-upload="false" :on-preview="handlePreview" :limit="1" :file-list="image"
:on-remove="handleRemove">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :modal="false" :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</el-form-item>
</el-form>
<el-form v-if="visTitle=='发起人'">
<el-form-item label="发起人" :rules="[{ required: true, message: '请输入发起人', trigger: 'blur' }]">
<el-input v-model="json.promoter" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<!-- 单选题设计 -->
<el-form v-if="visTitle=='单选题'">
<el-form-item label="题目内容" :rules="[{ required: true, message: '请输入题目内容', trigger: 'blur' }]">
<el-input v-model="optRadioObj.problem" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="选项数" :rules="[{ required: true, message: '请选择选项数', trigger: 'change' }]">
<el-select v-model="optRadioObj.number" placeholder="请选择选项数" style="width: 100%;" @change="$forceUpdate()">
<el-option :label="i+2" :value="i+2" v-for="(a,i) in 5" :key="i"></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否必填">
<el-select v-model="optRadioObj.required" placeholder="请选择是否必填" style="width: 100%;" @change="$forceUpdate()">
<el-option label="必填" :value="true"></el-option>
<el-option label="选填" :value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="'选项'+(i+1)" :rules="[{ required: true, message: '请输入选项内容', trigger: 'blur' }]"
v-if="optRadioObj.number>0" v-for="(a,i) in optRadioObj.number" :key="i">
<el-input v-model="optRadioObj.options[i]" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<!-- 多选题设计 -->
<el-form v-if="visTitle=='多选题'">
<el-form-item label="题目内容" :rules="[{ required: true, message: '请输入题目内容', trigger: 'blur' }]">
<el-input v-model="optMultipleObj.problem" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="选项数" :rules="[{ required: true, message: '请选择选项数', trigger: 'change' }]">
<el-select v-model="optMultipleObj.number" placeholder="请选择选项数" style="width: 100%;" @change="$forceUpdate()">
<el-option :label="i+2" :value="i+2" v-for="(a,i) in 5" :key="i"></el-option>
</el-select>
</el-form-item>
<el-form-item label="是否必填">
<el-select v-model="optMultipleObj.required" placeholder="请选择是否必填" style="width: 100%;">
<el-option label="必填" :value="true"></el-option>
<el-option label="选填" :value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item label="最大选择数">
<el-select v-model="optMultipleObj.max" placeholder="请选择最大选择数" style="width: 100%;" @change="$forceUpdate()">
<el-option :label="i+1" :value="i+1" v-for="(a,i) in optMultipleObj.number" :key="i"></el-option>
</el-select>
</el-form-item>
<el-form-item :label="'选项'+(i+1)" :rules="[{ required: true, message: '请输入选项内容', trigger: 'blur' }]"
v-if="optMultipleObj.number>0" v-for="(a,i) in optMultipleObj.number" :key="i">
<el-input v-model="optMultipleObj.options[i]" autocomplete="off"></el-input>
</el-form-item>
</el-form>
<!-- 填空题设计 -->
<el-form v-if="visTitle=='填空题'">
<el-form-item label="题目内容" :rules="[{ required: true, message: '请输入题目内容', trigger: 'blur' }]">
<el-input v-model="optInputObj.problem" autocomplete="off" @change="inputChange"></el-input>
</el-form-item>
<el-form-item label="默认提示文字">
<el-input v-model="optInputObj.placeholder" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="是否必填">
<el-select v-model="optInputObj.required" placeholder="请选择是否必填" style="width: 100%;">
<el-option label="必填" :value="true"></el-option>
<el-option label="选填" :value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item label="输入框类型">
<el-select v-model="optInputObj.inputType" placeholder="请选择输入框类型" style="width: 100%;">
<el-option label="文本输入框" value="text"></el-option>
<el-option label="数字输入框" value="number"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="warning" @click="del"
v-if="addOrEdit=='edit'&&(visTitle=='多选题'||visTitle=='填空题'||visTitle=='单选题')">删除该选项</el-button>
<el-button type="primary" @click="confrom">确 定</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
url: "",
dialogImageUrl: '',
companyId: "",
dialogVisible: false,
leftTab: [
{
title: "顶部选项",
list: [{ name: "标题", icon: "el-icon-s-tools" }, { name: "问卷说明", icon: "el-icon-s-tools" }, { name: "发起人", icon: "el-icon-s-tools" }, { name: "图片", icon: "el-icon-s-tools" }],
},
{
title: "题目选项",
list: [{ name: "单选题", icon: "el-icon-s-tools" }, { name: "多选题", icon: "el-icon-s-tools" }, { name: "填空题", icon: "el-icon-s-tools" }],
},
],
image:[],
fileList: null,
showUrl: "",
activeNames: [],
dialogFormVisible: false,
visTitle: "",
addOrEdit: "",
editIndex: 0,
optRadioObj: { problem: "", number: 2, options: [], optionType: 'radio', key: '', required: true },
optMultipleObj: { problem: "", number: 2, options: [], optionType: 'multiple', key: [], required: true, max: 1 },
optInputObj: { problem: "", optionType: 'input', key: '', required: true, inputType: "text", placeholder: "请输入" },
json: {
title: "标题",//问卷标题
description: "",
state: 0,//问卷状态 例:进行中
promoter: "浅水湾小区业主委员会",//问卷发起人
image: "",//问卷图片
optlist: [
]
}
};
},
activated() {
},
mounted() {
this.url = this.$store.state.url;
if (!this.$route.query.id) {
this.json = this.json;
this.optInputObj = this.optInputObj;
this.optMultipleObj = this.optMultipleObj;
this.optRadioObj = this.optRadioObj;
}
this.getInit();
},
methods: {
goBack() {
this.$router.push("/questionList");
},
del() {
this.$confirm('此操作将删除该选项, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.json.optlist.splice(this.editIndex, 1);
this.dialogFormVisible = false;
this.$message({
type: 'success',
message: '删除成功!'
});
})
},
getInit() {
if (this.$route.query.id) {
axios
.get(this.url + "/Questionnaire/GetQuestionnaire/" + this.$route.query.id)
.then((res) => {
let result = res.data;
if (result.code == 0) {
console.log(result.data);
this.json = result.data;
this.image = [];
if(this.json.image){
this.image.push({name:"1.jpg",url:this.json.image});
}
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
}
},
handlePreview(file) {
console.log(file)
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
handleChange(file, fileList) {
if (file.size / 1024 / 1024 > 10) {
this.$message.error("上传文件不得大于10M,该文件将无法上传");
return;
}
this.showUrl = file.url;
console.log(file)
this.fileList = file.raw;
},
handleRemove() {
},
editFor(val, index) {
console.log(val)
this.addOrEdit = "edit";
if (val == "radio") {
val = "单选题";
this.editIndex = index;
if (this.$route.query.id) { this.optRadioObj = this.json.optlist[index]; this.optRadioObj.number = this.json.optlist[index].options.length }
}
if (val == "multiple") {
val = "多选题";
this.editIndex = index;
if (this.$route.query.id) { this.optMultipleObj = this.json.optlist[index]; this.optRadioObj.number = this.json.optlist[index].options.length }
}
if (val == "input") {
val = "填空题";
this.editIndex = index;
if (this.$route.query.id) { this.optInputObj = this.json.optlist[index] }
}
this.visTitle = val;
this.dialogFormVisible = true;
},
inputChange(val) {
console.log(val)
this.optInputObj.placeholder = this.optInputObj.placeholder + val;
},
confrom() {
if (this.addOrEdit == 'add') {
switch (this.visTitle) {
case "标题":
if (!this.json.title) {
this.$message({
message: this.visTitle + '不能为空',
type: 'warning'
});
return
}
break;
case "发起人":
if (!this.json.promoter) {
this.$message({
message: this.visTitle + '不能为空',
type: 'warning'
});
return
}
break
case "图片":
this.json.image = this.showUrl;
console.log(this.json.image)
break
case "单选题":
if (!this.optRadioObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
if (this.optRadioObj.options.length != this.optRadioObj.number) {
this.$message({
message: '题目选项不能为空',
type: 'warning'
});
return
}
this.json.optlist.push(this.optRadioObj);
break
case "多选题":
if (!this.optMultipleObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
if (this.optMultipleObj.options.length != this.optMultipleObj.number) {
this.$message({
message: '题目选项不能为空',
type: 'warning'
});
return
}
this.json.optlist.push(this.optMultipleObj);
break
case "填空题":
if (!this.optInputObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
this.json.optlist.push(this.optInputObj);
break
default:
}
} else {
switch (this.visTitle) {
case "标题":
if (!this.json.title) {
this.$message({
message: this.visTitle + '不能为空',
type: 'warning'
});
return
}
break;
case "发起人":
if (!this.json.promoter) {
this.$message({
message: this.visTitle + '不能为空',
type: 'warning'
});
return
}
break
case "图片":
break
case "单选题":
if (!this.optRadioObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
if (this.optRadioObj.options.length != this.optRadioObj.number) {
this.$message({
message: '题目选项不能为空',
type: 'warning'
});
return
}
this.json.optlist[this.editIndex] = this.optRadioObj;
break
case "多选题":
if (!this.optMultipleObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
if (this.optMultipleObj.options.length != this.optMultipleObj.number) {
this.$message({
message: '题目选项不能为空',
type: 'warning'
});
return
}
this.json.optlist[this.editIndex] = this.optMultipleObj;
break
case "填空题":
if (!this.optInputObj.problem) {
this.$message({
message: '题目内容不能为空',
type: 'warning'
});
return
}
this.json.optlist[this.editIndex] = this.optInputObj;
break
default:
}
}
this.dialogFormVisible = false;
},
edit(val) {
this.visTitle = val;
this.addOrEdit = "add";
this.dialogFormVisible = true;
switch (val) {
case "标题":
break;
case "问卷说明":
break
case "发起人":
break
case "图片":
break
case "单选题":
break
case "多选题":
break
case "填空题":
break
default:
}
},
submit() {
console.log(this.json)
if (!this.json.title || !this.json.promoter) { this.$message.error("标题与发起人不能为空"); return }
if (this.json.optlist.length == 0) { this.$message.error("问题未设置"); return }
var formData = new FormData();
formData.append("title", this.json.title);
if (!this.json.description) {
this.json.description = "";
}
formData.append("description", this.json.description);
formData.append("image", this.fileList);
formData.append("promoter", this.json.promoter);
formData.append("optList", JSON.stringify(this.json.optlist));
if (this.$route.query.id) {
axios
.put(this.url + "/Questionnaire/UpdateQuestionnaire/" + this.$route.query.id, formData)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$message.success("保存成功");
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
} else {
axios
.post(this.url + "/Questionnaire/AddQuestionnaire", formData)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$message.success("保存成功");
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
}
},
},
};
</script>
<style scoped>
.option {
display: flex;
align-items: center;
height: auto;
min-height: 3rem;
width: 100%;
border-bottom: 1px solid #e5e5e5;
}
.tab {
margin-left: 10px;
font-size: 14px;
color: #666666;
cursor: pointer;
}
</style>

272
src/views/repulsebay/question/personList.vue Normal file
View File

@ -0,0 +1,272 @@
<template lang="html">
<div class="product" >
<div
style="
width: 100%;
height: auto;
margin: auto;
display: flex;
margin-top: 20px;
margin-bottom: 20px;
"
>
<div style="display: flex; width: 60%; flex-wrap: wrap">
<el-select v-model="roles" multiple placeholder="请选择" style="width: 30%;" >
<el-option
v-for="item in roleList"
:key="item"
:label="item"
:value="item">
</el-option>
</el-select>
<el-button style="margin-left: 10px;" type="primary" @click="search">查询</el-button>
</div>
<div style="flex: 1">
<el-button
style="float: right;"
type="primary"
icon="el-icon-plus"
@click="add"
>添加人员</el-button
>
</div>
</div>
<!-- 表格 -->
<div class="stu-table">
<el-table
:data="list"
v-loading="loading"
stripe
:header-cell-style="getRowClass"
style="width: 100%"
>
<el-table-column prop="fj_Num" align="center" label="户号" :min-width="flexWidth('fj_Num', list, '户号')">
</el-table-column>
<el-table-column prop="name" align="center" label="姓名" :min-width="flexWidth('name', list, '姓名')">
</el-table-column>
<el-table-column prop="phone" align="center" label="手机号" :min-width="flexWidth('phone', list, '手机号')">
</el-table-column>
<el-table-column prop="role" align="center" label="角色" :min-width="flexWidth('role', list, '角色')">
</el-table-column>
</el-table>
</div>
<el-dialog title="添加人员" :visible.sync="dialogFormVisible" width="30%" :close-on-click-modal="false">
<el-form :model="form" :rules="rules" ref="ruleForm">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" ></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phoneNum">
<el-input type="text" v-model="form.phoneNum" placeholder="请输入手机号" ></el-input>
</el-form-item>
<el-form-item label="房号" prop="fjNum">
<el-select v-model="form.fjNum" placeholder="请选择房号" style="width: 100%;">
<el-option :label="a.fj_num" :value="a.fj_num" v-for="(a,i) in fjList"></el-option>
</el-select>
</el-form-item>
<el-form-item label="角色" prop="role">
<el-select v-model="form.role" placeholder="请选择角色" style="width: 100%;">
<el-option label="业主" value="业主"></el-option>
<el-option label="户主" value="户主"></el-option>
<el-option label="保姆" value="保姆"></el-option>
<el-option label="司机" value="司机"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="submit">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import axios from "axios";
import { AddPerson,GetPersons } from "../../../api/index.js";
export default {
data() {
return {
list:[],
roleList:['户主','业主','司机','保姆'],
roles:[],
personIdList:[],
dialogFormVisible:false,
loading:false,
companyId:"",
staticJson:{title:"",list:[]},
fjList:[],
form:{
name:"",
phoneNum:"",
fjNum:"",
role:"",
},
rules: {
name: [
{ required: true, message: '请输入姓名', trigger: 'blur' },
],
phoneNum: [
{ required: true, message: '请输入手机号', trigger: 'blur' }
],
fjNum: [
{ required: true, message: '请选择房号', trigger: 'change' }
],
role: [
{ required: true, message: '请选择角色', trigger: 'change' }
],
}
}
},
components: {
},
activated() {
},
mounted() {
this.url = this.$store.state.url;
this.getPerons();
this.getFj();
},
methods: {
add(){
this.form={
name:"",
phoneNum:"",
fjNum:"",
role:"",
};
this.dialogFormVisible=true;
},
search(){
this.getPerons();
},
roleChange(){
this.getPerons();
},
getFj(){
axios
.get(this.url + "/Person/GetFjs",)
.then((res) => {
let result = res.data;
if(result.code==0){
this.fjList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
getPerons(){
let str = "";
this.roles.forEach((e,i) => {
if(i==0){
str += "?roles="+e
} else{
str += "&roles="+e
}
});
GetPersons(str).then((res) => {
let result = res.data;
if(result.code==0){
this.list = result.data;
} else{
this.$message.error(result.msg);
}
})
},
handleSelectionChange(val){
this.personIdList = val.map(e => e.id);
},
getRowClass({ row, column, rowIndex, columnIndex }) {
if (rowIndex == 0) {
return "background:#fafafa ";
}
},
submit(){
this.$refs['ruleForm'].validate((valid) => {
if(valid){
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.form.phoneNum)) {
this.$toast.fail("请输入正确的手机号码");
return;
}
AddPerson(this.form).then((res) => {
let result = res.data;
if(result.code==0){
this.getPerons();
this.dialogFormVisible =false;
this.$message.success('添加成功');
} else{
this.$message.error(result.msg);
}
})
}
})
},
},
};
</script>
<style scoped>
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button{
-webkit-appearance: none !important;
margin: 0;
}
.product{
width: 96%;
height: auto;
margin: auto;
}
.el-form-item__content {
margin-left: 0;
}
.search {
line-height: 60px;
text-align: left;
margin: 20px 0;
}
.select-class {
line-height: 40px;
text-align: left;
margin-bottom: 20px;
}
.stu-table .btn {
width: 65px;
height: 25px;
padding: 0;
}
.pagination {
margin-top: 20px;
}
.el-table tr {
background: #081832;
color: #fff;
}
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
background: rgb(36, 148, 215);
color: #fff;
}
.el-table__body tr.current-row > td.el-table__cell {
background: rgb(4, 75, 137);
color: #fff;
}
</style>

379
src/views/repulsebay/question/personalCenter.vue Normal file
View File

@ -0,0 +1,379 @@
<template lang="html">
<div style="background-color: #f2f2f2; min-height: 100vh" v-loading="load">
<div style="width: 100%; height: 10rem; background-color: #ffffff">
<div class="my_header">
<div style="width: 50%; height: 100%">
<div style="width: 100%; height: 3rem"></div>
<div
style="
width: 100%;
height: 1.5rem;
line-height: 1.5rem;
color: black;
font-size: 1.3rem;
"
class="login_name"
>
{{user.name?user.name:'微信人员'}}
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="width: 100%; height: 2.5rem; color: #a2a2a2">
<div
style="width: 100%; height: 1.25rem; line-height: 1.25rem"
class="login_tel"
>
{{user.telphone}}
</div>
<div
style="width: 100%; height: 1.25rem; line-height: 1.25rem"
class="login_roles"
>
住宅-{{user.fjNum}}
</div>
</div>
<div style="width: 100%; height: 2rem"></div>
</div>
<div
style="
width: 30%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
"
>
<div
style="
width: 5rem;
height: 5rem;
background-color: #f4f4f6;
border-radius: 2.5rem;
display: flex;
align-items: center;
justify-content: center;
"
class="user_photo"
@click="handleUpload"
>
<van-icon name="contact" color="#b2b2b2" size="2.8rem" v-if="!user.facePhoto" />
<img :src="user.facePhoto" alt="" style="width: 100%;height: 100%; border-radius: 2.5rem;" v-if="user.facePhoto">
<!-- <i class="layui-icon layui-icon-username" style="color:#b2b2b2;font-size:2.8rem"></i> -->
</div>
</div>
</div>
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="background: #ffffff; width: 100%; height: 4rem" @click="$router.push('/applyFamily')">
<div style="width: 90%; height: 4rem; display: flex; margin: auto">
<div
style="width: 50%; height: 100%; display: flex; align-items: center"
>
<van-icon name="wap-home" color="#d6d6da" size="1.4rem" />
<span style="margin-left: 8%; color: #676767; font-size: 1rem"
>成员管理</span
>
</div>
<div
style="
width: 50%;
height: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
"
>
<van-icon name="arrow" color="#d6d6da" size="1.4rem" />
</div>
</div>
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="background: #ffffff; width: 100%; height: 4rem" @click="$router.push('/applyCar')">
<div style="width: 90%; height: 4rem; display: flex; margin: auto">
<div
style="width: 50%; height: 100%; display: flex; align-items: center"
>
<van-icon name="cluster" color="#d6d6da" size="1.4rem" />
<span style="margin-left: 8%; color: #676767; font-size: 1rem"
>车辆管理</span
>
</div>
<div
style="
width: 50%;
height: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
"
>
<van-icon name="arrow" color="#d6d6da" size="1.4rem" />
</div>
</div>
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="background: #ffffff; width: 100%; height: 4rem" @click="go('invite')">
<div style="width: 90%; height: 4rem; display: flex; margin: auto">
<div
style="width: 50%; height: 100%; display: flex; align-items: center"
>
<van-icon name="friends" color="#d6d6da" size="1.4rem" />
<span style="margin-left: 8%; color: #676767; font-size: 1rem">邀请访客</span>
</div>
<div
style="
width: 50%;
height: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
"
>
<van-icon name="arrow" color="#d6d6da" size="1.4rem" />
</div>
</div>
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="background: #ffffff; width: 100%; height: 4rem" @click="go('applylog')">
<div style="width: 90%; height: 4rem; display: flex; margin: auto">
<div
style="width: 50%; height: 100%; display: flex; align-items: center"
>
<van-icon name="notes-o" color="#d6d6da" size="1.4rem" />
<span style="margin-left: 8%; color: #676767; font-size: 1rem">访客记录</span>
</div>
<div
style="
width: 50%;
height: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
"
>
<van-icon name="arrow" color="#d6d6da" size="1.4rem" />
</div>
</div>
</div>
<div style="width: 100%; height: 1rem"></div>
<div style="background: #ffffff; width: 100%; height: 4rem" @click="go('applyforQrcode?id='+user.id+'&fjNum='+user.fjNum)">
<div style="width: 90%; height: 4rem; display: flex; margin: auto">
<div
style="width: 50%; height: 100%; display: flex; align-items: center"
>
<van-icon name="guide-o" color="#d6d6da" size="1.4rem" />
<span style="margin-left: 8%; color: #676767; font-size: 1rem">访客申请码</span>
</div>
<div
style="
width: 50%;
height: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
"
>
<van-icon name="arrow" color="#d6d6da" size="1.4rem" />
</div>
</div>
</div>
<div class="admin-footer">
<span>copyright@宁波大招科技有限公司 0574-23668886 23668889</span
>
</div>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
<van-uploader :after-read="afterRead" ref="uploader" v-show="false" />
<van-dialog v-model="doalogshow" title="绑定车牌" show-cancel-button @confirm="evaluateConfirm">
<div style="width: 80%;height:auto;margin: auto;" @click="popShow = true">
<el-input
type="text"
placeholder="请输入车牌"
readonly
v-model="evaluateValue">
</el-input>
</div>
</van-dialog>
</div>
</template>
<script>
import { Dialog } from "vant";
import axios from "axios";
import Keyboards from '../../../components/keyboards/keyboards.vue'
export default {
data() {
return {
url: "",
load:false,
doalogshow:false,
user: {},
evaluateValue:"",
popShow:false,
};
},
activated() {
},
components:{Keyboards},
mounted() {
this.url = this.$store.state.url;
// localStorage.setItem("userInfo",JSON.stringify({id:100005,name:'王德法',telphone:'18058587597',unit:'',fjNum:'010101',facePhoto:''}));
// localStorage.setItem("userInfo",JSON.stringify( {
// id: 1184,
// personId: 128,
// name: "王德法",
// telphone: "18058587597",
// companyName: "宁波大招科技有限公司",
// }));
this.getInit();
},
methods: {
submitBack(val){
this.popShow = false;
this.evaluateValue = val;
},
evaluateConfirm(){
if(!this.evaluateValue){
this.$toast.fail("必须填不能为空");
return
}
axios
.post(this.url + "/Person/AddCar", {personId:this.user.id,carNo:this.evaluateValue})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success('绑定成功');
} else {
this.$toast.fail(result.msg);
}
});
},
afterRead(file){
const formData = new FormData();
formData.append('file', file.file);
this.load = true;
axios
.post(this.url + "/Person/UploadFacePhoto/"+this.user.id, formData)
.then((res) => {
let result = res.data;
this.load = false;
if (result.code == 0) {
this.$toast.success('更新成功');
this.user.facePhoto = result.data;
console.log(this.user)
localStorage.setItem("userInfo",JSON.stringify(this.user));
} else {
this.$toast.fail(result.msg);
}
});
console.log(file);
},
handleUpload() {
console.log(this.$refs.uploader)
this.$refs.uploader.chooseFile(); // 触发上传组件的点击事件
},
go(url){
this.$router.push("/"+url);
},
getInit() {
if (localStorage.getItem("userInfo")) {
this.user = JSON.parse(localStorage.getItem("userInfo"));
} else{
this.$toast.fail("暂无人员信息");
// this.$router.push('/bind');
}
},
getJson() {},
getUser(openid) {},
submit() {},
},
};
</script>
<style>
html{
font-size: 16px;
}
</style>
<style scoped>
html,
body {
margin: 0;
padding: 0;
}
:root {
overflow-y: auto;
overflow-x: hidden;
}
:root body {
position: absolute;
}
html {
overflow-y: scroll;
}
body {
width: 100vw;
overflow: hidden;
-webkit-text-size-adjust: 100% !important;
text-size-adjust: 100% !important;
-moz-text-size-adjust: 100% !important;
}
.navi_footer {
background-color: #ffffff;
display: flex;
position: fixed;
bottom: 0%;
height: 3rem;
width: 100%;
color: #888b93;
}
.navi_footer_check {
font-weight: bold;
}
.admin-footer {
width: 100%;
text-align: center;
position: absolute;
bottom: 0;
font-size: 0.7rem;
color: #9999b3;
margin-bottom: 10px;
}
.navi_footer_check div {
height: 50%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.navi_footer_this div {
height: 50%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.navi_footer_this {
color: #57b88f;
font-weight: bold;
}
.my_header {
width: 90%;
height: 10rem;
background-color: #ffffff;
display: flex;
justify-content: space-between;
margin: auto;
}
</style>

279
src/views/repulsebay/question/question.vue Normal file
View File

@ -0,0 +1,279 @@
<template lang="html">
<div>
<!-- 个人信息模块 -->
<van-notice-bar mode="closeable">尊敬的{{name}}，请您对以下征询意见作出选择</van-notice-bar>
<div style="width:100%;height:auto;min-height: 100vh;background-color: #f1f1f1;" v-if="json.state == 0">
<!-- 头部模块 -->
<div style="width:100%;height:auto;">
<div style="width: 100%;height: 1rem;"></div>
<div style="width: 94%;height: auto;background-color: #fff;margin: auto;">
<div style="width: 10%;height: 1rem;"></div>
<div style="width: 100%;height: auto;display: flex;">
<div style="width: 4%;height: 100%;"></div>
<div style="width:92%;height: 100%;">
<!-- 标题 -->
<div style="height: auto;width: 100%;color: #000;font-size: 1.6rem;font-weight: bold;line-height:2.3rem;">
{{json.title}}
</div>
<!-- 状态 -->
<div style="width: 100%;height:2.5rem;display: flex;align-items: center;">
<van-tag type="primary" size="medium" v-if="json.state==0">进行中</van-tag>
<van-tag type="primary" size="medium" v-if="json.state==1" color="#666666">已终止</van-tag>
</div>
<!-- 发起人 -->
<div style="width: 100%;height:2.5rem;display: flex;align-items: center;color: #666666;">
发起人：{{json.promoter}}
</div>
<!-- 说明 -->
<div style="height: auto;width: 100%;color: #666666;line-height: 20px;"
v-if="json.description">
<p style="white-space: pre-wrap;">{{json.description}}</p>
</div>
<div style="width: 100%;height: 1rem;"></div>
<!-- 图片 -->
<div style="width: 100%;height:10rem;display: flex;align-items: center;" v-if="json.image" @click="showImg(json.image)">
<img :src="json.image" style="width: 10rem;height:10rem;" alt="">
</div>
</div>
<div style="width: 4%;height: 100%;"></div>
</div>
<div style="width: 100%;height: 1rem;"></div>
</div>
</div>
<!-- 选项模块 -->
<div style="width:100%;height:auto;" v-for="(item,index) in json.optlist" :key="index">
<div style="width: 10%;height: 1rem;"></div>
<div style="width: 94%;height: auto;background-color: #fff;margin: auto;">
<div style="width: 10%;height: 1rem;"></div>
<div style="width: 100%;height: auto;display: flex;">
<div style="width: 4%;height: 100%;"></div>
<div style="width:92%;height: 100%;">
<div style="height: auto;width: 100%;font-size: 1.1rem;line-height:1.8rem;">
<span style="color: red;" v-if="item.required">* </span>
<span> {{index+1}}. {{item.problem}}</span>
<span v-if="item.optionType=='multiple'"> (最多选择{{item.max}}个)</span>
<van-tag type="primary" round size="medium" v-if="item.optionType=='multiple'">多选</van-tag>
<van-tag type="primary" round size="medium" v-if="item.optionType=='radio'">单选</van-tag>
</div>
<div style="height: auto;width: 100%;">
<van-radio-group v-model="item.key" v-if="item.optionType=='radio'" :disabled="json.isFill?true:false">
<div v-for="(a,i) in item.options" :key="i" class="option"><van-radio :name="a">{{a}}</van-radio>
</div>
</van-radio-group>
<van-checkbox-group v-model="item.key" :max="item.max" v-if="item.optionType=='multiple'"
:disabled="json.isFill?true:false">
<div class="option" v-for="(a,i) in item.options" :key="i"> <van-checkbox
:name="a">{{a}}</van-checkbox></div>
</van-checkbox-group>
<div class="option" v-if="item.optionType=='input'">
<input :disabled="json.isFill?true:false" :type="item.inputType"
style="background-color: #fff;border: 0;" :placeholder="item.placeholder" v-model="item.key">
</div>
</div>
</div>
<div style="width: 4%;height: 100%;"></div>
</div>
<div style="width: 100%;height: 1rem;"></div>
</div>
</div>
<!-- 提交 -->
<div style="width: 100%;height: 6rem;">
<div style="width: 94%;display: flex;align-items: center;height: 6rem;justify-content: center;margin: auto;">
<van-button type="info" style="width: 100%;" @click="submit"
:disabled="json.isFill?true:false">提交问卷</van-button>
</div>
</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
radio: "",
box: [],
url: "",
json: {},
templateId: "",
msgid: "",
name: "",
json1: {
templateId: 1,//问卷模板ID
title: "关于浅水湾小区业主关切热点问题的意见征询",//问卷标题
description: "",
state: 0,//问卷状态 例:进行中
promoter: "浅水湾小区业主委员会",//问卷发起人
image: "",//问卷图片
optlist: [
{
optionId: 11,//问题ID
problem: "是否要求恢复原状。",//问题描述
optionType: "radio",//输入类型 input输入框,radio单选框,multiple复选框
required: true,//是否必填
options: ["支持", "不支持"],//列表
key: "",
},
{
optionId: 12,
problem: "投票人姓名",
optionType: "input",
required: true,
inputType: "text",
key: "",
placeholder: "",
},
{
optionId: 13,
problem: "是否要求恢复原状",
optionType: "multiple",
required: true,
max: 2,//多选最大数
options: ["支持", "不支持"],
key: [],
},
]
}
};
},
activated() {
// axios
// .get(this.url + "/Questionnaire/GetPersonQuestionnaire/"+37,{params:{personId:1184}})
// .then((res) => {
// let result = res.data;
// console.log(result)
// if(result.code==0){
// this.json = result.data;
// } else{
// this.$toast.fail(result.msg);
// }
// })
// .catch((error) => {});
},
mounted() {
this.url = this.$store.state.url;
this.getInit();
// this.msgid = 100005;
// this.name = '王德法'
// this.getJson();
},
methods: {
showImg(url){
window.open(url,'_black')
},
getInit() {
if (this.$route.query.id && this.$route.query.code) {
this.templateId = this.$route.query.id;
axios
.get(
this.url +
"/Wx/GetOpenId" +
"?code=" +
this.$route.query.code,
{}
)
.then((res) => {
let result = res.data;
if (result.code == 0) {
let openid = result.data;
this.getUser(openid);
} else {
this.$toast.fail("人员信息已失效，请重新打开");
}
})
.catch((error) => { });
} else {
this.$toast.fail("模板信息错误");
}
},
getJson() {
axios
.get(this.url + "/Questionnaire/GetPersonQuestionnaire/" + this.$route.query.id, { params: { personId: this.msgid } })
.then((res) => {
let result = res.data;
console.log(result)
if (result.code == 0) {
this.json = result.data;
} else {
this.$toast.fail(result.msg);
}
})
.catch((error) => { });
},
getUser(openid) {
axios
.get(this.url + "/Wx/GetUserInfo?openId=" + openid, {})
.then((res) => {
let result = res.data;
this.load = false;
if (result.code == 0) {
this.msgid = result.data.id;
this.name = result.data.name;
this.getJson();
} else {
this.$toast.fail("权限不足，请联系管理员");
}
}).catch(error => {
});
},
submit() {
if (!this.$route.query.id) {
return
}
if (this.json.optlist.some(e => e.required && !e.key)) {
this.$toast.fail("必填项不能为空");
return;
}
let array = this.json.optlist.map(e => ({ optionId: e.optionId, optionType: e.optionType, key: e.key }));
array.forEach(e => {
if (e.optionType == 'multiple') {
e.key = JSON.stringify(e.key);
}
});
axios
.post(this.url + "/Questionnaire/PersonQuestionnaireAnswer/" + this.templateId, array)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$router.push("/questionSuccess?id=" + this.$route.query.id + "&urlState=1");
} else {
this.$toast.fail(result.msg);
}
})
.catch((error) => { alert(JSON.stringify(error.response)) });
console.log(array)
},
},
};
</script>
<style scoped>
.option {
display: flex;
align-items: center;
height: auto;
min-height: 3rem;
width: 100%;
border-bottom: 1px solid #e5e5e5;
}
</style>

512
src/views/repulsebay/question/questionList.vue Normal file
View File

@ -0,0 +1,512 @@
<template lang="html">
<div class="product" v-loading="submitState">
<div style="
width: 100%;
height: auto;
margin: auto;
display: flex;
margin-top: 20px;
margin-bottom: 20px;
">
<div style="display: flex; width: 60%; flex-wrap: wrap">
<search-view ref="search" :list="searchList" :handleSearch="searchs"></search-view>
</div>
<div style="flex: 1">
<el-button style="float: right;" type="primary" icon="el-icon-plus" @click="add">添加问卷模板</el-button>
</div>
</div>
<!-- 表格 -->
<div class="stu-table">
<el-table :data="list" v-loading="loading" stripe :header-cell-style="getRowClass" style="width: 100%">
</el-table-column>
<el-table-column prop="title" align="center" label="问卷标题" :min-width="flexWidth('title', list, '问卷标题')">
</el-table-column>
<el-table-column prop="promoter" align="center" label="发起人" :min-width="flexWidth('promoter', list, '发起人')">
</el-table-column>
<el-table-column align="center" label="问卷状态">
<template slot-scope="scope">
<div slot="reference" class="name-wrapper">
<el-tag type="warning" size="medium" v-if="scope.row.state == 0">进行中</el-tag>
<el-tag type="info" size="medium" v-if="scope.row.state == 1">已终止</el-tag>
</div>
</template>
</el-table-column>
<el-table-column prop="createdTime" align="center" label="创建时间"
:min-width="flexWidth('createdTime', list, '创建时间')">
</el-table-column>
<el-table-column align="center" label="操作" width="370" fixed="right">
<template slot-scope="scope">
<el-button size="mini" type="primary" icon="el-icon-s-tools" @click.native.stop="edit(scope.row.templateId)"
v-if="scope.row.state==1">编辑</el-button>
<el-button size="mini" type="warning" icon="el-icon-refresh"
@click.native.stop="change(scope.row)">更改问卷状态</el-button>
<el-button size="mini" icon="el-icon-s-promotion" @click.native.stop="sending(scope.row.templateId)"
v-if="scope.row.state==0">发送模板</el-button>
<el-button size="mini" type="success"
@click.native.stop="static(scope.row.templateId)">问卷统计</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="已注册公众号人员" :visible.sync="dialogTableVisible">
<div style="width:100%;height:60px;display: flex;align-items: center;">
<el-select v-model="roles" multiple placeholder="请选择" style="width: 30%;" @change="roleChange">
<el-option v-for="item in roleList" :key="item" :label="item" :value="item">
</el-option>
</el-select>
</div>
<el-table :data="gridData" ref="multipleTable" tooltip-effect="dark" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="name" label="姓名"></el-table-column>
<el-table-column prop="telphone" label="联系方式"></el-table-column>
<el-table-column prop="role" label="角色"></el-table-column>
</el-table>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogTableVisible = false">取 消</el-button>
<el-button type="primary" @click="sendConfrim">确 定</el-button>
</div>
</el-dialog>
<el-dialog :title="staticJson.title" :visible.sync="dialogTableVisibleEcharts" width="50%"
@close="handleDialogClose">
<div style="width:100%;height:auto;display:flex;flex-wrap: wrap;font-family: '黑体 ';">
<div style="width: 100%;height:60px;display: flex;align-items: center;justify-content: space-between;">
<el-card class="box-card" style="width: 18%;">
<div @click="getTpMx('全部')" style="cursor: pointer;">
<span >全部人数 </span>
<span style="font-weight: bold;"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{templateTpJson.allNum}}</span>
</div>
</el-card>
<el-card class="box-card" style="width: 18%;">
<div @click="getTpMx('已读')" style="cursor: pointer;">
<span>已读人数</span>
<span style="font-weight: bold;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{templateTpJson.readNum}}</span>
</div>
</el-card>
<el-card class="box-card" style="width: 18%;" >
<div @click="getTpMx('未读')" style="cursor: pointer;">
<span>未读人数</span>
<span style="font-weight: bold;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{templateTpJson.noReadNum}}</span>
</div>
</el-card>
<el-card class="box-card" style="width: 18%;" >
<div @click="getTpMx('已提交')" style="cursor: pointer;">
<span>已提交人数</span>
<span style="font-weight: bold;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{templateTpJson.fillInNum}}</span>
</div>
</el-card>
<el-card class="box-card" style="width: 18%;" >
<div @click="getTpMx('未提交')" style="cursor: pointer;">
<span>未提交人数</span>
<span style="font-weight: bold;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{templateTpJson.noFillInNum}}</span>
</div>
</el-card>
</div>
<div style="width: 100%;height:30px;display: flex;align-items: center;justify-content: space-between;">
</div>
<div style="width: 100%;height:400px;" v-for="(item,index) in staticJson.list" :key="index">
<chart-block ref="echarts" :option="item" :key="'chart'+index"></chart-block>
</div>
</div>
</el-dialog>
<el-dialog title="投票明细" :visible.sync="dialogTpTableVisible" width="80%" :close-on-click-modal="false">
<table-view ref="table" :datalist="tpmxList" :page="{}" :key="loadTable" width="100%"
:propList="[{label:'房号',prop:'fj_Num'},{label:'姓名',prop:'name'},{label:'角色',prop:'role'},{label:'读取/提交时间',prop:'time'}]" :slots="[]"
:isPage="false">
</table-view>
</el-dialog>
</div>
</template>
<script>
import searchView from "../../../components/searchView/searchView.vue";
import tableView from "../../../components/tableView/tableView.vue";
import axios from "axios";
export default {
data() {
return {
loadTable: 0,
option: {
title: {
text: 'Referer of a Website',
subtext: 'Fake Data',
left: 'center'
},
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
left: 'left'
},
series: [
{
name: 'Access From',
type: 'pie',
radius: '50%',
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
{ value: 580, name: 'Email' },
{ value: 484, name: 'Union Ads' },
{ value: 300, name: 'Video Ads' }
],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
},
gridData: [],
list: [],
roleList: ['户主', '业主', '司机', '保姆'],
roles: [],
personIdList: [],
tpmxList: [],
dialogTableVisible: false,
dialogTpTableVisible: false,
dialogTableVisibleEcharts: false,
submitState: false,
loading: false,
companyId: "",
templateId: "",
templateTpJson: {},
staticJson: { title: "", list: [] },
page: {
title: "",
state: 2,
promoter: "",
date: "",
},
searchList: [
{
placeholder: "请输入标题",
type: "input",
prop: "title",
},
{
placeholder: "请选择问卷状态",
type: "select",
prop: "state",
options: [
{
name: "进行中",
value: 0,
},
{
name: "已终止",
value: 1,
},
{
name: "全部",
value: 2,
},
],
},
{
placeholder: "请输入发起人",
type: "input",
prop: "promoter",
},
{
type: "date_select",
prop: "date",
},
],
}
},
components: {
"search-view": searchView,
"table-view": tableView,
},
activated() {
},
mounted() {
this.url = this.$store.state.url;
this.getInit();
console.log(111)
},
methods: {
getTpMx(type) {
this.submitState = true;
console.log(111)
axios
.get(this.url + "/Questionnaire/GetQuestionnaireSendTotalDetail/" + this.templateId, {params:{type:type}})
.then((res) => {
let result = res.data;
this.submitState = false;
if (result.code == 0) {
this.dialogTpTableVisible = true;
this.tpmxList = result.data;
this.loadTable++;
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { this.$message.error(error.response.data.msg); });
},
roleChange() {
this.getPerons();
},
getPerons() {
let str = "";
this.roles.forEach((e, i) => {
if (i == 0) {
str += "?roles=" + e
} else {
str += "&roles=" + e
}
});
axios
.get(this.url + "/Person/GetPersons" + str,)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.gridData = result.data;
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
},
handleDialogClose() {
this.dialogTableVisibleEcharts = false;
this.$nextTick(() => {
// 在DOM更新完成后重新渲染chart-block组件
this.$refs.echarts.forEach(block => block.refresh());
});
},
static(id) {
this.templateId = id;
this.getTp();
axios
.get(this.url + "/Questionnaire/GetQuestionnaireStatistics/" + id)
.then((res) => {
let result = res.data;
if (result.code == 0) {
console.log(result.data.questionnaireProblemStatisticsDtos)
if (result.data.questionnaireProblemStatisticsDtos.length > 0) {
this.dialogTableVisibleEcharts = true;
this.staticJson.list = [];
result.data.questionnaireProblemStatisticsDtos.forEach(e => {
let array = e.questionnaireProblemOptionStatisticsDtos.map(a => ({ value: a.num, name: a.option }));
let text = e.problem.length > 30 ? e.problem.substring(0, 40) + '...' : e.problem;
let options = {
title: {
text: text,
left: 'center',
},
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
left: 'left',
top: '10%'
},
series: [
{
name: '',
type: 'pie',
radius: '50%',
data: array,
center: ['50%', '70%'],
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: 'rgba(0, 0, 0, 0.5)'
}
}
}
]
}
this.staticJson.list.push(options);
});
this.staticJson.title = result.data.title;
console.log(charts)
} else {
this.$message.error("暂无投票信息");
}
console.log(result)
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
},
change(row) {
let state = (row.state == 0) ? 1 : 0;
axios
.put(this.url + "/Questionnaire/UpdateQuestionnaireState/" + row.templateId + "?state=" + state)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.getInit();
this.$message.success("更改成功");
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
},
sendConfrim() {
axios
.post(this.url + "/Questionnaire/SendPersonQuestionnaire/" + this.templateId, this.personIdList)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$message.success("发送成功");
this.dialogTableVisible = false
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { this.$message.error(error.response.data.msg); });
},
handleSelectionChange(val) {
this.personIdList = val.map(e => e.id);
},
sending(id) {
this.dialogTableVisible = true;
this.templateId = id;
this.getPerons();
},
add() {
this.$router.push('/design');
},
edit(id) {
this.$router.push('/design?id=' + id);
},
getRowClass({ row, column, rowIndex, columnIndex }) {
if (rowIndex == 0) {
return "background:#fafafa ";
}
},
searchs(object) {
console.log(object)
this.page = {
title: object.title,
state: object.state,
promoter: object.promoter,
date: object.date,
};
this.getInit();
},
getTp() {
this.loading = true;
axios
.get(this.url + "/Questionnaire/GetQuestionnaireSendTotal/" + this.templateId, {})
.then((res) => {
this.loading = false;
let result = res.data;
if (result.code == 0) {
this.templateTpJson = result.data;
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
},
getInit() {
this.loading = true;
axios
.get(this.url + "/Questionnaire/GetQuestionnaires", { params: this.page })
.then((res) => {
this.loading = false;
let result = res.data;
if (result.code == 0) {
this.list = result.data;
} else {
this.$message.error(result.msg);
}
})
.catch((error) => { });
},
submit() {
},
},
};
</script>
<style scoped>
.el-card__body {
padding: 0;
}
.product {
width: 96%;
height: auto;
margin: auto;
}
.el-form-item__content {
margin-left: 0;
}
.search {
line-height: 60px;
text-align: left;
margin: 20px 0;
}
.select-class {
line-height: 40px;
text-align: left;
margin-bottom: 20px;
}
.stu-table .btn {
width: 65px;
height: 25px;
padding: 0;
}
.pagination {
margin-top: 20px;
}
.el-table tr {
background: #081832;
color: #fff;
}
.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
background: rgb(36, 148, 215);
color: #fff;
}
.el-table__body tr.current-row>td.el-table__cell {
background: rgb(4, 75, 137);
color: #fff;
}
</style>

60
src/views/repulsebay/question/questionStatistics.vue Normal file
View File

@ -0,0 +1,60 @@
<template>
<div>
<div style="width: 100%; height: 400px">
<chart-block :option="option"></chart-block>
</div>
</div>
</template>
<script>
export default {
name: "xxxxx",
data() {
return {
option: {
tooltip: {
trigger: "item",
},
legend: {
top: "5%",
left: "center",
},
series: [
{
name: "Access From",
type: "pie",
radius: ["40%", "70%"],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: "#fff",
borderWidth: 2,
},
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: 40,
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 1048, name: "Search Engine" },
{ value: 735, name: "Direct" },
{ value: 580, name: "Email" },
{ value: 484, name: "Union Ads" },
{ value: 300, name: "Video Ads" },
],
},
],
},
};
},
};
</script>

125
src/views/repulsebay/question/questionSuccess.vue Normal file
View File

@ -0,0 +1,125 @@
<template lang="html">
<div style="padding: 20px" v-if="$route.query.urlState">
<div style="width: 100%;height: auto;">
<div style="width: 100%;height:10rem;">
<el-result icon="success" :title="'投票成功'" >
<template slot="extra">
<!-- <el-button type="warning" size="medium" @click="goOrder">查看订单</el-button> -->
</template>
</el-result>
</div>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 100%;height:auto;">
<div style="width: 100%;height:3rem;display: flex;align-items: center;font-weight: bold;font-size: 1.1rem;">尊敬的{{json.personName}}业主</div>
<div style="width: 100%;height:auto;display: flex;font-size: 0.8rem;line-height:1.2rem;">非常感谢您于{{json.submitTime}}提交的{{json.name}}的调查及问卷</div>
</div>
<div style="width: 100%;height:2rem;"></div>
<el-descriptions title="您的本次的投票的意见如下：" direction="vertical" :column="1" border >
<el-descriptions-item :label="(index+1)+'.'+item.problem" v-for="(item,index) in json.options" :key="index">{{item.answer}}</el-descriptions-item>
</el-descriptions>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 100%;height:2rem;display: flex;align-items: center;justify-content: flex-end;color: #909399;font-size: 0.8rem;">
{{json.sameDay}} {{json.promoter}}
</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {url:"",json:{},msgid:"",name:"",};
},
activated(){
},
created() {
// let that = this; setTimeout(function(){ that.$router.push('/orderList');},3000)
},
mounted() {
this.url = this.$store.state.url;
console.log(this.$route.query.urlState=='1')
if(this.$route.query.urlState){
if(this.$route.query.urlState=='0'){
this.getInit();
}
if(this.$route.query.urlState=='1'){
this.getJson();
}
} else{
this.$toast.fail("回调参数状态错误，请重试");
}
},
methods: {
getInit(){
if(this.$route.query.id && this.$route.query.code ){
this.templateId = this.$route.query.id;
axios
.get(
this.url +
"/Wx/GetOpenId" +
"?code=" +
this.$route.query.code,
{}
)
.then((res) => {
let result = res.data;
if (result.code == 0) {
let openid = result.data;
this.getUser(openid);
} else {
this.$toast.fail("人员信息已失效，请重新打开");
}
})
.catch((error) => {});
} else{
this.$toast.fail("回调参数错误");
}
},
getJson(){
axios
.get(this.url + "/Questionnaire/GetSuccessQuestionnaire/"+this.$route.query.id,{})
.then((res) => {
let result = res.data;
console.log(result)
if(result.code==0){
this.json = result.data;
} else{
this.$toast.fail(result.msg);
}
})
.catch((error) => {});
},
getUser(openid){
axios
.get(this.url + "/Wx/GetUserInfo?openId="+openid , {})
.then((res) => {
let result = res.data;
this.load = false;
if(result.code==0){
this.name = result.data.name;
this.getJson();
} else{
this.$toast.fail("权限不足，请联系管理员");
}
}).catch(error => {
});
},
},
};
</script>
<style lang="stylus" scoped></style>

447
src/views/repulsebay/question/renovationList.vue Normal file
View File

@ -0,0 +1,447 @@
<template lang="html">
<div class="product" >
<div
style="
width: 100%;
height: auto;
margin: auto;
display: flex;
margin-top: 20px;
margin-bottom: 20px;
"
>
<div style="display: flex; width: 60%; flex-wrap: wrap">
<search-view
ref="search"
:list="searchList"
:handleSearch="searchs"
></search-view>
</div>
<div style="flex: 1">
<el-button
style="float: right;"
type="primary"
icon="el-icon-plus"
@click="dialogFormVisible=true"
>添加装修队</el-button
>
</div>
</div>
<!-- 表格 -->
<div class="stu-table">
<el-table
:data="list"
v-loading="loading"
stripe
:header-cell-style="getRowClass"
style="width: 100%"
>
<el-table-column prop="name" align="center" label="名称" :min-width="flexWidth('name', list, '名称')">
</el-table-column>
<el-table-column prop="fjNum" align="center" label="装修房号" :min-width="flexWidth('fjNum', list, '装修房号')">
</el-table-column>
<el-table-column prop="personName" align="center" label="户主姓名" :min-width="flexWidth('personName', list, '户主姓名')">
</el-table-column>
<el-table-column prop="personPhone" align="center" label="户主手机号" :min-width="flexWidth('personPhone', list, '户主手机号')">
</el-table-column>
<el-table-column prop="startTime" align="center" label="装修开始时间" :min-width="flexWidth('startTime', list, '开始装修时间')">
</el-table-column>
<el-table-column prop="endTime" align="center" label="装修结束时间" :min-width="flexWidth('endTime', list, '装修结束时间')">
</el-table-column>
<el-table-column prop="renovationContacts" align="center" label="装修队联系人" :min-width="flexWidth('renovationContacts', list, '装修队联系人')">
</el-table-column>
<el-table-column prop="renovationContactsPhone" align="center" label="装修队联系方式" :min-width="flexWidth('renovationContactsPhone', list, '装修队联系方式')">
</el-table-column>
<el-table-column prop="renovationNum" align="center" label="装修队人数" :min-width="flexWidth('renovationNum', list, '装修队人数')">
</el-table-column>
<el-table-column prop="isFinish" align="center" label="是否完工" :min-width="flexWidth('isFinish', list, '是否完工')">
<template slot-scope="scope">
<el-tag type="success" v-if="scope.row.isFinish">已完工</el-tag>
<el-tag type="info" v-if="!scope.row.isFinish">未完工</el-tag>
</template>
</el-table-column>
<el-table-column align="center" label="操作" width="480" fixed="right" >
<template slot-scope="scope">
<el-button
size="mini"
type="danger"
icon="el-icon-minus"
@click.native.stop="deleteZx(scope.row.id)"
>删除</el-button
>
<el-button
size="mini"
type="primary"
plain
icon="el-icon-user-solid"
@click.native.stop="viewCy(scope.row.id)"
>查看成员</el-button
>
<el-button
size="mini"
type="warning"
plain
icon="el-icon-check"
v-if="!scope.row.isFinish"
@click.native.stop="updateWz(scope.row.id)"
>更新完工状态</el-button
>
<el-button
size="mini"
icon="el-icon-printer"
>预览打印</el-button
>
</template>
</el-table-column>
</el-table>
</div>
<el-dialog title="添加装修队" :visible.sync="dialogFormVisible" width="30%" :close-on-click-modal="false">
<el-form :model="form" :rules="rules" ref="ruleForm">
<el-form-item label="名称" prop="name">
<el-input v-model="form.name" placeholder="请输入名称" ></el-input>
</el-form-item>
<el-form-item label="装修房号" prop="fjNum">
<el-select v-model="form.fjNum" placeholder="请选择装修房号" style="width: 100%;" @change="fjChange">
<el-option :label="a.fj_num" :value="a.fj_num" v-for="a in fjList" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="业主" prop="peronId">
<el-select v-model="form.peronId" placeholder="请选择业主" style="width: 100%;">
<el-option :label="a.role+'-'+a.name" :value="a.id" v-for="a in personList" ></el-option>
</el-select>
</el-form-item>
<el-form-item label="装修开始日期" prop="startTime">
<el-date-picker
v-model="form.startTime"
style="width: 100%;"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择装修开始日期">
</el-date-picker>
</el-form-item>
<el-form-item label="装修结束日期" prop="endTime">
<el-date-picker
v-model="form.endTime"
style="width: 100%;"
value-format="yyyy-MM-dd"
type="date"
placeholder="选择装修结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="装修队联系人" prop="renovationContacts">
<el-input v-model="form.renovationContacts" placeholder="请输入装修队联系人" ></el-input>
</el-form-item>
<el-form-item label="装修队联系方式" prop="renovationContactsPhone">
<el-input type="number" v-model="form.renovationContactsPhone" placeholder="请输入装修队联系方式" ></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取 消</el-button>
<el-button type="primary" @click="submit">确 定</el-button>
</div>
</el-dialog>
<el-dialog :visible.sync="dialogTableVisible" fullscreen :close-on-click-modal="false">
<renovatio-person-list :zxid="zxid"></renovatio-person-list>
</el-dialog>
</div>
</template>
<script>
import axios from "axios";
import searchView from "../../../components/searchView/searchView.vue";
import renovationPersonList from "./componet/renovationPersonList.vue";
export default {
data() {
return {
list:[],
dialogFormVisible:false,
dialogTableVisible:false,
loading:false,
page:{
fjNum:"",
isFinish:"",
},
fjList:[],
personList:[],
zxPersonList:[],
zxid:"",
form:{
name:"",
fjNum:"",
peronId:"",
startTime:"",
endTime:"",
renovationContacts:"",
renovationContactsPhone:"",
},
searchList: [
{
placeholder: "请输入房号",
type: "input",
prop: "fjNum",
},
{
placeholder: "请选择完工状态",
type: "select",
prop: "isFinish",
options: [
{
name: "已完工",
value: true,
},
{
name: "未完工",
value: false,
},
{
name: "全部",
value: "",
},
],
},
],
rules: {
name: [
{ required: true, message: '请输入名称', trigger: 'blur' },
],
fjNum: [
{ required: true, message: '请输入房号', trigger: 'blur' }
],
peronId: [
{ required: true, message: '请选择业主', trigger: 'change' }
],
startTime: [
{ required: true, message: '请选择开始时间', trigger: 'change' }
],
endTime: [
{ required: true, message: '请选择结束时间', trigger: 'change' }
],
renovationContacts: [
{ required: true, message: '请输入联系人', trigger: 'blur' }
],
renovationContactsPhone: [
{ required: true, message: '请输入联系方式', trigger: 'blur' }
],
}
}
},
components: {
"search-view": searchView,
"renovatio-person-list": renovationPersonList,
},
activated() {
},
mounted() {
this.url = this.$store.state.url;
this.getInit();
},
methods: {
viewCy(id){
this.zxid = id;
this.dialogTableVisible = true;
},
updateWz(id){
axios
.put(this.url + "/Decoration/FinishDecorationTeam/"+id,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.$message.success("更新成功");
this.getInit();
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
deleteZx(id){
this.$confirm('此操作将永久删除该装修队, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
axios
.delete(this.url + "/Decoration/DeleteDecorationTeams/"+id,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.$message.success("删除成功");
this.getInit();
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
})
},
searchs(object) {
this.page = {
fjNum: object.fjNum,
isFinish: object.isFinish,
};
this.getInit();
},
getInit(){
axios
.get(this.url + "/Decoration/GetDecorationTeams",{params:this.page})
.then((res) => {
let result = res.data;
if(result.code==0){
this.list = result.data;
this.getFj();
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
getFj(){
axios
.get(this.url + "/Person/GetFjs",)
.then((res) => {
let result = res.data;
if(result.code==0){
this.fjList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
search(){
this.getPerons();
},
roleChange(){
this.getPerons();
},
fjChange(val){
this.getPerons(val)
},
getPerons(val){
axios
.get(this.url + "/Person/GetPersons",{params:{fjNum:val}})
.then((res) => {
let result = res.data;
if(result.code==0){
this.personList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
getZxPerons(){
axios
.get(this.url + "/Decoration/GetDecorationTeamPersons/"+this.zxid,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.personList = result.data;
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
},
handleSelectionChange(val){
this.personIdList = val.map(e => e.id);
},
getRowClass({ row, column, rowIndex, columnIndex }) {
if (rowIndex == 0) {
return "background:#fafafa ";
}
},
submit(){
this.$refs['ruleForm'].validate((valid) => {
if(valid){
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.form.renovationContactsPhone)) {
this.$message.error("请输入正确的手机号码");
return;
}
if(new Date(this.form.startTime).getTime()>new Date(this.form.endTime).getTime()){
this.$message.error("开始时间不得大于结束时间");
return;
}
axios
.post(this.url + "/Decoration/AddDecorationTeam",this.form)
.then((res) => {
let result = res.data;
if(result.code==0){
this.getInit();
this.dialogFormVisible =false;
this.$message.success('添加成功');
} else{
this.$message.error(result.msg);
}
})
.catch((error) => {});
}
})
},
},
};
</script>
<style scoped>
.product{
width: 96%;
height: auto;
margin: auto;
}
.el-form-item__content {
margin-left: 0;
}
.search {
line-height: 60px;
text-align: left;
margin: 20px 0;
}
.select-class {
line-height: 40px;
text-align: left;
margin-bottom: 20px;
}
.stu-table .btn {
width: 65px;
height: 25px;
padding: 0;
}
.pagination {
margin-top: 20px;
}
.el-table tr {
background: #081832;
color: #fff;
}
.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
background: rgb(36, 148, 215);
color: #fff;
}
.el-table__body tr.current-row > td.el-table__cell {
background: rgb(4, 75, 137);
color: #fff;
}
</style>

207
src/views/visitor/applyAddCar.vue Normal file
View File

@ -0,0 +1,207 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-loading="loading">
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">添加车辆</div>
<div style="height: 1.5rem;width:90%;margin: auto;display: flex;align-items: flex-end;font-size: 0.7rem;color: #b4b4b4;">
<van-icon name="warning-o" /> <span style="margin-left: 5px;">带*为必填项</span>
</div>
<div style="height: 2.5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 1.5rem;width:90%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">慈溪浅水湾-住宅-{{user.fjNum}}</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;">*</span> 车辆驾驶人员</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;" @click="selectPerson">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;width: 100%;" v-model="form.name" placeholder="请选择车辆驾驶人员" readonly>
</div>
</div>
</div>
<div style="height: 1rem;width:100%;"></div>
<div style="width: 90%;margin: auto;height: auto;font-family: '黑体';font-size: 0.8rem;color: orange;">
注：为方便园区管理，特对车辆停放紧急联系人做同步管理，请配合选择车辆平常驾驶员，方便我们紧急联系管理
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;">*</span>车牌号</div>
<div style="height: 2rem;width:100%;display: flex;" @click="keysShow">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.carNo" placeholder="请选择车牌">
</div>
</div>
</div>
<div style="height: 7rem;width:90%;margin: auto;display: flex;align-items: center;">
<van-button :color="color" @click="submit" style="width: 100%;">确认添加</van-button>
</div>
</div>
<van-picker title="" show-toolbar :columns="selectJson.columns"
:key="" @confirm="onConfirm" @cancel="onCancel" style="position: fixed; bottom: 0; width: 100%" v-if="show">
<template #option="option">
<div style="display: flex; flex-direction: column; align-items: center;">
<div>{{ option.role }} - {{ option.name }}</div>
</div>
</template>
</van-picker>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
</div>
</template>
<script>
import axios from "axios";
import Keyboards from '../../components/keyboards/keyboards.vue'
import Vant2Select from '../../components/vant2Select/vant2Select.vue'
export default {
data() {
return {
selectJson: { prop: "type", title: "", columns: [] },
fileList:[],
loading:false,
popShow:false,
show:false,
selectShow:false,
color:"#00c76c",
url:"",
user:{},
active:"",
form:{
carNo:"",
otherPersonId:"",
name:"",
},
reasonObj:{},
openid:"",
showlist:[
{
}
]
};
},
components:{Vant2Select,Keyboards},
activated() {
},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:1,name:"王德法",telphone:'18058587597',unit:'',fjNum:'101'}))
this.url = this.$store.state.url;
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
this.getInit();
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
selectPerson(){
this.show = true;
},
onCancel(){
this.show = false;
},
getInit(){
this.loading = true;
axios
.get(this.url + "/Person/GetPersons/"+this.user.fjNum, {})
.then((res) => {
this.loading = false;
let result = res.data;
if (result.code == 0) {
this.selectJson.columns = result.data;
} else {
this.$toast.fail(result.msg);
}
});
},
selectRole(){
this.$refs.vantSelect.show = true;
},
onConfirm(val, prop) {
this.show = false;
this.form.otherPersonId = val.id;
this.form.name = val.name;
},
deleteAfter(){
this.form.facePhoto = null;
},
afterRead(file){
this.form.facePhoto = file.file;
},
handlyChange(value){
this.selectShow = false;
this.reasonObj = value;
this.form.reason = this.reasonObj.name;
},
replacePhoneNumber(phone) {
return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
},
startClick(){
this.selectJson = this.lfTimeJson;
this.$refs.vant2DatetimePicker.show = true;
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
this.$router.push("/applyCar");
},
submitBack(val){
this.popShow = false;
this.form.carNo = val;
},
keysShow(){
this.popShow = true
},
submit(){
if(!this.form.name || !this.form.carNo ){
this.$toast.fail("必填项不能为空");
return
}
axios
.post(this.url + "/Person/AddOtherCar/"+this.user.id, this.form)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success("添加成功");
this.$router.push("/applyCar");
} else {
this.$toast.fail(result.msg);
}
});
}
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
</style>

232
src/views/visitor/applyAddFamily.vue Normal file
View File

@ -0,0 +1,232 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-if="active">
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">{{active==0?'添加家庭成员':'添加其他成员'}}</div>
<div style="height: 1.5rem;width:90%;margin: auto;display: flex;align-items: flex-end;font-size: 0.8rem;color: orange;">
<van-icon name="warning-o" /> <span style="margin-left: 5px;">带*为必填项</span>
</div>
<div style="height: 2.5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 1.5rem;width:90%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">慈溪浅水湾-住宅-{{user.fjNum}}</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;">*</span>成员姓名</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.name" placeholder="请输入成员姓名">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;">*</span>成员手机号</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.phoneNum" placeholder="请输入成员手机号码">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;" v-if="active==1">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;" v-if="active==1">*</span>成员角色</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #000;align-items: center;" @click="selectRole">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.role" placeholder="请选择成员角色" readonly>
</div>
</div>
</div>
<div style="height: auto;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;"><span style="color: red;" v-if="active==1">*</span>上传人像照片</div>
<div style="height: auto;width:100%;display: flex;">
<van-uploader v-model="fileList" :after-read="afterRead" @delete="deleteAfter">
<template #preview-cover="{ file }">
<!-- <div class="preview-cover van-ellipsis">{{ file.name }}</div> -->
</template>
</van-uploader>
<!-- <van-uploader :after-read="afterRead" /> -->
</div>
</div>
<div style="height: 1rem;width:100%;"></div>
<div style="width: 90%;margin: auto;height: auto;font-family: '黑体';font-size: 0.8rem;color: orange;">
注：此照片用于开通小区人脸门禁权限，请使用近期人像照片
<br>
(为方便小区管理，其他家庭成员需上传人像照片，感谢您的配合)
</div>
<div style="height: 7rem;width:90%;margin: auto;display: flex;align-items: center;">
<van-button :color="color" @click="submit" style="width: 100%;">确认添加</van-button>
</div>
</div>
<vant2-select
:selectJson="selectJson"
:confirm="onConfirm"
ref="vantSelect"
></vant2-select>
</div>
</template>
<script>
import axios from "axios";
import Vant2Select from '../../components/vant2Select/vant2Select.vue'
export default {
data() {
return {
selectJson: { prop: "role", title: "", columns: ["司机", "保姆"] },
fileList:[],
loading:false,
popShow:false,
selectShow:false,
color:"#00c76c",
lfTimeJson: { prop: "visitTime", title: "到访时间" },
url:"",
user:{},
active:"",
form:{
role:"",
name:"",
phoneNum:"",
fjNum:"",
facePhoto:null,
},
reasonObj:{},
openid:"",
showlist:[
{
}
]
};
},
components:{Vant2Select},
activated() {
},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:1,name:"王德法",telphone:'18058587597',unit:'',fjNum:'101'}))
this.url = this.$store.state.url;
if(this.$route.query.active){
this.active = this.$route.query.active;
}
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
selectRole(){
this.$refs.vantSelect.show = true;
},
onConfirm(val, prop) {
this.form[prop] = val;
},
deleteAfter(){
this.form.facePhoto = null;
},
afterRead(file){
this.form.facePhoto = file.file;
},
handlyChange(value){
this.selectShow = false;
this.reasonObj = value;
this.form.reason = this.reasonObj.name;
},
replacePhoneNumber(phone) {
return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
},
startClick(){
this.selectJson = this.lfTimeJson;
this.$refs.vant2DatetimePicker.show = true;
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
this.$router.push("/applyFamily");
},
submitBack(val){
this.popShow = false;
this.form.licensePlate = val;
},
keysShow(){
this.popShow = true
},
submit(){
if(!this.form.name || !this.form.phoneNum ){
this.$toast.fail("必填项不能为空");
return
}
if(this.active==1){
if (!this.form.role|| !this.form.facePhoto){
this.$toast.fail("必填项不能为空");
return
}
}
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.form.phoneNum)) {
this.$toast.fail("请输入正确的手机号码");
return;
}
const formData = new FormData();
formData.append('name', this.form.name);
formData.append('phoneNum', this.form.phoneNum);
formData.append('fjNum', this.user.fjNum);
formData.append('facePhoto', this.form.facePhoto);
if(this.active==0){
axios
.post(this.url + "/Person/AddFamilyPerson/"+this.user.id, formData)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success("添加成功");
this.$router.push("/applyFamily");
} else {
this.$toast.fail(result.msg);
}
});
}
if(this.active==1){
formData.append('role', this.form.role);
axios
.post(this.url + "/Person/AddOtherPerson/"+this.user.id, formData)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success("添加成功");
this.$router.push("/applyFamily");
} else {
this.$toast.fail(result.msg);
}
});
}
}
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
</style>

120
src/views/visitor/applyApprovalCar.vue Normal file
View File

@ -0,0 +1,120 @@
<template lang="html">
<div v-if="id">
<div style="width: 100%;height: 100vh;margin: auto;">
<el-card class="box-card" :body-style="cardStyle" style="height: 100%;">
<el-descriptions
class="margin-top"
title="业主车辆申请"
:column="1"
:size="size"
border
>
<template slot="extra">
<!-- <el-button type="primary" size="small">操作</el-button> -->
</template>
<el-descriptions-item label="业主姓名">{{json.name}}</el-descriptions-item>
<el-descriptions-item label="房号">{{json.fjNum}}</el-descriptions-item>
<el-descriptions-item label="手机号">{{json.phone}}</el-descriptions-item>
<el-descriptions-item label="车牌号">{{json.carNo}}</el-descriptions-item>
<el-descriptions-item label="角色" ><el-tag size="small" >{{json.role}}</el-tag></el-descriptions-item>
<el-descriptions-item label="审批意见">
<el-input type="textarea" v-model="desc"></el-input>
</el-descriptions-item>
</el-descriptions>
<div style="width: 100%;height:5rem;"></div>
<!-- <div style="width: 100%;height:4rem;">
<div style="width:70%;height:100%;display:flex;justify-content: space-between;margin: auto;align-items: center;">
<el-button type="primary" style="height: 3rem;width: 35%;">同意</el-button>
<el-button type="warning" style="height: 3rem;width: 35%;">拒绝</el-button>
</div>
</div> -->
</el-card>
</div>
<div style="width:100%;height:3rem;position: fixed;bottom: 0;display: flex;" >
<div style="width:50%;height:100%;background: linear-gradient(to right, #44c5fe, #1292fe);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="postResult('接受')">同意添加</div>
<div style="width:50%;height:100%;background: linear-gradient(to right, #fdad35, #e6a23c);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="postResult('拒绝')">拒绝添加</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
size: "medium",
cardStyle:{'padding': '20px','height':'100%'},
lableStyle:{'line-height:': '80px'},
url:"",
id:"",
desc:"",
json:{},
};
},
activated() {
},
mounted() { this.url = this.$store.state.url;this.getInit();},
methods: {
getInit(){
this.id = this.$store.state.id;
if(this.$route.query.id){
this.id = this.$route.query.id;
this.getInfo();
} else{
this.$toast.fail("暂无信息");
}
},
getInfo(){
axios
.get(this.url + "/Person/GetCar/"+this.id,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.json = result.data;
} else{
this.$toast.fail(result.msg);
}
})
.catch((error) => {});
},
postResult(val){
let obj = {};
if(!this.id){
this.$toast.fail("暂无信息");
return
}
if(val=='接受'){
obj.result = true;
}
if(val=='拒绝'){
obj.result = false;
}
obj.remark = this.desc;
axios
.post(this.url + "/Property/ApprovalCar/"+this.id,null,{params:obj})
.then((res) => {
let result = res.data;
if(result.code==0){
this.$router.push("/success?content=审批");
} else{
this.$toast.fail(result.msg);
}
})
.catch((error) => {});
},
},
};
</script>
<style>
.my-label{
line-height: 80px;
}
</style>

161
src/views/visitor/applyCar.vue Normal file
View File

@ -0,0 +1,161 @@
<template lang="html">
<div>
<div style="width: 100%; height: auto; margin: auto; min-height: 100vh">
<van-nav-bar title="" left-arrow @click-left="onClickLeft" />
<div
style="
height: 4rem;
width: 90%;
margin: auto;
font-size: 2.2rem;
color: #000;
display: flex;
align-items: center;
font-weight: bold;
font-family: '黑体';
"
>
车辆管理
</div>
<div style="height: 1.5rem;width:90%;margin: auto;display: flex;align-items: flex-end;font-size: 0.7rem;color: #b4b4b4;">
<van-icon name="warning-o" /> <span style="margin-left: 5px;">左滑可删除车辆</span>
</div>
<div style="margin: auto; width: 100%; height: auto">
<van-swipe-cell v-for="(item,index) in list" :key="index">
<div style="width:90%;margin: auto;height: 5em;border-bottom: 0.7px solid #f0f0f0;" >
<div style="width:100%;height:1rem"></div>
<div style="width:100%;height:3rem;display: flex;">
<div style="width: 50%;height: 100%;">
<div style="width: 100%;height:50%;display: flex;align-items: center;justify-content: start;color: #000;font-size: 0.9rem;font-family: '黑体';">
<img src="../../../static/img/car.png" alt="" />
<span class="custom-title">{{item.type}}</span>
</div>
<div style="width: 100%;height:50%;display: flex;align-items: center;justify-content: start;color: #4c4c4c;font-size: 0.9rem;font-family: '黑体';">
<span style="margin-left:0rem">驾驶人：{{item.driverName}}</span>
</div>
</div>
<div style="width: 50%;height: 100%;display: flex;align-items: center;color: #4c4c4c;font-size: 1rem;font-family: '黑体';justify-content: end;">
<span class="custom-title">{{item.carNo}}</span>
</div>
</div>
</div>
<template #right>
<van-button square text="删除" type="danger" class="delete-button" @click="deleteCar(item.carNo)" />
</template>
</van-swipe-cell>
</div>
<div style="width: 100%;height: 18rem;display: flex;align-items: center;justify-content: center;" v-if="list.length==0">
<van-empty description="无车辆记录" />
</div>
<div style="height: 2rem;width:100%;"></div>
<div style="margin: auto; width: 90%; height: auto">
<van-button type="primary" style="width: 100%;" @click="$router.push('/applyAddCar')">添加车辆</van-button>
</div>
</div>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
<van-dialog v-model="doalogshow" title="绑定车牌" show-cancel-button @confirm="evaluateConfirm">
<div style="width: 80%;height:auto;margin: auto;" @click="popShow = true">
<el-input
type="text"
placeholder="请输入车牌"
readonly
v-model="evaluateValue">
</el-input>
</div>
</van-dialog>
</div>
</template>
<script>
import axios from "axios";
import Keyboards from '../../components/keyboards/keyboards.vue'
export default {
data() {
return {
url:"",
user:{},
list:[],
evaluateValue:"",
popShow:false,
doalogshow:false,
};
},
components:{Keyboards},
activated() {},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:6,name:"王德法",telphone:18058587597,unit:"",fjNum:"101",facePhoto:""}));
this.url = this.$store.state.url;
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
this.getInit();
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
deleteCar(carNo){
axios
.delete(this.url + "/Person/DeleteCar/"+this.user.id, {params:{carNo:carNo}})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success('删除成功');
this.getInit();
} else {
this.$toast.fail(result.msg);
}
});
},
submitBack(val){
this.popShow = false;
this.evaluateValue = val;
},
evaluateConfirm(){
if(!this.evaluateValue){
this.$toast.fail("必须填不能为空");
return
}
axios
.post(this.url + "/Person/AddCar", {personId:this.user.id,carNo:this.evaluateValue})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success('添加成功');
this.getInit();
} else {
this.$toast.fail(result.msg);
}
});
},
getInit() {
axios.get(this.url + "/Person/GetCars/"+this.user.id, {}).then((res) => {
let result = res.data;
if (result.code == 0) {
this.list = result.data;
} else {
this.$toast.fail(result.msg);
}
});
},
onClickLeft() {
// history.go(-1)
this.$router.push("/personalCenter");
},
},
};
</script>
<style>
.van-step__circle-container {
background-color: #f2f3f5 !important;
}
</style>
<style scoped>
.van-button--square {
height: 100%;
}
</style>

177
src/views/visitor/applyFamily.vue Normal file
View File

@ -0,0 +1,177 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh;background: #f5f5f5;" v-loading="loading">
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="background-color: #fff;">
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">成员管理</div>
<div style="height: 2.72rem;width:90%;margin: auto;display: flex;justify-content: start;border-bottom: 0.7px solid #f0f0f0">
<div style="width: 40%;height: 100%;">
<van-tabs v-model="active" :color="color" :title-active-color="color" line-width="20px" @change="tabChange">
<van-tab title="家庭成员"></van-tab>
<van-tab title="其他成员"></van-tab>
</van-tabs>
</div>
</div>
</div>
<div style="width: 100%;height:auto;">
<!-- <div style="height: 1.5rem;width:90%;margin: auto;display: flex;align-items: flex-end;font-size: 0.7rem;color: #b4b4b4;">
<van-icon name="warning-o" /> <span style="margin-left: 5px;">左滑可删除成员</span>
</div> -->
<div style="width:100%;height:1rem"></div>
<div v-for="(item,index) in list" :key="index">
<div style="width:90%;margin: auto;height: 6rem;border-bottom: 0.7px solid #f0f0f0;background-color: #fff;border-radius: 1rem;">
<div style="width:100%;height:1rem"></div>
<div style="width:100%;height:4rem;">
<div style="width: 100%;height: 100%;display: flex;">
<div style="width: 3.5rem;height:100%;position: relative;margin-left: 1rem;display: flex;justify-content: center;flex-wrap: wrap;">
<img :src="item.facePhoto" style="height:3.5rem;width:100%;border-radius: 1.75rem;" alt="" v-if="item.facePhoto">
<div style="height:3.5rem;width:100%;border-radius: 1.75rem;background-color: #b4b4b4;display: flex;justify-content: center;align-items: center;" v-if="!item.facePhoto">
<van-icon name="friends-o" size="1.8rem" />
</div>
<!-- <van-tag type="warning" style="margin-top: -1rem;" v-if="active==0">业主</van-tag> -->
<van-tag type="warning" style="margin-top: -1rem;" v-if="item.role=='户主'">{{item.role}}</van-tag>
<van-tag type="success" style="margin-top: -1rem;" v-else-if="item.role=='业主'">{{item.role}}</van-tag>
<van-tag type="primary" style="margin-top: -1rem;" v-else >{{item.role}}</van-tag>
</div>
<div style="width: 35%;height: 100%;margin-left: 1rem;">
<div style="width: 100%;height:50%;display: flex;font-size: 1rem;line-height: 2.2rem;font-weight: bold;font-family: '黑体';">{{item.name}}</div>
<div style="width: 100%;height:50%;display: flex;color: #b0b0b0;font-size: 0.9rem;line-height: 1rem;">{{item.phone}}</div>
</div>
<div style="width: auto;flex: 1;height: 100%;display: flex;justify-content: flex-end;align-items: center;">
<van-tag plain type="danger" style="margin-right: 1rem;" size="medium" @click="deleteCy(item.id)" v-if="user.id!=item.id && user.role=='户主'">删除成员</van-tag>
</div>
</div>
</div>
<div style="width:100%;height:1rem"></div>
</div>
<div style="width:100%;height:1rem"></div>
</div>
<div style="width: 100%;height: 18rem;display: flex;align-items: center;justify-content: center;" v-if="list.length==0">
<van-empty description="无成员记录" />
</div>
<div style="height: 2rem;width:100%;"></div>
<div style="margin: auto; width: 90%; height: auto">
<van-button type="primary" style="width: 100%;" @click="$router.push('/applyAddFamily?active='+active)">添加成员</van-button>
</div>
<div style="width:100%;height:1rem"></div>
</div>
</div>
</div>
</template>
<script>
import { Dialog } from "vant";
import axios from "axios";
export default {
data() {
return {
active:0,
loading:false,
popShow:false,
selectJson:{},
color:"#00c76c",
lfTimeJson: { prop: "lftime", title: "到访时间" },
url:"",
list:[],
user:{},
openid:"",
showlist:[
{
}
]
};
},
components:{},
activated() {
},
mounted() {
this.url = this.$store.state.url;
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
this.getInit();
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
deleteCy(id){
Dialog.confirm({
title: '删除成员',
message: '确认删除成员吗？',
})
.then(() => {
axios
.delete(this.url + "/Person/DeleteOtherPerson/"+this.user.id+'/'+id, {})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$toast.success('删除成功');
this.getInit();
} else {
this.$toast.fail(result.msg);
}
});
})
},
getInit(){
this.loading = true;
axios
.get(this.url + "/Person/GetPersons/"+this.user.fjNum, {params:{type:this.active==0?'业主':'非业主'}})
.then((res) => {
this.loading = false;
let result = res.data;
if (result.code == 0) {
this.list = result.data;
} else {
this.$toast.fail(result.msg);
}
});
},
onClickLeft(){
// history.go(-1)
this.$router.push("/personalCenter");
},
onClickRight(){
},
tabChange(val){
this.list = [];
this.getInit();
},
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
.van-button--square {
height: 100%;
}
</style>

137
src/views/visitor/applyQrcode.vue Normal file
View File

@ -0,0 +1,137 @@
<template lang="html">
<div >
<div v-show="code" >
<van-nav-bar
title=""
left-arrow
v-if="!$route.query.outState"
@click-left="onClickLeft"
/>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 100%;height:3rem;display: flex;justify-content: center;align-items: center;color: #000;font-family: '黑体';">浅水湾访客通行证</div>
<div style="width: 100%;height:2rem;display: flex;justify-content: center;align-items: flex-start;color: #bfbfbf;font-family: '黑体';font-size: 0.7rem;">-慈溪浅水湾-</div>
<div style="width: 90%;height: auto;border-radius: 10px;margin: auto;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); " ref="imageArea">
<div style="width: 100%;height: 3rem;border-bottom: 0.7px solid #f0f0f0;display: flex;align-items: center;font-family: '黑体';font-size: 0.9rem;color:#454545 ;">
<span style="margin-left:10px"> 尊敬的 {{name.substring(0,1)}}{{sex}}</span>
</div>
<div style="width: 100%;height: auto;">
<div style="width: 100%;height: 4rem;display: flex;align-items: center;font-family: '黑体';font-size: 1rem;color:#454545;justify-content: center;">
{{code}}
</div>
<div style="width: 100%;height: 15rem;display: flex;align-items: center;justify-content: center;border-bottom: 0.7px solid #f0f0f0;">
<div id="qrCode" ref="qrCodeDiv"></div>
</div>
<div style="width: 100%;height: 4rem;margin-left: 10px;">
<div style="width: 100%;height: 50%;display: flex;color: #444444;font-size: 0.7rem;font-family: '黑体';line-height: 3rem;">
有效时间：{{visitTime}}
</div>
<div style="width: 100%;height: 50%;display: flex;color: #444444;font-size: 0.7rem;font-family: '黑体';line-height: 1.5rem;">
进入小区时，请出示此通行证给门岗
</div>
</div>
</div>
</div>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 90%;height:2rem;margin: auto" v-if="!$route.query.outState">
<van-button type="primary" style="width:100% ;" @click="generateImage">保存邀请码到本地</van-button>
</div>
</div>
</div>
</template>
<script>
import QRCode from "qrcodejs2";
import html2canvas from 'html2canvas';
export default {
data() {
return {
code: "",
codeShow: false,
codeList:[],
visitTime:"",
name:"",
sex:"",
};
},
created() {},
mounted() {
if (this.$route.query.code) {
this.code = this.$route.query.code;
this.visitTime = this.$route.query.visitTime;
this.name = this.$route.query.name;
this.sex = this.$route.query.sex;
this.bindQRCode();
} else{
this.$toast.fail("无通行证信息");
}
},
methods: {
generateImage() {
console.log(111)
const element = this.$refs.imageArea;
html2canvas(element, {
useCORS: true // 添加这个选项以解决跨域问题
}).then((canvas) => {
const link = document.createElement('a');
link.href = canvas.toDataURL('image/png');
localStorage.setItem("qrcode",link.href);
this.$router.push("/qrcode");;
});
},
confrim(){
},
onClickLeft(){
this.$router.push("/applylog");
},
bindQRCode: function () {
console.log(this.$refs.qrCodeDiv)
new QRCode(this.$refs.qrCodeDiv, {
text: this.code,
width: 200,
height: 200,
colorDark: "#333333", //二维码颜色
colorLight: "#ffffff", //二维码背景色
correctLevel: QRCode.CorrectLevel.L//容错率，L/M/H
})
}
},
};
</script>
<style scoped>
p {
text-align: center;
color: #474747;
}
.text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
.e_text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1.2rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
</style>

257
src/views/visitor/applySelf.vue Normal file
View File

@ -0,0 +1,257 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-if="!selectShow && openid">
<van-notice-bar mode="closeable">访客进入申请页，填写您的信息，确保无误。申请后，您将畅通无阻访问您的好友</van-notice-bar>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">访客申请</div>
<!-- <div style="height: 1;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
</div> -->
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">业主手机号</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;width: 100%;" v-model="form.yzPhone" placeholder="请输入业主手机号以确认被访人">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客姓名</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.name" placeholder="请输入访客姓名">
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;">
<el-radio-group v-model="form.sex" size="mini" text-color="#fff" :fill="color">
<el-radio-button label="先生"></el-radio-button>
<el-radio-button label="女士"></el-radio-button>
</el-radio-group>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客手机号</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="number" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.phone" placeholder="请输入访客手机号">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客身份证</div>
<div style="height: 2rem;width:100%;display: flex;">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.iDCard" placeholder="请输入访客身份证">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">来访事由</div>
<div style="height: 2rem;width:100%;display: flex;" @click="selectShow = true">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" v-model="form.reason" readonly placeholder="请输入来访事由">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">到访时间</div>
<div style="height: 2rem;width:100%;display: flex;" @click="startClick">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.visitTime" placeholder="请选择到访时间">
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 4rem;width:100%;display: flex;">
<div style="width: 60%;height: 100%;font-size: 1rem;color: #393939;align-items: center;display: flex;">
是否驾车
</div>
<div style="width: 40%;height: 100%;display: flex;justify-content: end;align-items: center;">
<el-switch v-model="form.isCar" :active-color="color"></el-switch>
</div>
</div>
</div>
<div style="height: 5rem;width:90%;margin: auto;border-bottom: 0.7px solid #f0f0f0;" v-if="form.isCar">
<div style="height: 1rem;width:100%;"></div>
<div style="height: 2rem;width:100%;display: flex;align-items: center;font-size: 0.8rem;color: #393939;">访客车牌号</div>
<div style="height: 2rem;width:100%;display: flex;" @click="keysShow">
<div style="width: 100%;height: 100%;font-size: 1rem;color: #000;align-items: center;">
<input type="text" style="border: 0;background-color: #fff;display: flex;align-items: center;height: 100%;" readonly v-model="form.licensePlate" placeholder="请选择车牌">
</div>
</div>
</div>
<div style="height: 7rem;width:90%;margin: auto;display: flex;align-items: center;">
<van-button :color="color" @click="submit" style="width: 100%;">提交申请</van-button>
</div>
</div>
<van-popup v-model="popShow" round position="bottom" :style="{ height: '80%' }">
<Keyboards :submitBack="submitBack"></Keyboards>
</van-popup>
<apply-select :handlyChange="handlyChange" v-if="selectShow"></apply-select>
<vant2-datetime-picker ref="vant2DatetimePicker" :selectJson="selectJson" :confirm="confirm"></vant2-datetime-picker>
</div>
</template>
<script>
import axios from "axios";
import Keyboards from '../../components/keyboards/keyboards.vue'
import ApplySelect from '../../components/applySelect/applySelect.vue'
import Vant2DatetimePicker from '../../components/vant2DatetimePicker/vant2DatetimePicker.vue'
import Vant2Select from '../../components/vant2Select/vant2Select.vue'
export default {
data() {
return {
loading:false,
popShow:false,
selectShow:false,
selectJson:{},
color:"#00c76c",
lfTimeJson: { prop: "visitTime", title: "到访时间" },
url:"",
user:{},
form:{
yzPhone:"",
name:"",
sex:"先生",
reason:"",
visitTime:"",
phone:"",
iDCard:"",
isCar:false,
licensePlate:"",
respondentsId:"",
visitorMode:3,
openId:"",
},
reasonObj:{},
openid:"",
showlist:[
{
}
]
};
},
components:{Keyboards,Vant2DatetimePicker,Vant2Select,ApplySelect},
activated() {
},
mounted() {
// localStorage.setItem("userInfo",JSON.stringify({id:1,name:"王德法",telphone:'18058587597',unit:'',fjNum:'101'}))
this.url = this.$store.state.url;
if(localStorage.getItem("openid")){
this.openid = localStorage.getItem("openid");
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
handlyChange(value){
this.selectShow = false;
this.reasonObj = value;
this.form.reason = this.reasonObj.name;
},
replacePhoneNumber(phone) {
return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
},
startClick(){
this.selectJson = this.lfTimeJson;
this.$refs.vant2DatetimePicker.show = true;
},
confirm(val, prop) {
this.form[prop] = val;
},
onClickLeft(){
this.$router.push("/personalCenter");
},
onClickRight(){
this.$router.push("/applylog");
},
submitBack(val){
this.popShow = false;
this.form.licensePlate = val;
},
keysShow(){
this.popShow = true
},
submit(){
if(!this.form.name || !this.form.reason || !this.form.visitTime|| !this.form.phone|| !this.form.iDCard|| !this.form.yzPhone){
this.$toast.fail("必填项不能为空");
return
}
if(this.form.isCar){
if (!this.form.licensePlate){
this.$toast.fail("必填项不能为空");
return
}
}
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.form.phone) || !reg.test(this.form.yzPhone)) {
this.$toast.fail("请输入正确的手机号码");
return;
}
const regCard = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if (!regCard.test(this.form.iDCard)) {
this.$toast.fail("请输入正确的身份证号码");
return;
}
axios
.get(this.url + "/Person/GetPerson/"+this.form.yzPhone, {})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.form.reason = this.reasonObj.value;
this.form.respondentsId = result.data.id;
this.form.openId = this.openid;
axios
.post(this.url + "/Visitor/AddVisitor", this.form)
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.$router.push("/success?content=申请");
// this.$router.push("/success?content=邀请&button=查看访客记录&url=/applylog");
} else {
this.$toast.fail(result.msg);
}
});
} else {
this.$toast.fail(result.msg);
}
});
}
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style scoped>
</style>

40
src/views/visitor/applyfor.vue Normal file
View File

@ -0,0 +1,40 @@
<template lang="html">
<div>
<applyfor-jf></applyfor-jf>
</div>
</template>
<script>
import axios from "axios";
import ApplyforJf from '../../components/applyfor/applyforJf.vue'
export default {
data() {
return {
};
},
components:{ApplyforJf},
activated() {
},
mounted() {},
methods: {
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style lang="stylus" scoped>
.van-steps{
background-color: #f2f3f5;
}
</style>

130
src/views/visitor/applyforQrcode.vue Normal file
View File

@ -0,0 +1,130 @@
<template lang="html">
<div >
<div >
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 100%;height:3rem;display: flex;justify-content: center;align-items: center;color: #000;font-family: '黑体';">浅水湾访客申请码</div>
<div style="width: 100%;height:2rem;display: flex;justify-content: center;align-items: flex-start;color: #bfbfbf;font-family: '黑体';font-size: 0.7rem;">-慈溪浅水湾-</div>
<div style="width: 90%;height: auto;border-radius: 10px;margin: auto;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); " ref="imageArea">
<div style="width: 100%;height: auto;">
<div style="width: 100%;height: 15rem;display: flex;align-items: center;justify-content: center;border-bottom: 0.7px solid #f0f0f0;">
<div id="qrCode" ref="qrCodeDiv"></div>
</div>
<div style="width: 100%;height: 2rem;margin-left: 10px;">
<div style="width: 100%;height: 100%;display: flex;color: #444444;font-size: 0.7rem;font-family: '黑体';line-height: 1.5rem;">
将该申请码分享给好友，好友扫码进入申请页面填写来访信息
</div>
</div>
</div>
</div>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 90%;height:2rem;margin: auto" >
<van-button type="primary" style="width:100% ;" @click="generateImage">保存申请码到本地</van-button>
</div>
</div>
</div>
</template>
<script>
import QRCode from "qrcodejs2";
import html2canvas from 'html2canvas';
export default {
data() {
return {
code: "",
codeShow: false,
codeList:[],
id:"",
fjNum:"",
};
},
created() {},
mounted() {
if (this.$route.query.id) {
this.id = this.$route.query.id;
this.fjNum = this.$route.query.fjNum;
this.code = "http://dazhao.site:8031/#/applyfor?id="+ this.id+"&fjNum="+this.fjNum;
this.bindQRCode();
} else{
this.$toast.fail("无业主信息");
}
},
methods: {
generateImage() {
const element = this.$refs.imageArea;
html2canvas(element, {
useCORS: true // 添加这个选项以解决跨域问题
}).then((canvas) => {
const link = document.createElement('a');
link.href = canvas.toDataURL('image/png');
localStorage.setItem("qrcode",link.href);
this.$router.push("/qrcode");
// this.openImage(link.href);
// window.open(link.href,"_blank");
// link.download = '访客申请码.png';
// link.click();
});
},
confrim(){
},
onClickLeft(){
this.$router.push("/personalCenter");
},
bindQRCode: function () {
console.log(this.$refs.qrCodeDiv)
new QRCode(this.$refs.qrCodeDiv, {
text: this.code,
width: 200,
height: 200,
colorDark: "#333333", //二维码颜色
colorLight: "#ffffff", //二维码背景色
correctLevel: QRCode.CorrectLevel.L//容错率，L/M/H
})
}
},
};
</script>
<style scoped>
p {
text-align: center;
color: #474747;
}
.text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
.e_text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1.2rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
</style>

207
src/views/visitor/applylog.vue Normal file
View File

@ -0,0 +1,207 @@
<template lang="html">
<div>
<div style="width: 100%;height: auto;margin: auto;min-height: 100vh" v-loading="loading">
<van-nav-bar
title=""
left-arrow
@click-left="onClickLeft"
/>
<div style="height: 4rem;width:90%;margin: auto;font-size: 2.2rem;color: #000;display: flex;align-items: center;font-weight: bold;font-family: '黑体';">访客记录</div>
<div style="height: 2.72rem;width:90%;margin: auto;display: flex;justify-content: start;border-bottom: 0.7px solid #f0f0f0;">
<div style="width: 60%;height: 100%;">
<van-tabs v-model="active" :color="color" :title-active-color="color" line-width="20px" @change="tabChange">
<van-tab title="未到访客"></van-tab>
<van-tab title="已到访客"></van-tab>
<van-tab title="离开访客"></van-tab>
</van-tabs>
</div>
</div>
<div style="height: 1.5rem;width:90%;margin: auto;display: flex;align-items: flex-end;font-size: 0.7rem;color: #b4b4b4;">
<van-icon name="warning-o" /> <span style="margin-left: 5px;">过期访客左滑可删除记录</span>
</div>
<van-swipe-cell v-for="(item,index) in list" :key="index">
<div style="width:90%;margin: auto;height: 5rem;border-bottom: 0.7px solid #f0f0f0;" @click="viewQrcode(item.cardNo,item.visitTime,item.name,item.sex)">
<div style="width:100%;height:1rem"></div>
<div style="width:100%;height:3rem;display: flex;">
<div style="width: 50%;height: 100%;">
<div style="width: 100%;height:50%;display: flex;align-items: center;justify-content: start;color: #000;font-size: 0.9rem;font-family: '黑体';">{{item.name}}</div>
<div style="width: 100%;height:50%;font-size: 0.9rem;font-family: '黑体';color: #bfbfbf;display: flex;align-items: center;">{{item.visitTime}}</div>
</div>
<div style="width: 50%;height: 100%;display: flex;align-items: center;color: #4c4c4c;font-size: 1rem;font-family: '黑体';justify-content: end;" v-if="active!=2">
<img src="../../../static/img/qrcode.png" style="width: 15px;height: 15px;" alt="">
<span style="margin-left: 5px;">查看通行证</span>
<van-icon style="margin-left: 10px;" name="arrow" />
</div>
<div style="width: 50%;height: 100%;display: flex;align-items: center;color: #4c4c4c;font-size: 1rem;font-family: '黑体';justify-content: end;" v-if="active==2">
<van-button plain type="primary" size="mini" @click.stop="inviteAgain(item.id,item.cardNo,item.visitTime,item.name,item.sex)">再次邀约</van-button>
</div>
</div>
<div style="width:100%;height:1rem"></div>
</div>
<template #right>
<van-button square text="删除" type="danger" class="delete-button" @click="deletefklog(item.id)" />
</template>
</van-swipe-cell>
<div style="width: 100%;height: 18rem;display: flex;align-items: center;justify-content: center;" v-if="list.length==0">
<van-empty description="无访客记录" />
</div>
<div style="width:100%;height:1rem"></div>
</div>
<van-dialog v-model="dialogshow" title="访客邀约" show-cancel-button @confirm="evaluateConfirm" :overlay="false">
<div style="width: 80%;height:auto;margin: auto;" @click="timeClick">
<el-input
type="text"
placeholder="请选择到访时间"
readonly
v-model="evaluateValue">
</el-input>
</div>
</van-dialog>
<vant2-datetime-picker ref="vant2DatetimePicker" :selectJson="selectJson" :confirm="confirm"></vant2-datetime-picker>
</div>
</template>
<script>
import axios from "axios";
import Vant2DatetimePicker from '../../components/vant2DatetimePicker/vant2DatetimePicker.vue'
export default {
data() {
return {
evaluateValue:"",
dialogshow:false,
active:0,
loading:false,
popShow:false,
selectJson:{},
color:"#00c76c",
selectJson: { prop: "evaluateValue", title: "到访时间" },
url:"",
list:[],
user:{},
openid:"",
againJson:{},
showlist:[
{
}
]
};
},
components:{Vant2DatetimePicker},
activated() {
},
mounted() {
this.url = this.$store.state.url;
if(localStorage.getItem("userInfo")){
this.user = JSON.parse(localStorage.getItem("userInfo"));
this.getInit();
} else{
this.$toast.fail("暂无人员信息");
}
},
methods: {
timeClick(){
this.$refs.vant2DatetimePicker.show = true;
},
evaluateConfirm(){
if(!this.evaluateValue){
this.$toast.fail("请选择时间");
return
}
axios
.put(this.url + "/Visitor/RemakeVisitor/"+this.againJson.id, null,{params:{visitTime:this.evaluateValue}})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.viewQrcode(this.againJson.card,this.againJson.visitTime,this.againJson.name,this.againJson.sex);
// this.$router.push("/applyQrcode?code="+result.data+"&visitTime="+this.form.visitTime+"&name="+this.form.name+"&sex="+this.form.sex);
} else {
this.$toast.fail(result.msg);
}
});
},
inviteAgain(id,card,name,sex){
this.againJson = {id:id,card:card,name:name,sex:sex};
this.dialogshow = true;
},
confirm(val, prop) {
this.evaluateValue = val;
this.againJson.visitTime = val;
},
deletefklog(id){
axios
.delete(this.url + "/Visitor/DeleteVisitor/"+id, {})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.getInit();
} else {
this.$toast.fail(result.msg);
}
});
},
viewQrcode(code,visitTime,name,sex){
this.$router.push("/applyQrcode?code="+code+"&visitTime="+visitTime+"&name="+name+"&sex="+sex);
},
getInit(){
axios
.get(this.url + "/Visitor/GetVisitors/"+this.user.id, {params:{visitorStatus:this.active+1,approveStatus:2}})
.then((res) => {
let result = res.data;
if (result.code == 0) {
this.list = result.data;
} else {
this.$toast.fail(result.msg);
}
});
},
onClickLeft(){
// history.go(-1)
this.$router.push("/invite");
},
onClickRight(){
},
submitBack(val){
this.popShow = false;
this.form.carNumber = val;
},
keysShow(){
this.popShow = true
},
tabChange(val){
console.log(this.active)
this.getInit();
},
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
.van-dialog__cancel{
background-color: #333333;
}
.van-button::before{
background-color: #333333;
}
</style>
<style scoped>
.van-button--square {
height: 100%;
}
.van-dialog{
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); ;
}
</style>

299
src/views/visitor/bind.vue Normal file
View File

@ -0,0 +1,299 @@
<template lang="html">
<div>
<div class="login-wrap" style="background-color: #e4decf;">
<!-- <img :src="companyPath" style="position: absolute;width: 100%;height: 100%;z-index: -1;" alt=""> -->
<div style="width: 100%;height: 12rem;display: flex;align-items: center;justify-content: center;">
<img src="../../../static/img/e75ce57e12699e6f5c216c6249447fa.png" style="width: 76%;height: 8rem;" alt="">
</div>
<div style="width: 80%;height: auto;margin: auto;z-index: 1;">
<el-form
label-position="left"
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="0px"
class="demo-ruleForm login-container"
>
<h3 class="title">注册</h3>
<el-form-item prop="username">
<el-input
type="number"
v-model="ruleForm.telphone"
auto-complete="off"
placeholder="手机号"
></el-input>
</el-form-item>
<el-form-item prop="username">
<div style="display: flex">
<el-input
type="text"
v-model="code"
auto-complete="off"
placeholder="验证码"
></el-input>
<el-button
style="margin-left: 1rem; width: 10rem"
type="primary"
@click="sendSms"
v-if="show"
>获取验证码</el-button
>
<div
style="
width: 10rem;
margin-left: 1rem;
background-color: gray;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0.2rem;
"
v-if="!show"
>
倒计时
<van-count-down @finish="finish" :time="60000" format="ss" />
</div>
<!-- <el-button
style="
margin-left: 1rem;
background-color: gray;
color: #fff;
display: flex;
"
type="primary"
v-if="!show"
>倒计时 <van-count-down :time="60000" format="ss"
/></el-button> -->
</div>
</el-form-item>
<el-form-item style="width: 100%">
<el-button
type="primary"
style="width: 100%"
@click="submit"
:loading="logining"
>立即注册</el-button
>
</el-form-item>
</el-form>
</div>
<div style="height: 2rem;width:100%;"></div>
<div style="height: auto;width:80%;margin: auto;color: #736a64;">
<p style="line-height: 2rem;">尊敬的业主：</p>
<p style="text-indent: 2em;line-height: 2rem;">请使用您报备于物管中心的个人手机号码完成首次注册登记。</p>
<p style="text-indent: 2em;line-height: 2rem;">谢谢大家的配合。</p>
</div>
<div style="height: 1rem;width:100%;"></div>
<div style="height: auto;width:80%;margin: auto;color: #736a64;">
<p style="text-indent: 6em;line-height: 2rem;">浅水湾小区业主委员会。</p>
<p style="text-indent: 8em;line-height: 2rem;">2024年1月1日</p>
</div>
<!-- <div class="navi_footer">
<div
style="height: 100%; width: 100%"
class="navi_footer_check"
v-on:click="go"
>
<div>
<i class="el-icon-refresh-left" style="font-size: 20px"></i>
</div>
<div><span style="font-size: 0.7rem">返回</span></div>
</div>
</div> -->
</div>
</div>
</template>
<script>
import axios from "axios";
import $ from "../../../static/js/jquery-3.3.1.min.js";
export default {
data() {
return {
show: true,
url: "",
code: "",
companyPath:"",
rules: {
phonenum: [
{ required: true, message: "请输入手机号码", trigger: "blur" },
],
},
ruleForm: {
telphone: "",
openId: "",
},
logining: false,
companyId:'',
};
},
activated() {
},
mounted() {
},
methods: {
finish() {
this.show = true;
},
sendSms() {
if (!this.ruleForm.telphone) {
this.$toast.fail("请输入正确的手机号码");
return;
}
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.ruleForm.telphone)) {
this.$toast.fail("请输入正确的手机号码");
return;
}
let url = this.$store.state.url;
axios
.post(url + "/Wx/SendSms", null, {
params: { telphone: this.ruleForm.telphone },
})
.then((res) => {
let result = res.data;
console.log(result);
if (result.code == 0) {
this.show = false;
this.$toast.success("发送成功");
} else {
this.$toast.fail(result.msg);
}
});
},
go() {
this.$router.push("/filter");
},
submit() {
let openid = localStorage.getItem("openid");
if (!localStorage.getItem("openid")) {
this.$toast.fail("暂无人员信息");
return;
}
if (!this.ruleForm.telphone) {
this.$toast.fail("请输入正确的手机号码");
return;
}
const reg = /^1[3|4|5|6|7|8|9][0-9]\d{8}$/;
if (!reg.test(this.ruleForm.telphone)) {
this.$toast.fail("请输入正确的手机号码");
return;
}
if (!this.code) {
this.$toast.fail("请输入验证码");
return;
}
let url = this.$store.state.url;
this.ruleForm.openId = openid;
axios
.post(url + "/Wx/VerifyCode", null, {
params: { telphone: this.ruleForm.telphone, code: this.code },
})
.then((res) => {
let result = res.data;
console.log(result);
if (result.code == 0) {
axios
.post(url + "/Wx/WxOpenIdBInd", null, { params: this.ruleForm })
.then((res) => {
let result = res.data;
if (result.code == 0) {
localStorage.setItem("userInfo",JSON.stringify(result.data))
this.$toast.success("注册成功,3秒后跳转个人中心...");
let that = this;
// that.$router.push("/success?content=注册");
setTimeout(function () {
that.$router.push("/personalCenter");
}, 3000);
} else {
this.$toast.fail(result.msg);
}
});
} else {
this.$toast.fail(result.msg);
}
});
},
},
};
</script>
<style scoped>
.van-count-down {
color: #fff;
}
.login-wrap {
box-sizing: border-box;
width: 100%;
height: 100%;
min-height: 100vh;
position: relative;
/* background-color: #112346; */
background-repeat: no-repeat;
background-position: center right;
background-size: 100%;
}
.login-container {
border-radius: 50px;
margin: auto;
width: 80%;
padding: 30px 35px 15px 35px;
background: #fff;
border: 1px solid #eaeaea;
/*text-align: left;*/
box-shadow: 0 0 20px 2px rgba(0, 0, 0, 0.1);
}
.title {
margin: 0px auto 40px auto;
text-align: center;
color: #505458;
}
.remember {
margin: 0px 0px 35px 0px;
}
.code-box {
text-align: right;
}
.codeimg {
height: 40px;
}
.navi_footer {
background-color: #ffffff;
display: flex;
position: fixed;
bottom: 0%;
height: 3rem;
width: 100%;
color: #888b93;
}
.navi_footer_check {
font-weight: bold;
}
.navi_footer_check div {
height: 50%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
</style>

61
src/views/visitor/confirmCome.vue Normal file
View File

@ -0,0 +1,61 @@
<template lang="html">
<div>
<div style="width: 100%;height: 100vh;margin: auto;">
<el-card class="box-card" :body-style="cardStyle" style="height: 100%;">
<el-descriptions
class="margin-top"
title="访客申请到访信息"
:column="1"
:size="size"
>
<template slot="extra">
<!-- <el-button type="primary" size="small">操作</el-button> -->
</template>
<el-descriptions-item label="姓名">张三</el-descriptions-item>
<el-descriptions-item label="手机号">18100000000</el-descriptions-item>
<el-descriptions-item label="身份证">3302888888888889</el-descriptions-item>
<el-descriptions-item label="来访单位">大招</el-descriptions-item>
<el-descriptions-item label="车牌号码">浙BFDFSF</el-descriptions-item>
<el-descriptions-item label="到访时间">2022-08-08 10:00:00</el-descriptions-item>
<el-descriptions-item label="备注">
已到
</el-descriptions-item>
</el-descriptions>
<div style="width: 100%;height:5rem;"></div>
<!-- <div style="width: 100%;height:4rem;">
<div style="width:70%;height:100%;display:flex;justify-content: space-between;margin: auto;align-items: center;">
<el-button type="primary" style="height: 3rem;width: 35%;">同意</el-button>
<el-button type="warning" style="height: 3rem;width: 35%;">拒绝</el-button>
</div>
</div> -->
</el-card>
</div>
<div style="width:100%;height:3rem;position: fixed;bottom: 0;display: flex;" >
<div style="width:50%;height:100%;background: linear-gradient(to right, #44c5fe, #1292fe);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="accept">接受放行</div>
<div style="width:50%;height:100%;background: linear-gradient(to right, #fdad35, #e6a23c);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="refuse">拒绝放行</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
size: "medium",
cardStyle:{'padding': '20px','height':'100%'}
};
},
activated() {},
mounted() {},
methods: {
accept(){},
refuse(){},
},
};
</script>
<style lang="stylus" scoped></style>

115
src/views/visitor/confirmRes.vue Normal file
View File

@ -0,0 +1,115 @@
<template lang="html">
<div v-if="id">
<div style="width: 100%;height: 100vh;margin: auto;" >
<el-card class="box-card" :body-style="cardStyle" style="height: 100%;">
<el-descriptions
class="margin-top"
title="访客申请预约信息"
:column="1"
:size="size"
border
>
<template slot="extra">
<!-- <el-button type="primary" size="small">操作</el-button> -->
</template>
<el-descriptions-item label="姓名">{{json.name}}</el-descriptions-item>
<el-descriptions-item label="手机号">{{json.phoneNumber}}</el-descriptions-item>
<el-descriptions-item label="身份证号">{{json.iDCard}}</el-descriptions-item>
<el-descriptions-item label="到访时间">{{json.visitTime}}</el-descriptions-item>
<el-descriptions-item label="车牌号" v-if="json.licensePlate">{{json.licensePlate}}</el-descriptions-item>
<el-descriptions-item label="来访原因">
{{json.reason}}
</el-descriptions-item>
</el-descriptions>
<div style="width: 100%;height:5rem;"></div>
<!-- <div style="width: 100%;height:4rem;">
<div style="width:70%;height:100%;display:flex;justify-content: space-between;margin: auto;align-items: center;">
<el-button type="primary" style="height: 3rem;width: 35%;">同意</el-button>
<el-button type="warning" style="height: 3rem;width: 35%;">拒绝</el-button>
</div>
</div> -->
</el-card>
</div>
<div style="width:100%;height:3rem;position: fixed;bottom: 0;display: flex;" >
<div style="width:50%;height:100%;background: linear-gradient(to right, #44c5fe, #1292fe);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="postResult('同意')">接受访问</div>
<div style="width:50%;height:100%;background: linear-gradient(to right, #fdad35, #e6a23c);color: #fff;display: flex;align-items: center;justify-content: center;font-size: 1rem;" @click="postResult('拒绝')">拒绝访问</div>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
size: "medium",
cardStyle:{'padding': '20px','height':'100%'},
lableStyle:{'line-height:': '80px'},
url:"",
id:"",
desc:"",
json:{},
};
},
activated() {
},
mounted() { this.getInit();},
methods: {
getInit(){
this.url = this.$store.state.url;
if(this.$route.query.id){
this.id = this.$route.query.id;
this.getInfo();
} else{
this.$toast.fail("暂无信息");
}
},
getInfo(){
axios
.get(this.url + "/Visitor/GetVisitor/"+this.id,{})
.then((res) => {
let result = res.data;
if(result.code==0){
this.json = result.data;
console.log(this.json)
console.log(result)
} else{
this.$toast.fail(result.msg);
}
})
.catch((error) => {});
},
postResult(val){
if(!this.id){
this.$toast.fail("暂无信息");
return
}
axios
.put(this.url + "/Visitor/ApproveVisitor/"+this.id,null,{params:{result:val}})
.then((res) => {
let result = res.data;
if(result.code==0){
this.$router.push("/success?content=审批");
} else{
this.$toast.fail(result.msg);
}
})
.catch((error) => {});
},
},
};
</script>
<style>
.my-label{
line-height: 80px;
}
</style>

39
src/views/visitor/invite.vue Normal file
View File

@ -0,0 +1,39 @@
<template lang="html">
<div>
<invite-jf></invite-jf>
</div>
</template>
<script>
import axios from "axios";
import InviteJf from '../../components/invite/inviteJf.vue'
export default {
data() {
return {
};
},
components:{InviteJf},
activated() {
},
mounted() {},
methods: {
},
};
</script>
<style>
.van-step__circle-container{
background-color: #f2f3f5 !important
}
</style>
<style lang="stylus" scoped>
.van-steps{
background-color: #f2f3f5;
}
</style>

214
src/views/visitor/login.vue Normal file
View File

File diff suppressed because one or more lines are too long

83
src/views/visitor/person.vue Normal file
View File

@ -0,0 +1,83 @@
<template lang="html">
<div>
<div style="height: 100vh;width:100%;" v-loading="load"></div>
</div>
</template>
<script>
import axios from "axios";
export default {
data() {
return {
url: "",
load:false
};
},
activated() {
// localStorage.setItem("openid","o37RQ6eX0vRU0Hi3tgClY1a94Vno");
},
mounted() {this.getInit();},
methods: {
getInit() {
this.load = true;
let url = this.$store.state.url;
if (this.$route.query.code && this.$route.query.goUrl) {
axios
.get(
url +
"/Wx/GetOpenId" +
"?code=" +
this.$route.query.code,
{}
)
.then((res) => {
let result = res.data;
if (result.code == 0) {
let openid = result.data;
localStorage.setItem("openid", openid);
this.getUser(openid);
} else {
this.$toast.fail("获取人员信息失败");
}
})
.catch((error) => {});
} else {
if(localStorage.getItem("openid")){
let openid = localStorage.getItem("openid");
this.getUser(openid);
} else{
this.$toast.fail("暂无人员信息");
}
}
},
getUser(openid){
let url = this.$store.state.url;
axios
.get(url + "/Wx/GetUserInfo?openId="+openid , {})
.then((res) => {
let result = res.data;
this.load = false;
if(result.code==0){
localStorage.setItem("userInfo",JSON.stringify({id:result.data.id,name:result.data.name,telphone:result.data.telphone,unit:result.data.unit,fjNum:result.data.fjNum,facePhoto:result.data.facePhoto,role:result.data.role}));
this.$router.push("/"+this.$route.query.goUrl);
} else{
if(this.$route.query.goUrl=='applySelf'){
this.$router.push("/applySelf");
return
}
this.$router.push("/bind");
}
}).catch(error => {
});
},
},
};
</script>
<style lang="stylus" scoped></style>

95
src/views/visitor/qrcode.vue Normal file
View File

@ -0,0 +1,95 @@
<template lang="html">
<div>
<van-nav-bar
title=""
left-arrow
@click-left="back"
/>
<div style="width: 100%;height:2rem;"></div>
<div style="width: 100%;height:3rem;display: flex;justify-content: center;align-items: center;color: red;font-family: '黑体';font-size: 0.9rem;">* 长按保存图片</div>
<div
style="
width: 90%;
height: auto;
border-radius: 10px;
margin: auto;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
"
ref="imageArea"
>
<div
style="
width: 100%;
height: auto;
display: flex;
align-items: center;
justify-content: center;
"
>
<img :src="url" style="width: 100%;" alt="" />
</div>
</div>
</div>
</template>
<script>
import QRCode from "qrcodejs2";
import html2canvas from "html2canvas";
export default {
data() {
return {
code: "",
codeShow: false,
codeList: [],
id: "",
fjNum: "",
url: "",
};
},
created() {},
mounted() {
if ( localStorage.getItem("qrcode")) {
this.url = localStorage.getItem("qrcode");
console.log(this.url)
} else {
this.$toast.fail("无二维码信息");
}
},
methods: {
back(){
history.go(-1)
},
},
};
</script>
<style scoped>
p {
text-align: center;
color: #474747;
}
.text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
.e_text {
width: 100%;
min-height: 1.6rem;
display: flex;
justify-content: center;
font-size: 1.2rem;
font-family: "黑体";
align-items: center;
height: auto;
margin-bottom: 0.3rem;
}
</style>

44
src/views/visitor/success.vue Normal file
View File

@ -0,0 +1,44 @@
<template lang="html">
<div style="padding: 10px">
<!-- <div style="width: 100%;height: 10rem;background-color: pink;">
<img src="../../../static/img/e75ce57e12699e6f5c216c6249447fa.png" style="width: 100%;height: 10rem" alt="">
</div> -->
<div style="width: 100%;height: 100vh;display: flex;align-items: center;justify-content: center;">
<el-result icon="success" :title="content+'成功'" >
<template slot="extra">
<el-button type="success" size="medium" @click="goOrder" v-if="button">{{button}}</el-button>
</template>
</el-result>
</div>
</div>
</template>
<script>
export default {
data() {
return {content:"",url:"",button:""};
},
activated(){
},
created() {
// let that = this; setTimeout(function(){ that.$router.push('/orderList');},3000)
},
mounted() { this.content = this.$route.query.content;this.url = this.$route.query.url;this.button = this.$route.query.button;},
methods: {
goOrder(){
this.$router.push(this.url);
},
},
};
</script>
<style lang="stylus" scoped></style>

1
static/css/element.css Normal file
View File

File diff suppressed because one or more lines are too long

BIN
static/img/car.png Normal file
View File

Binary file not shown.
Side by Side

After

(image error) Size: 454 B

BIN
static/img/e75ce57e12699e6f5c216c6249447fa.png Normal file
View File

Binary file not shown.
Side by Side

After

(image error) Size: 71 KiB

BIN
static/img/no_image.png Normal file
View File

Binary file not shown.
Side by Side

After

(image error) Size: 1.1 KiB

BIN
static/img/qrcode.png Normal file
View File

Binary file not shown.
Side by Side

After

(image error) Size: 460 B

BIN
static/img/微信图片_20231218111554.png Normal file
View File

Binary file not shown.
Side by Side

After

(image error) Size: 173 KiB

1
static/js/element.js Normal file
View File

File diff suppressed because one or more lines are too long

2
static/js/jquery-3.3.1.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long