suzhou-jichuang-lanhai
/
taicangPopulation2
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

户人的新增/修改/删除

Browse Source
master
许宏杰 8 months ago
parent 883f1087d7
commit efe3f981b2
17 changed files with 761 additions and 378 deletions
Show Stats Download Patch File Download Diff File

7
src/api/home/index.js
Unescape View File

@ -66,6 +66,13 @@ export function inputSearch(params) {
params, params,
}); });
} }
export function inputSearch2(params) {
return request({
url: "/taicangpop/data/sszx",
method: "GET",
params,
});
}
//网格员帅选简介 //网格员帅选简介
export function getNectWorkOffice(params) { export function getNectWorkOffice(params) {

BIN
src/assets/images/ui/left.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

BIN
src/assets/images/ui/right.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 32 KiB

55
src/assets/styles/index.scss
Unescape View File

@ -196,9 +196,62 @@ aside {
width: 140px; width: 140px;
} }
.taicang-dialog { .taicang-dialog,
.taicang-dialog-small {
width: 1100px !important; width: 1100px !important;
.el-dialog__close { .el-dialog__close {
color: #fff; color: #fff;
} }
.el-badge__content.is-fixed {
z-index: 10;
}
.el-dialog {
background: transparent;
}
.el-dialog__header {
padding: 0;
}
.el-dialog__body {
background: #009bf4;
// border-radius: 12px;
padding: 1px;
}
.el-dialog:not(.is-fullscreen) {
margin-top: 6.5vh !important;
}
.dialog-main {
min-height: 700px;
display: flex;
flex-direction: column;
background: #031c3c;
//border-radius: 12px;
padding: 20px;
.dialog-title {
display: flex;
align-items: center;
span {
display: inline-block;
height: 17px;
width: 5px;
background: #00a8ff;
margin-right: 10px;
}
font-size: 18px;
color: #f4f8fa;
font-weight: 500;
font-family: "Alibaba-PuHuiTi-Medium.otf";
}
}
.dialog-btn-group {
display: flex;
align-items: center;
justify-content: center;
}
}
.taicang-dialog-small {
width: 850px !important;
.dialog-main {
min-height: 500px;
}
} }

1
src/assets/styles/isTable.scss
Unescape View File

@ -81,6 +81,7 @@
font-family: "Alibaba-PuHuiTi-Regular.otf"; font-family: "Alibaba-PuHuiTi-Regular.otf";
} }
} }
.activeItme { .activeItme {
color: #ffffff !important; color: #ffffff !important;
border: 1px solid #006cc5 !important; border: 1px solid #006cc5 !important;

48
src/components/NavigationBar/index.vue
Unescape View File

@ -20,7 +20,7 @@
<div class="navigation-right" v-show="showRight"> <div class="navigation-right" v-show="showRight">
<div class="reset"></div> <div class="reset"></div>
<el-button type="text">后台管理</el-button> <el-button type="text">后台管理</el-button>
<el-button type="text" v-show="showStreet">美丽街区</el-button> <!-- <el-button type="text" v-show="showStreet">美丽街区</el-button> -->
<el-button type="text" @click="handleBack()" v-show="!showStreet" <el-button type="text" @click="handleBack()" v-show="!showStreet"
>返回街道</el-button >返回街道</el-button
> >
@ -29,7 +29,7 @@
<!-- 四个中心 --> <!-- 四个中心 -->
<el-dialog <el-dialog
:visible.sync="open" :visible.sync="open"
:modal="false" append-to-body
custom-class="taicang-dialog" custom-class="taicang-dialog"
> >
<div class="dialog-main"> <div class="dialog-main">
@ -125,6 +125,7 @@ export default {
width: 100%; width: 100%;
} }
.navigation-bar { .navigation-bar {
position: relative;
height: 100%; height: 100%;
width: 100%; width: 100%;
background: url("~@/assets/images/ui/navigation.png"); background: url("~@/assets/images/ui/navigation.png");
@ -137,6 +138,8 @@ export default {
.navigation-left { .navigation-left {
padding-top: 20px; padding-top: 20px;
padding-left: 25px; padding-left: 25px;
background-size: cover;
} }
.navigation-title { .navigation-title {
text-align: center; text-align: center;
@ -189,46 +192,5 @@ export default {
padding: 12px 20px 14px 20px; padding: 12px 20px 14px 20px;
font-family: "Alibaba-PuHuiTi-Regular.otf"; font-family: "Alibaba-PuHuiTi-Regular.otf";
} }
.dialog-main {
min-height: 700px;
display: flex;
flex-direction: column;
background: #031c3c;
border-radius: 12px;
padding: 20px;
.dialog-title {
display: flex;
align-items: center;
span {
display: inline-block;
height: 17px;
width: 5px;
background: #00a8ff;
margin-right: 10px;
}
font-size: 18px;
color: #f4f8fa;
font-weight: 500;
font-family: "Alibaba-PuHuiTi-Medium.otf";
}
}
}
::v-deep .el-badge__content.is-fixed {
z-index: 10;
}
::v-deep .el-dialog {
background: transparent;
}
::v-deep .el-dialog__header {
padding: 0;
}
::v-deep .el-dialog__body {
background: #009bf4;
border-radius: 12px;
padding: 1px;
}
::v-deep .el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important;
} }
</style> </style>

11
src/components/NavigationBar/peopleCentre.vue
Unescape View File

@ -154,7 +154,8 @@
<div class="result-list"> <div class="result-list">
<div class="list-header"> <div class="list-header">
<div class="header-left-total"> <div class="header-left-total">
搜索结果列表 {{ houseTotal }}户 {{ total }}人 搜索结果列表
<!-- {{ houseTotal }}户 {{ total }}人 -->
</div> </div>
<div class="header-rigth-total">共{{ total }}条数据</div> <div class="header-rigth-total">共{{ total }}条数据</div>
</div> </div>
@ -204,7 +205,7 @@
</template> </template>
<script> <script>
import { inputSearch } from "@/api/home/index.js"; import { inputSearch2 } from "@/api/home/index.js";
import { handleTreeId } from "@/utils/findTreeId.js"; import { handleTreeId } from "@/utils/findTreeId.js";
import { treeselect } from "@/api/system/dept"; //部门 import { treeselect } from "@/api/system/dept"; //部门
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
@ -288,9 +289,9 @@ export default {
}, },
mounted() { mounted() {
this.show_shequ_xiaoqu = this.$auth.hasRoleOr(["admin", "leader"]); //超级管理员 - 领导 this.show_shequ_xiaoqu = this.$auth.hasRoleOr(["admin", "leader"]); //超级管理员 - 领导
this.show_net = this.$auth.authRoleNet("network"); //网格员 // this.show_net = this.$auth.authRoleNet("network"); //网格员
console.log(this.show_shequ_xiaoqu, this.show_net); // console.log(this.show_shequ_xiaoqu, this.show_net);
this.queryParams.shequId = this.queryParamsIndex.shequId; this.queryParams.shequId = this.queryParamsIndex.shequId;
this.getDeptList(); this.getDeptList();
@ -427,7 +428,7 @@ export default {
*/ */
async getList() { async getList() {
this.loading = true; this.loading = true;
let result = await inputSearch(this.queryParams); let result = await inputSearch2(this.queryParams);
let handleColor = this.handleColor(result.data.xinxilist.rows); let handleColor = this.handleColor(result.data.xinxilist.rows);
this.list = [...this.list, ...handleColor]; this.list = [...this.list, ...handleColor];
this.houseTotal = result.data.count; this.houseTotal = result.data.count;

3
src/components/NavigationBar/userModel.vue
Unescape View File

@ -36,7 +36,8 @@ export default {
}) })
.then(() => { .then(() => {
this.$store.dispatch("LogOut").then(() => { this.$store.dispatch("LogOut").then(() => {
location.href = "/index"; // location.href = "/index";
this.$router.replace("/login");
}); });
}) })
.catch(() => {}); .catch(() => {});

43
src/components/imageButton/index.vue
Unescape View File

@ -0,0 +1,43 @@
<template>
<div class="image-button" :class="size" @click="clickBtn">
<slot></slot>
</div>
</template>
<script>
export default {
props: {
// medium、small、mini
size: {
type: String,
default: "mini",
},
},
data() {
return {};
},
methods: {
clickBtn() {
this.$emit("handlerClcik");
},
},
};
</script>
<style lang="scss" scoped>
.image-button {
display: inline-block;
cursor: pointer;
color: #fff;
margin: 0 0 0 10px;
font-size: 14px;
background: url("~@/assets/images/ui/tab1.png");
background-size: 100% 100%;
}
.small {
padding: 3px 16px 5px 16px;
}
.mini {
padding: 2px 11px 4px 11px;
}
</style>

3
src/main.js
Unescape View File

@ -40,6 +40,8 @@ import {
selectDictLabels, selectDictLabels,
handleTree, handleTree,
} from "@/utils/ruoyi"; } from "@/utils/ruoyi";
//自定义按钮
import imageButton from "@/components/imageButton";
// 分页组件 // 分页组件
import Pagination from "@/components/Pagination"; import Pagination from "@/components/Pagination";
// 自定义表格工具组件 // 自定义表格工具组件
@ -71,6 +73,7 @@ Vue.prototype.download = download;
Vue.prototype.handleTree = handleTree; Vue.prototype.handleTree = handleTree;
// 全局组件挂载 // 全局组件挂载
Vue.component("imageButton", imageButton);
Vue.component("DictTag", DictTag); Vue.component("DictTag", DictTag);
Vue.component("Pagination", Pagination); Vue.component("Pagination", Pagination);
Vue.component("RightToolbar", RightToolbar); Vue.component("RightToolbar", RightToolbar);

252
src/utils/request.js
Unescape View File

@ -1,114 +1,150 @@
import axios from 'axios' import axios from "axios";
import { Notification, MessageBox, Message, Loading } from 'element-ui' import { Notification, MessageBox, Message, Loading } from "element-ui";
import store from '@/store' import store from "@/store";
import { getToken } from '@/utils/auth' import { getToken } from "@/utils/auth";
import errorCode from '@/utils/errorCode' import errorCode from "@/utils/errorCode";
import { tansParams, blobValidate } from "@/utils/ruoyi"; import { tansParams, blobValidate } from "@/utils/ruoyi";
import cache from '@/plugins/cache' import cache from "@/plugins/cache";
import { saveAs } from 'file-saver' import { saveAs } from "file-saver";
import router from "@/router";
let downloadLoadingInstance; let downloadLoadingInstance;
// 是否显示重新登录 // 是否显示重新登录
export let isRelogin = { show: false }; export let isRelogin = { show: false };
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8' axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
// 创建axios实例 // 创建axios实例
const service = axios.create({ const service = axios.create({
// axios中请求配置有baseURL选项，表示请求URL公共部分 // axios中请求配置有baseURL选项，表示请求URL公共部分
baseURL: process.env.VUE_APP_BASE_API, baseURL: process.env.VUE_APP_BASE_API,
// 超时 // 超时
timeout: 10000 timeout: 10000,
}) });
// request拦截器 // request拦截器
service.interceptors.request.use(config => { service.interceptors.request.use(
// 是否需要设置 token (config) => {
const isToken = (config.headers || {}).isToken === false // 是否需要设置 token
// 是否需要防止数据重复提交 const isToken = (config.headers || {}).isToken === false;
const isRepeatSubmit = (config.headers || {}).repeatSubmit === false // 是否需要防止数据重复提交
if (getToken() && !isToken) { const isRepeatSubmit = (config.headers || {}).repeatSubmit === false;
config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改 if (getToken() && !isToken) {
} config.headers["Authorization"] = "Bearer " + getToken(); // 让每个请求携带自定义token 请根据实际情况自行修改
// get请求映射params参数
if (config.method === 'get' && config.params) {
let url = config.url + '?' + tansParams(config.params);
url = url.slice(0, -1);
config.params = {};
config.url = url;
}
if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {
const requestObj = {
url: config.url,
data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,
time: new Date().getTime()
} }
const requestSize = Object.keys(JSON.stringify(requestObj)).length; // 请求数据大小 // get请求映射params参数
const limitSize = 5 * 1024 * 1024; // 限制存放数据5M if (config.method === "get" && config.params) {
if (requestSize >= limitSize) { let url = config.url + "?" + tansParams(config.params);
console.warn(`[${config.url}]: ` + '请求数据大小超出允许的5M限制，无法进行防重复提交验证。') url = url.slice(0, -1);
return config; config.params = {};
config.url = url;
} }
const sessionObj = cache.session.getJSON('sessionObj') if (
if (sessionObj === undefined || sessionObj === null || sessionObj === '') { !isRepeatSubmit &&
cache.session.setJSON('sessionObj', requestObj) (config.method === "post" || config.method === "put")
} else { ) {
const s_url = sessionObj.url; // 请求地址 const requestObj = {
const s_data = sessionObj.data; // 请求数据 url: config.url,
const s_time = sessionObj.time; // 请求时间 data:
const interval = 1000; // 间隔时间(ms)，小于此时间视为重复提交 typeof config.data === "object"
if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) { ? JSON.stringify(config.data)
const message = '数据正在处理，请勿重复提交'; : config.data,
console.warn(`[${s_url}]: ` + message) time: new Date().getTime(),
return Promise.reject(new Error(message)) };
const requestSize = Object.keys(JSON.stringify(requestObj)).length; // 请求数据大小
const limitSize = 5 * 1024 * 1024; // 限制存放数据5M
if (requestSize >= limitSize) {
console.warn(
`[${config.url}]: ` +
"请求数据大小超出允许的5M限制，无法进行防重复提交验证。"
);
return config;
}
const sessionObj = cache.session.getJSON("sessionObj");
if (
sessionObj === undefined ||
sessionObj === null ||
sessionObj === ""
) {
cache.session.setJSON("sessionObj", requestObj);
} else { } else {
cache.session.setJSON('sessionObj', requestObj) const s_url = sessionObj.url; // 请求地址
const s_data = sessionObj.data; // 请求数据
const s_time = sessionObj.time; // 请求时间
const interval = 1000; // 间隔时间(ms)，小于此时间视为重复提交
if (
s_data === requestObj.data &&
requestObj.time - s_time < interval &&
s_url === requestObj.url
) {
const message = "数据正在处理，请勿重复提交";
console.warn(`[${s_url}]: ` + message);
return Promise.reject(new Error(message));
} else {
cache.session.setJSON("sessionObj", requestObj);
}
} }
} }
return config;
},
(error) => {
console.log(error);
Promise.reject(error);
} }
return config );
}, error => {
console.log(error)
Promise.reject(error)
})
// 响应拦截器 // 响应拦截器
service.interceptors.response.use(res => { service.interceptors.response.use(
(res) => {
// 未设置状态码则默认成功状态 // 未设置状态码则默认成功状态
const code = res.data.code || 200; const code = res.data.code || 200;
// 获取错误信息 // 获取错误信息
const msg = errorCode[code] || res.data.msg || errorCode['default'] const msg = errorCode[code] || res.data.msg || errorCode["default"];
// 二进制数据则直接返回 // 二进制数据则直接返回
if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') { if (
return res.data res.request.responseType === "blob" ||
res.request.responseType === "arraybuffer"
) {
return res.data;
} }
if (code === 401) { if (code === 401) {
if (!isRelogin.show) { if (!isRelogin.show) {
isRelogin.show = true; isRelogin.show = true;
MessageBox.confirm('登录状态已过期，您可以继续留在该页面，或者重新登录', '系统提示', { confirmButtonText: '重新登录', cancelButtonText: '取消', type: 'warning' }).then(() => { MessageBox.confirm(
isRelogin.show = false; "登录状态已过期，您可以继续留在该页面，或者重新登录",
store.dispatch('LogOut').then(() => { "系统提示",
location.href = '/index'; {
confirmButtonText: "重新登录",
cancelButtonText: "取消",
type: "warning",
}
)
.then(() => {
isRelogin.show = false;
store.dispatch("LogOut").then(() => {
// location.href = '/index';
router.replace("/login");
});
}) })
}).catch(() => { .catch(() => {
isRelogin.show = false; isRelogin.show = false;
}); });
} }
return Promise.reject('无效的会话，或者会话已过期，请重新登录。') return Promise.reject("无效的会话，或者会话已过期，请重新登录。");
} else if (code === 500) { } else if (code === 500) {
Message({ message: msg, type: 'error' }) Message({ message: msg, type: "error" });
return Promise.reject(new Error(msg)) return Promise.reject(new Error(msg));
} else if (code === 601) { } else if (code === 601) {
Message({ message: msg, type: 'warning' }) Message({ message: msg, type: "warning" });
return Promise.reject('error') return Promise.reject("error");
} else if (code !== 200) { } else if (code !== 200) {
Notification.error({ title: msg }) Notification.error({ title: msg });
return Promise.reject('error') return Promise.reject("error");
} else { } else {
return res.data return res.data;
} }
}, },
error => { (error) => {
console.log('err' + error) console.log("err" + error);
let { message } = error; let { message } = error;
if (message == "Network Error") { if (message == "Network Error") {
message = "后端接口连接异常"; message = "后端接口连接异常";
@ -117,36 +153,48 @@ service.interceptors.response.use(res => {
} else if (message.includes("Request failed with status code")) { } else if (message.includes("Request failed with status code")) {
message = "系统接口" + message.substr(message.length - 3) + "异常"; message = "系统接口" + message.substr(message.length - 3) + "异常";
} }
Message({ message: message, type: 'error', duration: 5 * 1000 }) Message({ message: message, type: "error", duration: 5 * 1000 });
return Promise.reject(error) return Promise.reject(error);
} }
) );
// 通用下载方法 // 通用下载方法
export function download(url, params, filename, config) { export function download(url, params, filename, config) {
downloadLoadingInstance = Loading.service({ text: "正在下载数据，请稍候", spinner: "el-icon-loading", background: "rgba(0, 0, 0, 0.7)", }) downloadLoadingInstance = Loading.service({
return service.post(url, params, { text: "正在下载数据，请稍候",
transformRequest: [(params) => { return tansParams(params) }], spinner: "el-icon-loading",
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, background: "rgba(0, 0, 0, 0.7)",
responseType: 'blob', });
...config return service
}).then(async (data) => { .post(url, params, {
const isBlob = blobValidate(data); transformRequest: [
if (isBlob) { (params) => {
const blob = new Blob([data]) return tansParams(params);
saveAs(blob, filename) },
} else { ],
const resText = await data.text(); headers: { "Content-Type": "application/x-www-form-urlencoded" },
const rspObj = JSON.parse(resText); responseType: "blob",
const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default'] ...config,
Message.error(errMsg); })
} .then(async (data) => {
downloadLoadingInstance.close(); const isBlob = blobValidate(data);
}).catch((r) => { if (isBlob) {
console.error(r) const blob = new Blob([data]);
Message.error('下载文件出现错误，请联系管理员！') saveAs(blob, filename);
downloadLoadingInstance.close(); } else {
}) const resText = await data.text();
const rspObj = JSON.parse(resText);
const errMsg =
errorCode[rspObj.code] || rspObj.msg || errorCode["default"];
Message.error(errMsg);
}
downloadLoadingInstance.close();
})
.catch((r) => {
console.error(r);
Message.error("下载文件出现错误，请联系管理员！");
downloadLoadingInstance.close();
});
} }
export default service export default service;

