kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

目录代码整合

Browse Source
This commit is contained in:
aixianling
2022-05-10 20:02:37 +08:00
parent 71049f7f65
commit 036ee91533
324 changed files with 4 additions and 8321 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
packages/grid/AppHomesteadManagement/AppHomesteadManagement.vue Normal file
View File

@@ -0,0 +1,61 @@
<template>
<div class="AppHomesteadManagement">
<keep-alive :include="['List']">
<component ref="component" :is="component" @change="onChange" :params="params" :instance="instance" :dict="dict"></component>
</keep-alive>
</div>
</template>
<script>
import List from './components/List'
import Add from './components/Add'
export default {
label: '宅基地管理',
name: 'AppHomesteadManagement',
props: {
instance: Function,
dict: Object,
},
data() {
return {
component: 'List',
params: {},
include: [],
}
},
components: {
Add,
List,
},
methods: {
onChange(data) {
if (data.type === 'add') {
this.component = 'Add'
this.params = data.params
}
if (data.type == 'list') {
this.component = 'List'
this.params = data.params
this.$nextTick(() => {
if (data.isRefresh) {
this.$refs.component.getList()
}
})
}
},
},
}
</script>
<style lang="scss">
.AppHomesteadManagement {
height: 100%;
background: #f3f6f9;
overflow: auto;
}
</style>

475
packages/grid/AppHomesteadManagement/components/Add.vue Normal file
View File

@@ -0,0 +1,475 @@
<template>
<section style="height: 100%" class="AppHomesteadManagement">
<ai-detail class="Add">
<!-- 返回按钮 -->
<template #title>
<ai-title :title="isEdit ? '编辑宅基地信息' : '添加宅基地'" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
</template>
<template #content>
<el-form :model="formData" :rules="formRules" ref="ruleForm" label-width="150px" label-suffix="：" align-items="center">
<ai-card title="户主信息" >
<template slot="content">
<div class="flex">
<el-form-item label="姓名" prop="name">
<el-input size="small" class="user-selecter" v-model="formData.name" placeholder="请输入" clearable>
<template slot="append">
<ai-person-select :instance="instance" @selectPerson="checkName">
</ai-person-select>
</template>
</el-input>
</el-form-item>
<el-form-item label="身份证号码" prop="idNumber">
<ai-id size="small" v-model="formData.idNumber" @change="IdCard(formData.idNumber)"/>
</el-form-item>
<el-form-item label="性别" prop="sex">
<ai-select v-model="formData.sex" placeholder="请选择" :selectList="dict.getDict('sex')" disabled />
</el-form-item>
<el-form-item label="年龄" prop="age">
<el-input size="small" v-model="formData.age" placeholder="请输入" clearable disabled></el-input>
</el-form-item>
<el-form-item label="联系电话">
<el-input size="small" v-model="formData.phone" placeholder="请输入" clearable :maxlength="20"></el-input>
</el-form-item>
</div>
<el-form-item label="所属村" prop="areaId">
<ai-area-get :instance="instance" v-model="formData.areaId" :name.sync="formData.areaName" />
</el-form-item>
</template>
</ai-card>
<ai-card title="宅基地情况" >
<template slot="content">
<div class="flex">
<el-form-item label="宅基地面积">
<el-input size="small" v-model="formData.homesteadArea" placeholder="请输入" clearable maxlength="10">
<template slot="append">m²</template>
</el-input>
</el-form-item>
<el-form-item label="房基占地面积">
<el-input size="small" v-model="formData.houseArea" placeholder="请输入" clearable maxlength="10">
<template slot="append">m²</template>
</el-input>
</el-form-item>
</div>
<el-form-item label="宅基地地址">
<el-input size="small" v-model="formData.homesteadAddress" placeholder="请输入" clearable maxlength="20"></el-input>
</el-form-item>
<div class="flex">
<el-form-item label="四至-东至">
<el-input size="small" v-model="formData.eastTo" placeholder="请输入" clearable maxlength="20"></el-input>
</el-form-item>
<el-form-item label="四至-南至">
<el-input size="small" v-model="formData.southTo" placeholder="请输入" clearable maxlength="20"></el-input>
</el-form-item>
<el-form-item label="四至-西至">
<el-input size="small" v-model="formData.westTo" placeholder="请输入" clearable maxlength="20"></el-input>
</el-form-item>
<el-form-item label="四至-北至">
<el-input size="small" v-model="formData.northTo" placeholder="请输入" clearable maxlength="20"></el-input>
</el-form-item>
</div>
<el-form-item label="地类" class="buildingTypes">
<el-radio-group v-model="formData.landType">
<el-radio :label="item.dictValue" v-for="(item, index) in dict.getDict('homesteadLandType')" :key="index">{{item.dictName}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="性质" class="buildingTypes">
<el-radio-group v-model="formData.houseType">
<el-radio :label="item.dictValue" v-for="(item, index) in dict.getDict('homesteadHouseType')" :key="index">{{item.dictName}}</el-radio>
</el-radio-group>
</el-form-item>
<div class="flex">
<el-form-item label="住宅建筑面积">
<el-input size="small" v-model="formData.liveBuildingArea" placeholder="请输入" clearable maxlength="10">
<template slot="append">m²</template>
</el-input>
</el-form-item>
<el-form-item label="建筑层数">
<el-input size="small" v-model="formData.buildingFloorNumber" placeholder="请输入" clearable maxlength="10">
<template slot="append">层</template>
</el-input>
</el-form-item>
<el-form-item label="建筑高度">
<el-input size="small" v-model="formData.buildingHeight" placeholder="请输入" clearable maxlength="10">
<template slot="append">m</template>
</el-input>
</el-form-item>
</div>
</template>
</ai-card>
<ai-card title="位置信息" >
<template slot="content">
<div class="flex">
<el-form-item label="楼栋经度">
<el-input size="small" v-model="formData.lng" placeholder="请输入" clearable maxlength="10"></el-input>
</el-form-item>
<el-form-item label="楼栋纬度">
<el-input size="small" v-model="formData.lat" placeholder="请输入" clearable maxlength="10"></el-input>
</el-form-item>
</div>
<el-form-item label="地图位置">
<el-button @click="showMap = true">地图标绘</el-button>
</el-form-item>
</template>
</ai-card>
</el-form>
</template>
<!-- 底部按钮 -->
<template #footer>
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="confirm()">提交</el-button>
</template>
</ai-detail>
<ai-dialog title="地图" :visible.sync="showMap" @opened="getCorpLocation" width="800px" class="mapDialog" @onConfirm="selectMap">
<div id="map"></div>
<el-form label-width="80px" style="padding: 10px 20px 0 20px;">
<el-row type="flex" justify="space-between">
<el-form-item label="经度">
<el-input disabled size="small" v-model="placeDetail.lng"></el-input>
</el-form-item>
<el-form-item label="纬度">
<el-input disabled size="small" v-model="placeDetail.lat"></el-input>
</el-form-item>
</el-row>
</el-form>
<el-input id="searchPlaceInput" size="medium" class="searchPlaceInput" clearable v-model="searchPlace" autocomplete="on" @change="placeSearch.search(searchPlace)" placeholder="请输入关键字">
<el-button type="primary" slot="append" @click="placeSearch.search(searchPlace)">搜索</el-button>
</el-input>
<div id="searchPlaceOutput" />
</ai-dialog>
</section>
</template>
<script>
import { mapState } from 'vuex'
import AMapLoader from '@amap/amap-jsapi-loader'
export default {
name: 'Add',
props: {
dict: Object,
params: Object,
instance: Function,
},
data() {
return {
formData: {
name: '',
idNumber: '',
age: '',
sex: '',
phone: '',
areaId: '',
homesteadArea: '',
houseArea: '',
homesteadAddress: '',
eastTo: '',
southTo: '',
westTo: '',
northTo: '',
landType: '0',
houseType: '0',
liveBuildingArea: '',
buildingFloorNumber: '',
buildingHeight: '',
lng: '',
lat: '',
id: '',
areaName: ''
},
formRules: {
name: [
{ required: true, message: '请选择人员', trigger: 'change' },
],
age: [
{ required: true, message: '请输入年龄', trigger: 'change' },
],
sex: [
{ required: true, message: '请选择性别', trigger: 'change' },
],
idNumber: [
{ required: true, message: '请输入身份证号码', trigger: 'change' },
],
areaId: [
{ required: true, message: '请选择所属村', trigger: 'change' },
]
},
map: null,
placeDetail: {
lng: '',
lat: '',
},
showMap: false,
searchPlace: '',
}
},
computed: {
...mapState(['user']),
isEdit() {
return !!this.params.id
},
},
mounted() {
this.dict.load('homesteadLocationStatus', 'homesteadHouseType', 'homesteadLandType', 'sex').then(() => {
if(this.params.id) {
this.getListinfo()
}
})
},
methods: {
checkName(e) {
this.formData.name = e.name
this.formData.idNumber = e.idNumber
this.formData.phone = e.phone
this.formData.areaId = e.householdAreaId
},
IdCard(UUserCard) {
if (UUserCard) {
let arr = [];
if (parseInt(UUserCard.substr(16, 1)) % 2 == 1) {
arr.push("1");
} else {
arr.push("0");
}
const myDate = new Date();
const month = myDate.getMonth() + 1;
const day = myDate.getDate();
let age = myDate.getFullYear() - UUserCard.substring(6, 10) - 1;
if (
UUserCard.substring(10, 12) < month ||
(UUserCard.substring(10, 12) == month &&
UUserCard.substring(12, 14) <= day)
) {
age++;
}
arr.push(age);
this.formData.sex = arr[0];
this.formData.age = arr[1];
}
},
decimalInput(name) {
if(!/^(([1-9]{1}\d*)|(0{1}))(\.\d{1,2})?$/g.test(this.formData[name])){
this.formData[name] = ''
return this.$message.error('最多只保留两位小数点')
}
},
numberInput(name) {
if(!/^[1-9]\d*|0$/g.test(this.formData[name])){
this.formData[name] = ''
return this.$message.error('请输入正整数')
}
},
selectMap() {
this.formData.lng = this.placeDetail.lng
this.formData.lat = this.placeDetail.lat
this.showMap = false
},
getCorpLocation() {
this.instance.post('/app/appdvcpconfig/getCorpLocation').then((res) => {
if (res.code == 0) {
this.initMap(res.data)
}
})
},
initMap({ lng, lat }) {
AMapLoader.load({
key: 'b553334ba34f7ac3cd09df9bc8b539dc',
version: '2.0',
plugins: ['AMap.PlaceSearch', 'AMap.AutoComplete', 'AMap.Geocoder'],
}).then((AMap) => {
this.placeDetail.lng = this.formData.lng
this.placeDetail.lat = this.formData.lat
this.map = new AMap.Map('map', {
resizeEnable: true,
zooms: [6, 20],
center: [lng, lat],
zoom: 11,
})
this.placeSearch = new AMap.PlaceSearch({ map: this.map })
new AMap.AutoComplete({
input: 'searchPlaceInput',
output: 'searchPlaceOutput',
}).on('select', (e) => {
if (e?.poi) {
this.placeSearch.setCity(e.poi.adcode)
this.movePosition(e.poi.location)
}
})
this.map.on('click', (e) => {
new AMap.Geocoder().getAddress(e.lnglat, (sta, res) => {
if (res?.regeocode) {
this.placeDetail = {
lng: e.lnglat?.lng,
lat: e.lnglat?.lat,
address: res.regeocode.formattedAddress,
}
}
})
this.movePosition(e.lnglat)
})
})
},
movePosition(center) {
if (this.map) {
this.map.clearMap()
this.map.panTo(center)
this.map.add([
new AMap.Marker({
position: center,
clickable: true,
}),
])
this.map.setFitView()
}
},
getListinfo() {
return this.instance
.post('/app/apphomesteadinfo/queryDetailById', null, {
params: {
id: this.params.id,
},
})
.then((res) => {
if (res.data) {
this.formData = res.data
}
})
},
confirm() {
this.$refs['ruleForm'].validate((valid) => {
if (valid) {
this.instance
.post(`/app/apphomesteadinfo/addOrUpdate`, {
...this.formData,
})
.then((res) => {
if (res.code == 0) {
this.$message.success('提交成功')
setTimeout(() => {
this.cancel(true)
}, 1000)
}
})
}
})
},
// 返回按钮
cancel(isRefresh) {
this.$emit('change', {
type: 'list',
isRefresh: !!isRefresh,
})
},
},
watch: {
communityNameContent: {
deep: true,
},
},
}
</script>
<style lang="scss" scoped>
.AppHomesteadManagement {
::v-deep .amap-logo {
display: none!important;
}
::v-deep .amap-copyright {
display: none!important;
}
}
.Add {
height: 100%;
.ai-detail__title {
background-color: #fff;
}
.ai-detail__content {
.ai-detail__content--wrapper {
.el-form {
// background-color: #fff;
// padding: 0 60px;
.flex {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.el-form-item {
width: 48%;
}
.buildingTypes {
width: 100%;
}
}
}
}
}
.user-selecter {
::v-deep .el-input-group__append {
width: 68px;
background: transparent;
}
::v-deep .el-button {
color: #fff;
&:hover {
opacity: 0.8;
background: linear-gradient(90deg, #299FFF 0%, #0C61FF 100%);
}
}
}
}
::v-deep .mapDialog {
.el-dialog__body {
padding: 0;
.ai-dialog__content {
padding: 0;
}
.ai-dialog__content--wrapper {
padding: 0 !important;
position: relative;
}
#map {
width: 100%;
height: 420px;
}
.searchPlaceInput {
position: absolute;
width: 250px;
top: 30px;
left: 25px;
}
#searchPlaceOutput {
position: absolute;
width: 250px;
left: 25px;
height: initial;
top: 80px;
background: white;
z-index: 250;
max-height: 300px;
overflow-y: auto;
.auto-item {
text-align: left;
font-size: 14px;
padding: 8px;
box-sizing: border-box;
}
}
}
}
</style>