51
src/views/components/xiaoqu/building.vue
Unescape View File

@ -50,27 +50,42 @@ export default {
"houseItem", "houseItem",
]), ]),
groupedRooms() { groupedRooms() {
// 初始化每层楼的数组 console.log(this.list.length, "总房屋数");
let floors = Array.from({ length: this.info.floor }, () => []); if (this.info.deptname == "嘉华园") {
// 对房间数据进行排序
const sortedRooms = this.list.sort((a, b) => {
a.keyId = uuidv4();
b.keyId = uuidv4();
a = this.handleColor(a);
b = this.handleColor(b);
// 提取房间号的后半部分进行比较
let roomA = parseInt(a.name.split("-")[1]);
let roomB = parseInt(b.name.split("-")[1]);
return roomA - roomB;
});
return [sortedRooms];
} else {
// 初始化每层楼的数组
let floors = Array.from({ length: this.info.floor }, () => []);
// 遍历房间数据 // 遍历房间数据
this.list.forEach((room) => { this.list.forEach((room) => {
// 提取房间号前几位作为楼层号 // 提取房间号前几位作为楼层号
let floor = (parseInt(room.name) / 100) | 0; let floor = (parseInt(room.name) / 100) | 0;
room.keyId = uuidv4(); room.keyId = uuidv4();
// 将房间加入对应楼层数组 // 将房间加入对应楼层数组
if (floor > 0 && floor <= this.info.floor) { if (floor > 0 && floor <= this.info.floor) {
floors[floor - 1].push(this.handleColor(room)); floors[floor - 1].push(this.handleColor(room));
} }
}); });
// 对每层楼的房间进行排序 // 对每层楼的房间进行排序
floors.forEach((floorRooms) => { floors.forEach((floorRooms) => {
floorRooms.sort((a, b) => parseInt(a.name) - parseInt(b.name)); floorRooms.sort((a, b) => parseInt(a.name) - parseInt(b.name));
}); });
// 返回对象，键为楼层号（从1开始），值为对应的房间数组 return floors.reverse();
return floors; }
}, },
}, },
components: { components: {

610
src/views/components/xiaoqu/house.vue
Unescape View File

@ -1,193 +1,327 @@
<template> <template>
<transition> <div class="house-container" :style="{ width: handlerWidth }" v-show="show">
<div class="house-container" :style="{ width: handlerWidth }" v-show="show"> <transition>
<div class="house-header"> <div>
<div class="houser-data"> <div class="house-header">
<div class="house-main-row"> <div class="houser-data">
<div class="house-name"> <div class="house-main-row">
<span class="number-font">{{ houseItem.name }}</span> <div class="house-name">
室（共<span class="number-font"> {{ total }} </span>人） <span class="number-font">{{ houseItem.name }}</span>
</div> 室（共<span class="number-font"> {{ total }} </span>人）
<div class="house-type">{{ houseItem.typename }}</div> </div>
<ColorCell :item="houseItem" <div class="house-type">{{ houseData.typename }}</div>
><span class="house-color"> <ColorCell :item="houseData"
{{ houseItem.color }}</span ><span class="house-color">
></ColorCell {{ houseData.color }}</span
> ></ColorCell
<div >
class="house-is" <div
style="border: 1px solid #81204e; color: #e73388" class="house-is"
v-show="houseItem.isD == 1" style="border: 1px solid #81204e; color: #e73388"
> v-show="houseData.isD == 1"
中共党员 >
</div> 中共党员
<div </div>
class="house-is" <div
style="border: 1px solid #734700; color: #e09100" class="house-is"
v-show="houseItem.isK == 1" style="border: 1px solid #734700; color: #e09100"
> v-show="houseData.isK == 1"
帮扶对象 >
</div> 帮扶对象
<div </div>
class="house-is" <div
style="border: 1px solid #00694c; color: #00c185" class="house-is"
v-show="houseItem.isX == 1" style="border: 1px solid #00694c; color: #00c185"
> v-show="houseData.isX == 1"
重点人群 >
</div> 重点人群
<div </div>
class="house-is" <div
style="border: 1px solid #006382; color: #02b4e7" class="house-is"
v-show="houseItem.isJ == 1" style="border: 1px solid #006382; color: #02b4e7"
> v-show="houseData.isJ == 1"
退伍军人 >
退伍军人
</div>
</div> </div>
</div> <div class="btn-group">
<div class="btn-group"> <div class="btn-gather" v-show="houseData.color == 'NO'">
<div class="btn-gather" v-show="houseItem.color == 'NO'"> 确认空关
确认空关 </div>
<!-- <div class="btn-add"></div> -->
<imageButton size="small" @handlerClcik="addPerson()"
>添加居民</imageButton
>
<div class="btn-close" @click="handleClose()">关闭</div>
</div> </div>
<div class="btn-gather">房屋信息采集</div>
<div class="btn-add">添加居民</div>
<div class="btn-close" @click="handleClose()">关闭</div>
</div> </div>
<div class="house-address">公安地址：{{ houseData.address }}</div>
</div> </div>
<div class="house-address">公安地址：{{ houseItem.address }}</div> <div class="house-list" v-if="total > 0">
</div> <div class="list-item" v-for="item in list" :key="item.id">
<div class="house-list" v-if="total > 0"> <div class="person-icon">
<div class="list-item" v-for="item in list" :key="item.id"> <img :src="filterIcon(item.credentialNo)" alt="" />
<div class="person-icon"> <div class="person-name">{{ item.name }}</div>
<img :src="filterIcon(item.credentialNo)" alt="" />
<div class="person-name">{{ item.name }}</div>
</div>
<div class="person-data">
<div class="data-row">
<div class="row-item">
<div class="row-item-lable">
性別：{{ getGender(item.credentialNo) }}
</div>
<div class="row-item-value"></div>
</div>
<div class="row-item">
<div class="row-item-lable">身份证号：</div>
<div class="row-item-value">{{ item.credentialNo }}</div>
</div>
<div class="row-item">
<div class="row-item-lable">户籍：</div>
<div
class="row-item-value"
:style="{ color: item.type == 1 ? '#00C185' : '#E73388' }"
>
{{ item.typename }}
</div>
</div>
</div> </div>
<div class="data-row"> <div class="person-data">
<div class="row-item"> <div class="data-row">
<div class="row-item-lable">年龄：</div> <div class="row-item">
<div class="row-item-value"> <div class="row-item-lable">
{{ calculateAge(item.credentialNo) }}岁 性別：{{ getGender(item.credentialNo) }}
</div>
<div class="row-item-value"></div>
</div> </div>
</div> <div class="row-item">
<div class="row-item"> <div class="row-item-lable">身份证号：</div>
<div class="row-item-lable">手机号：</div> <div class="row-item-value">{{ item.credentialNo }}</div>
<div class="row-item-value">{{ item.phone }}</div> </div>
</div> <div class="row-item">
<div class="row-item"> <div class="row-item-lable">户籍：</div>
<div class="row-item-lable">分色：</div> <div
<div class="row-item-value"> class="row-item-value"
<ColorCell :item="item" size="small" :style="{ color: item.type == 1 ? '#00C185' : '#E73388' }"
><span class="house-color">
{{ item.color }}</span
></ColorCell
> >
{{ item.typename }}
</div>
</div> </div>
</div> </div>
</div> <div class="data-row">
<div class="data-row"> <div class="row-item">
<div class="row-item"> <div class="row-item-lable">年龄：</div>
<div class="row-item-lable">出生年月：</div> <div class="row-item-value">
<div class="row-item-value"> {{ calculateAge(item.credentialNo) }}岁
{{ extractBirthMonth(item.credentialNo) }} </div>
</div> </div>
</div> <div class="row-item">
<div class="row-item"> <div class="row-item-lable">手机号：</div>
<div class="row-item-lable">数据更新时间：</div> <div class="row-item-value">{{ item.phone }}</div>
<div class="row-item-value" style="color: #ffb82f">
{{ item.updateTime }}
</div> </div>
</div> <div class="row-item">
<div class="row-item"> <div class="row-item-lable">分色：</div>
<div class="row-item-lable">更新人员：</div> <div class="row-item-value">
<div class="row-item-value" style="color: #ffb82f"> <ColorCell :item="item" size="small"
{{ item.updateBy }} ><span class="house-color">
{{ item.color }}</span
></ColorCell
>
</div>
</div> </div>
</div> </div>
</div> <div class="data-row">
<div class="data-row last-row"> <div class="row-item">
<div class="is-list"> <div class="row-item-lable">出生年月：</div>
<div <div class="row-item-value">
class="house-is" {{ extractBirthMonth(item.credentialNo) }}
style="border: 1px solid #81204e; color: #e73388" </div>
v-show="item.isD == 1"
>
中共党员
</div>
<div
class="house-is"
style="border: 1px solid #734700; color: #e09100"
v-show="item.isK == 1"
>
帮扶对象
</div> </div>
<div <div class="row-item">
class="house-is" <div class="row-item-lable">数据更新时间：</div>
style="border: 1px solid #00694c; color: #00c185" <div class="row-item-value" style="color: #ffb82f">
v-show="item.isX == 1" {{ item.updateTime }}
> </div>
重点人群
</div> </div>
<div <div class="row-item">
class="house-is" <div class="row-item-lable">更新人员：</div>
style="border: 1px solid #006382; color: #02b4e7" <div class="row-item-value" style="color: #ffb82f">
v-show="item.isJ == 1" {{ item.updateBy }}
> </div>
退伍军人
</div> </div>
</div> </div>
<div class="row-btn"> <div class="data-row last-row">
<div>删除</div> <div class="is-list">
<div
<div>修改</div> class="house-is"
<div>设为户主</div> style="border: 1px solid #81204e; color: #e73388"
v-show="item.isD == 1"
>
中共党员
</div>
<div
class="house-is"
style="border: 1px solid #734700; color: #e09100"
v-show="item.isK == 1"
>
帮扶对象
</div>
<div
class="house-is"
style="border: 1px solid #00694c; color: #00c185"
v-show="item.isX == 1"
>
重点人群
</div>
<div
class="house-is"
style="border: 1px solid #006382; color: #02b4e7"
v-show="item.isJ == 1"
>
退伍军人
</div>
</div>
<div class="row-btn">
<imageButton @handlerClcik="delPerson(item.id)"
>删除</imageButton
>
<imageButton @handlerClcik="getPersonInfo(item.id)"
>修改</imageButton
>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="item-key" v-show="houseItem.holderId == item.id"> </div>
<span>户主</span> <div v-else class="no-data">
</div> <el-empty
:image="require('@/assets/images/ui/noData.png')"
description="暂无居民"
></el-empty>
</div> </div>
</div> </div>
<div v-else class="no-data"> </transition>
<el-empty <!-- 添加修改居民 -->
:image="require('@/assets/images/ui/noData.png')" <el-dialog
description="暂无居民" :visible.sync="open"
></el-empty> append-to-body
custom-class="taicang-dialog-small"
>
<div class="dialog-main">
<div class="dialog-title"><span></span> {{ title }}</div>
<el-form ref="form" :rules="rules" :model="form" label-position="top">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="姓名" prop="name">
<el-input v-model="form.name"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="人员类型">
<el-checkbox-group v-model="multiple">
<el-checkbox label="中共党员"></el-checkbox>
<el-checkbox label="帮扶对象"></el-checkbox>
<el-checkbox label="重点人群"></el-checkbox>
<el-checkbox label="退伍军人"></el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="身份证" prop="credentialNo">
<el-input v-model="form.credentialNo"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="工作单位">
<el-input v-model="form.workunit"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="手机号" prop="phone">
<el-input v-model="form.phone"></el-input>
</el-form-item>
</el-col>
<el-col :span="12"> </el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="户籍" prop="color">
<el-radio-group v-model="form.color">
<el-radio
:label="dict.value"
v-for="dict in dict.type.b_census_color_type"
:key="dict.value"
>{{ dict.value }}</el-radio
>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="流动" prop="color">
<el-radio-group v-model="form.color">
<el-radio
:label="dict.value"
v-for="dict in dict.type.b_flow_color_type"
:key="dict.value"
>{{ dict.value }}</el-radio
>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="备注">
<el-input type="textarea" v-model="form.remark"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="dialog-btn-group">
<imageButton size="small" @handlerClcik="confirm()"
>确 定</imageButton
>
<imageButton size="small">取 消</imageButton>
</div>
</el-form>
</div> </div>
</div> </el-dialog>
</transition> </div>
</template> </template>
<script> <script>
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import { getHouse } from "@/api/taicangpop/house.js"; import { getHouse } from "@/api/taicangpop/house.js";
import { listPerson } from "@/api/taicangpop/person.js"; import {
listPerson,
addPerson,
updatePerson,
delPerson,
getPerson,
} from "@/api/taicangpop/person.js";
import { pxToVw, handleColor } from "@/utils/myFuntion.js"; import { pxToVw, handleColor } from "@/utils/myFuntion.js";
import ColorCell from "@/components/ColorCell"; import ColorCell from "@/components/ColorCell";
export default { export default {
components: { ColorCell }, components: { ColorCell },
dicts: ["b_census_color_type", "b_flow_color_type"],
data() { data() {
return { return {
houseData: {},
form: {
name: undefined,
credentialNo: undefined,
workunit: undefined,
phone: undefined,
color: undefined,
remark: undefined,
isD: undefined,
isK: undefined,
isJ: undefined,
isX: undefined,
userId: undefined,
houseId: undefined,
buildingId: undefined,
deptId: undefined,
},
rules: {
name: [{ required: true, message: "名称不能为空", trigger: "blur" }],
credentialNo: [
{ required: true, message: "身份证不能为空", trigger: "blur" },
],
phone: [{ required: true, message: "手机号不能为空", trigger: "blur" }],
workunit: [
{
required: true,
message: "工作单位不能为空",
trigger: "change",
},
],
color: [{ required: true, message: "分色不能为空", trigger: "change" }],
},
multiple: [],
title: "",
open: false,
show: false, show: false,
total: 0, total: 0,
list: [], list: [],
@ -204,13 +338,98 @@ export default {
}, },
computed: { computed: {
...mapGetters(["houseItem", "queryParamsXiaoqu"]), ...mapGetters(["houseItem", "queryParamsXiaoqu", "userId"]),
handlerWidth() { handlerWidth() {
return pxToVw(this.houseItem.buildingWidth); return pxToVw(this.houseItem.buildingWidth);
}, },
}, },
created() {}, created() {},
methods: { methods: {
reset() {
this.form = {
id: null,
name: undefined,
credentialNo: undefined,
workunit: undefined,
phone: undefined,
color: undefined,
remark: undefined,
isD: undefined,
isK: undefined,
isJ: undefined,
isX: undefined,
userId: undefined,
houseId: undefined,
buildingId: undefined,
deptId: undefined,
};
this.multiple = [];
},
async getPersonInfo(id) {
let res = await getPerson(id);
this.reset();
this.title = "修改居民";
res.data.isD == "1" ? this.multiple.push("中共党员") : "";
res.data.isJ == "1" ? this.multiple.push("退伍军人") : "";
res.data.isK == "1" ? this.multiple.push("帮扶对象") : "";
res.data.isX == "1" ? this.multiple.push("重点人群") : "";
this.form = res.data;
this.open = true;
},
delPerson(ids) {
this.$modal
.confirm('是否确认删除居民管理编号为"' + ids + '"的数据项？')
.then(function () {
return delPerson(ids);
})
.then(() => {
this.getPersonList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
confirm() {
this.$refs["form"].validate((valid) => {
if (valid) {
this.form.isD = this.multiple.some((item) => item == "中共党员")
? 1
: 0;
this.form.isK = this.multiple.some((item) => item == "帮扶对象")
? 1
: 0;
this.form.isJ = this.multiple.some((item) => item == "退伍军人")
? 1
: 0;
this.form.isX = this.multiple.some((item) => item == "重点人群")
? 1
: 0;
if (this.form.id != null) {
updatePerson(this.form).then((response) => {
this.open = false;
this.getPersonList();
this.$modal.msgSuccess("修改成功");
});
} else {
this.form.userId = this.userId;
this.form.buildingId = this.houseItem.buildingId;
this.form.houseId = this.houseItem.id;
this.form.deptId = this.houseItem.deptId;
addPerson(this.form).then((res) => {
this.open = false;
this.getPersonList();
this.$modal.msgSuccess("新增成功");
});
}
}
});
},
addPerson() {
this.reset();
this.title = "添加居民";
this.open = true;
},
filterIcon(credentialNo) { filterIcon(credentialNo) {
let sex = this.getGender(credentialNo); let sex = this.getGender(credentialNo);
if (sex == "男") { if (sex == "男") {
@ -226,8 +445,12 @@ export default {
}, },
async getPersonList() { async getPersonList() {
let result = await getHouse(this.houseItem.id); let result = await getHouse(this.houseItem.id);
this.houseItem.holderId = result.data.holderId; //户主 this.houseData = handleColor([result.data])[0];
this.houseItem.address = result.data.address;
this.getList();
},
async getList() {
let res = await listPerson({ let res = await listPerson({
buildingId: this.houseItem.buildingId, buildingId: this.houseItem.buildingId,
houseId: this.houseItem.id, houseId: this.houseItem.id,
@ -351,15 +574,20 @@ div {
top: 75px; top: 75px;
left: 0; left: 0;
height: calc(100% - 75px); height: calc(100% - 75px);
display: flex;
overflow-y: auto; & > div {
background: #113666; height: 100%;
border: 1px solid #2d6cad; width: 100%;
border-right: 0px; display: flex;
display: flex; overflow-y: auto;
flex-direction: column; background: #113666;
box-sizing: border-box; border: 1px solid #2d6cad;
padding: 15px; border-right: 0px;
display: flex;
flex-direction: column;
box-sizing: border-box;
padding: 15px;
}
.house-header { .house-header {
.houser-data { .houser-data {
display: flex; display: flex;
@ -478,26 +706,11 @@ div {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.is-list > div {
margin-right: 10px;
}
.row-btn { .row-btn {
flex-direction: row-reverse; flex-direction: row-reverse;
}
& > div { .is-list > div {
cursor: pointer; margin-right: 10px;
color: #fff;
margin: 0 0 0 10px;
font-size: 14px;
background: url("~@/assets/images/ui/btn_1@2x.png");
background-size: 100% 100%;
padding: 3px 15px;
}
& > div:last-child {
background: url("~@/assets/images/ui/tab1.png");
background-size: 100% 100%;
}
} }
} }
.house-is { .house-is {
@ -567,4 +780,31 @@ div {
::-webkit-scrollbar-track { ::-webkit-scrollbar-track {
background: transparent; background: transparent;
} }
::v-deep .el-form-item__label {
color: #7ff7ff;
}
::v-deep .el-form-item__content {
background: #162841;
}
::v-deep .el-checkbox-group {
padding-left: 10px;
.el-checkbox__label {
padding-left: 3px;
color: #aabace;
}
.el-checkbox {
margin-right: 12px;
}
}
::v-deep .el-radio-group {
padding-left: 10px;
.el-radio__label {
padding-left: 3px;
color: #aabace;
}
.el-radio {
margin-right: 12px;
}
}
</style> </style>

13
src/views/components/xiaoqu/map/index.vue
Unescape View File

@ -73,13 +73,13 @@ export default {
mapLoad(map) { mapLoad(map) {
let _this = this; let _this = this;
this.map = map; this.map = map;
map.setSceneOptions({
map.centerAt(this.config.viewHome, { center: this.config.viewHome,
complete: function () { });
//加载图层数据 this.map.on(mars3d.EventType.load, () => {
_this.addMapLayer(); this.addMapLayer();
},
}); });
map.on(mars3d.EventType.click, function (e) { map.on(mars3d.EventType.click, function (e) {
if (!e.id) { if (!e.id) {
if (_this.geoJsonLayerDTH && _this.geoJsonLayerDTH.length > 0) if (_this.geoJsonLayerDTH && _this.geoJsonLayerDTH.length > 0)
@ -118,7 +118,6 @@ export default {
) { ) {
this.addGardenLayer(); this.addGardenLayer();
} }
this.addbuildingLayer(); this.addbuildingLayer();
}, },
//商铺面 //商铺面

11
src/views/components/xiaoqu/rightData/realTimeList.vue
Unescape View File

@ -105,10 +105,10 @@ export default {
if (process.env.NODE_ENV === "development") return; if (process.env.NODE_ENV === "development") return;
this.timer = setInterval(() => { this.timer = setInterval(() => {
if (this.items.length > 1000) { // if (this.items.length > 1000) {
//考虑dom太多影响到性能,每十秒删除后面100条数据,最后保留一千条 // //考虑dom太多影响到性能,每十秒删除后面100条数据,最后保留一千条
this.items.splice(-100); // this.items.splice(-100);
} // }
this.getList(true); this.getList(true);
}, 10000); }, 10000);
}, },
@ -130,7 +130,8 @@ export default {
}, 500 * index); }, 500 * index);
}); });
} else { } else {
this.items = res.data.list; // this.items = res.data.list;
this.items = res.data.list.slice(0, 100);
} }
this.totalData.houseCount = this.totalData.houseCount =
this.totalData.houseCount + res.data.houseCount; this.totalData.houseCount + res.data.houseCount;

9
src/views/index.vue
Unescape View File

@ -152,6 +152,15 @@ export default {
let _this = this; let _this = this;
this.map = map; this.map = map;
map.setSceneOptions({
cameraController: {
// enableZoom: false,
// enableTranslate: true,
// enableRotate: false,
enableTilt: false,
},
});
map.on(mars3d.EventType.wheel, function (e) { map.on(mars3d.EventType.wheel, function (e) {
_this.zoomChange(); _this.zoomChange();
}); });

22
src/views/login.vue
Unescape View File

@ -207,7 +207,7 @@ export default {
margin: 0px auto 30px auto; margin: 0px auto 30px auto;
text-align: center; text-align: center;
color: #00d8ff; color: #00d8ff;
font-size: 30px; font-size: 25px;
font-family: "xiniu"; font-family: "xiniu";
} }
@ -215,26 +215,26 @@ export default {
border-radius: 6px; border-radius: 6px;
background-image: url("../assets/images/ui/img_frame.png"); background-image: url("../assets/images/ui/img_frame.png");
background-size: 100% 100%; background-size: 100% 100%;
width: 500px; width: 450px;
padding: 30px 35px 5px 35px; padding: 30px 35px 5px 35px;
.el-input { .el-input {
height: 50px; height: 45px;
input { input {
height: 50px; height: 45px;
font-size: 18px; font-size: 16px;
color: #d8dde6; color: #d8dde6;
font-family: "Alibaba-PuHuiTi-Regular.otf"; font-family: "Alibaba-PuHuiTi-Regular.otf";
background: rgba(9, 27, 52, 0.2); background: rgba(9, 27, 52, 0.2);
border-color: #1489cc; border-color: #1489cc;
} }
input::placeholder { input::placeholder {
font-size: 18px; font-size: 16px;
} }
} }
.input-icon { .input-icon {
height: 50px; height: 45px;
width: 18px; width: 16px;
margin-left: 2px; margin-left: 2px;
color: #1adcff; color: #1adcff;
} }
@ -243,7 +243,7 @@ export default {
color: #d8dde6; color: #d8dde6;
} }
.logo-btn { .logo-btn {
height: 50px; height: 45px;
background: linear-gradient( background: linear-gradient(
0deg, 0deg,
rgba(7, 39, 64, 0.9) 0%, rgba(7, 39, 64, 0.9) 0%,
@ -268,10 +268,10 @@ export default {
.login-code { .login-code {
width: 33%; width: 33%;
height: 50px; height: 45px;
float: right; float: right;
img { img {
height: 50px; height: 100%;
width: 100%; width: 100%;
cursor: pointer; cursor: pointer;
vertical-align: middle; vertical-align: middle;

Write Preview
Loading…
Cancel
Save