204
packages/grid/AppHomesteadManagement/components/List.vue Normal file
View File

@@ -0,0 +1,204 @@
<template>
<section class="AppPetitionManage">
<ai-list>
<!-- 标题 -->
<ai-title slot="title" title="宅基地管理" isShowBottomBorder isShowArea v-model="areaId" :instance="instance" @change="page.current=1,getList()"/>
<template #content>
<ai-search-bar bottomBorder>
<template slot="left">
<!-- 定位状态 -->
<ai-select v-model="search.locationStatus" placeholder="定位状态" clearable :selectList="$dict.getDict('homesteadLocationStatus')" @change=";(page.current = 1), getList()"></ai-select>
</template>
<!-- 搜索 -->
<template slot="right">
<el-input v-model="search.name" size="small"
v-throttle="() => {page.current = 1, getList()}" placeholder="户主/联系电话" clearable @clear=";(page.current = 1), (search.name = ''), getList()" suffix-icon="iconfont iconSearch" />
</template>
</ai-search-bar>
<ai-search-bar class="ai-search-ba mar-t10">
<template slot="left">
<el-button icon="iconfont iconAdd" type="primary" size="small" @click="onAdd('')">添加 </el-button>
<el-button icon="iconfont iconDelete" size="small" @click="removeAll" :disabled="ids.length == 0">删除 </el-button>
</template>
<!-- 导入导出 -->
<template #right>
<ai-import :instance="instance" :dict="dict" type="apphomesteadinfo" :importParams="{ areaId: user.info && user.info.areaId }" name="宅基地管理" @success="getList()">
<el-button icon="iconfont iconImport">导入</el-button>
</ai-import>
<ai-download :instance="instance" url="/app/apphomesteadinfo/export" :params="param" fileName="宅基地管理模板" :disabled="tableData.length == 0">
<el-button icon="iconfont iconExported" :disabled="tableData.length == 0">导出</el-button>
</ai-download>
</template>
</ai-search-bar>
<ai-table :tableData="tableData" :col-configs="colConfigs" :total="total" ref="aitableex" :current.sync="page.current" :size.sync="page.size" @getList="getList" @selection-change="(v) => (ids = v.map((e) => e.id))">
<el-table-column slot="locationStatus" label="定位状态" align="center">
<template slot-scope="{ row }">
<span style="color:red" v-if="row.locationStatus == 0">{{ dict.getLabel('homesteadLocationStatus', row.locationStatus) }}</span>
<span style="color:green" v-if="row.locationStatus == 1">{{ dict.getLabel('homesteadLocationStatus', row.locationStatus) }}</span>
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" width="180" fixed="right">
<template slot-scope="{ row }">
<el-button type="text" @click="onAdd(row.id)">编辑</el-button>
<el-button type="text" @click="remove(row.id)">删除</el-button>
</template>
</el-table-column>
</ai-table>
</template>
</ai-list>
</section>
</template>
<script>
import { mapState } from 'vuex'
export default {
name: 'List',
props: {
dict: Object,
instance: Function,
params: Object,
},
data() {
return {
isAdd: false,
page: {
current: 1,
size: 10,
},
total: 0,
search: {
locationStatus: '',
name: '',
},
id: '',
ids: [],
colConfigs: [
{ type: 'selection', width: 100, align: 'center'},
{
prop: 'areaName',
label: '村/社区',
},
{
prop: 'name',
label: '户主',
align: 'center',
},
{ prop: 'phone', label: '联系电话', align: 'center' },
{
prop: 'sex',
label: '性别',
width: '100',
align: 'center',
render: (h, { row }) => {
return h('span', null, this.dict.getLabel('sex', row.sex))
},
},
{ prop: 'age', label: '年龄', align: 'center' },
{
prop: 'idNumber',
label: '身份证号',
align: 'center',
},
{ prop: 'liveBuildingArea', label: '建筑面积(m²)', align: 'center',width: 120 },
{
slot: 'locationStatus'
},
{
slot: 'options',
label: '操作',
align: 'center',
},
],
tableData: [],
areaId: '',
}
},
computed: {
...mapState(['user']),
param() {
return {
...this.search,
areaId: this.user.info?.areaId,
ids: this.ids,
}
},
},
mounted() {
this.areaId = this.user.info.areaId
this.dict.load('homesteadLocationStatus', 'homesteadHouseType', 'homesteadLandType', 'sex').then(() => {
this.getList()
})
},
methods: {
getList() {
this.instance
.post(`/app/apphomesteadinfo/list`, null, {
params: {
...this.page,
...this.search,
areaId: this.areaId,
},
})
.then((res) => {
if (res.code == 0) {
if(res.data.records.length) {
res.data.records.map((item) => {
item.idNumber = item.idNumber.substring(0,10) + '****' + item.idNumber.substring(13,17)
})
}
this.tableData = res.data.records
this.total = res.data.total
}
})
},
// 添加
onAdd(id) {
this.$emit('change', {
type: 'add',
params: {
id: id || '',
areaId: this.areaId,
},
})
},
// 删除
remove(id) {
this.$confirm('确定删除该数据?').then(() => {
this.instance.post(`/app/apphomesteadinfo/delete?ids=${id}`).then((res) => {
if (res.code == 0) {
this.$message.success('删除成功！')
this.getList()
}
})
})
},
removeAll() {
var id = this.ids.join(',')
this.remove(id)
},
},
}
</script>
<style lang="scss" scoped>
.AppPetitionManage {
height: 100%;
.mar-t10{
margin-top: 10px;
}
}
</style>