户籍管理对接接口
This commit is contained in:
du
parent
8718413202
commit
690d422cb7
|
|
@ -10,14 +10,19 @@ VITE_APP_DEBUG_TOOL = false
|
|||
VITE_OPEN_PROXY = false
|
||||
|
||||
VITE_PROXY_API = /dev-api
|
||||
|
||||
# http://42.193.40.239:8017/doc.html//线上 http://192.168.110.186:8017/doc.html//本地
|
||||
|
||||
VITE_PROXY = [ ["/dev-api", "http://42.193.40.239:8017" ],["/dev-img-api", "http://file.sczysoft.com" ]]
|
||||
# 线上
|
||||
# VITE_PROXY = [ ["/dev-api", "http://42.193.40.239:8017" ],["/dev-img-api", "http://file.sczysoft.com" ]]
|
||||
# VITE_UPLOAD_URL = http://42.193.40.239:8888
|
||||
# 东哥
|
||||
# VITE_PROXY = [ ["/dev-api", "http://192.168.110.186:8017" ],["/dev-img-api", "http://file.sczysoft.com" ]]
|
||||
# VITE_UPLOAD_URL = http://192.168.110.186
|
||||
# 陈游
|
||||
VITE_PROXY = [ ["/dev-api", "http://192.168.110.10:8017" ],["/dev-img-api", "http://file.sczysoft.com" ]]
|
||||
VITE_UPLOAD_URL = http://192.168.110.10
|
||||
#
|
||||
VITE_GLOB_UPLOAD_URL=/dev-api
|
||||
VITE_UPLOAD_IMG_URL=/dev-img-api
|
||||
# VITE_UPLOAD_URL = http://192.168.110.186
|
||||
VITE_UPLOAD_URL = http://42.193.40.239:8888
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@
|
|||
"preinstall": "npx only-allow pnpm"
|
||||
},
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
"@element-plus/icons-vue": "^2.0.9",
|
||||
"@nodelib/fs.scandir": "^2.1.5",
|
||||
"@tinymce/tinymce-vue": "^5.0.0",
|
||||
|
|
@ -39,7 +40,8 @@
|
|||
"tinymce": "^6.1.2",
|
||||
"vue": "^3.2.38",
|
||||
"vue-quill-editor": "^3.0.6",
|
||||
"vue-router": "^4.1.3"
|
||||
"vue-router": "^4.1.3",
|
||||
"vue3-tree-org": "^4.2.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@iconify-json/ep": "^1.1.7",
|
||||
|
|
|
|||
9466
pnpm-lock.yaml
9466
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
|
@ -20,4 +20,54 @@ import request from "@/utils/request";
|
|||
method: "POST",
|
||||
data: params
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
*户籍管理-户籍列表分页
|
||||
*/
|
||||
export function domicilePage(params) {
|
||||
return request({
|
||||
url: `/admin/people/domicilePage`,
|
||||
method: "GET",
|
||||
params: params
|
||||
});
|
||||
}
|
||||
/**
|
||||
*户籍管理-户籍新增或者修改
|
||||
*/
|
||||
export function domicileAdd(params) {
|
||||
return request({
|
||||
url: `/admin/people/domicileAdd`,
|
||||
method: "POST",
|
||||
data: params
|
||||
});
|
||||
}
|
||||
/**
|
||||
*户籍管理-户籍人员删除
|
||||
*/
|
||||
export function domicileDel(params) {
|
||||
return request({
|
||||
url: `/admin/people/domicileDel/${params.domicileId}`,
|
||||
method: "DELETE",
|
||||
});
|
||||
}
|
||||
/**
|
||||
*户籍管理-户籍人员注销
|
||||
*/
|
||||
export function domicileCancel(params) {
|
||||
return request({
|
||||
url: `/admin/people/domicileCancel`,
|
||||
method: "PUT",
|
||||
data:params
|
||||
});
|
||||
}
|
||||
/**
|
||||
*户籍管理-户籍人员详情信息
|
||||
*/
|
||||
export function domicileDetail(params) {
|
||||
return request({
|
||||
url: `/admin/people/domicileDetail/${params.domicileId}`,
|
||||
method: "GET",
|
||||
});
|
||||
}
|
||||
BIN
src/assets/images/map-marker.png
Normal file
BIN
src/assets/images/map-marker.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
83
src/components/Map/index.vue
Normal file
83
src/components/Map/index.vue
Normal file
|
|
@ -0,0 +1,83 @@
|
|||
<template>
|
||||
<div ref="cont" id="container" :style="{ minHeight: height }"></div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { onMounted, onUnmounted } from "vue";
|
||||
import AMapLoader from "@amap/amap-jsapi-loader";
|
||||
const emits = defineEmits(["change"]);
|
||||
|
||||
const props = defineProps({
|
||||
height: {
|
||||
type: String,
|
||||
default: "300px",
|
||||
},
|
||||
longlat:{
|
||||
type: Array,
|
||||
default:[]
|
||||
}
|
||||
});
|
||||
const cont = ref()
|
||||
let map = null;
|
||||
import screen from "@/assets/images/map-marker.png";
|
||||
onMounted(() => {
|
||||
AMapLoader.load({
|
||||
key: "aac67e887720702832e1d61624ad9ee9", // 申请好的Web端开发者Key，首次调用 load 时必填
|
||||
version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
|
||||
plugins: [], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
|
||||
AMapUI: {
|
||||
version: "1.1", // AMapUI 缺省 1.1
|
||||
plugins: [], // 需要加载的 AMapUI ui插件
|
||||
},
|
||||
})
|
||||
.then((AMap) => {
|
||||
console.log();
|
||||
map = new AMap.Map("container", {
|
||||
// 设置地图容器id
|
||||
viewMode: "3D", // 是否为3D地图模式
|
||||
zoom: 12, // 初始化地图级别
|
||||
center: props.longlat?props.longlat:[101.13, 30.98], // 初始化地图中心点位置
|
||||
});
|
||||
console.log(11);
|
||||
console.log(cont.value.offsetWidth,cont.value.offsetHeight,'this.$refs.cont===>');
|
||||
var marker = new AMap.Marker({
|
||||
// position: [101.13, 30.98],
|
||||
imageSize: new AMap.Size(10, 10),
|
||||
icon: new AMap.Icon({
|
||||
image: screen,
|
||||
size: new AMap.Size(28, 28), //图标所处区域大小
|
||||
imageSize: new AMap.Size(28, 28), //图标大小
|
||||
}),
|
||||
offset: [(cont.value.offsetWidth/2-20), (cont.value.offsetHeight/2-20)],
|
||||
draggable: true,
|
||||
});
|
||||
map.add(marker);
|
||||
map.on("moveend", function (e) {
|
||||
var center = map.getCenter();
|
||||
// emits("change", [e.lnglat.lng, e.lnglat.lat]);
|
||||
emits("change", [center.lng, center.lat]);
|
||||
});
|
||||
})
|
||||
.catch((e) => {
|
||||
console.log(e);
|
||||
});
|
||||
});
|
||||
|
||||
onUnmounted(() => {
|
||||
map?.destroy();
|
||||
});
|
||||
watch(
|
||||
() => props.longlat,
|
||||
(val) => {
|
||||
console.log(val,'val==>');
|
||||
console.log(map,'map==>');
|
||||
map.setCenter(val)
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#container {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,7 +1,11 @@
|
|||
import { createApp } from "vue";
|
||||
import vue3TreeOrg from 'vue3-tree-org';
|
||||
import 'vue3-tree-org/lib/vue3-tree-org.css';
|
||||
import App from "./App.vue";
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.use(vue3TreeOrg);
|
||||
import pinia from "./store";
|
||||
app.use(pinia);
|
||||
|
||||
|
|
@ -38,4 +42,5 @@ if (useSettingsStore().app.iconifyOfflineUse) {
|
|||
// 全局样式
|
||||
import "@/assets/styles/globals.scss";
|
||||
|
||||
|
||||
app.mount("#app");
|
||||
|
|
|
|||
|
|
@ -32,17 +32,17 @@ export default {
|
|||
breadcrumb: true, //是否显示面包屑
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'residence',
|
||||
name: 'residence',
|
||||
component: () => import('@/views/base-manage/population/index.vue'),
|
||||
meta: {
|
||||
icon: 'point',
|
||||
auth: "emer.resourse",
|
||||
title: '人口管理',
|
||||
breadcrumb: true, //是否显示面包屑
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: 'residence',
|
||||
// name: 'residence',
|
||||
// component: () => import('@/views/base-manage/population/index.vue'),
|
||||
// meta: {
|
||||
// icon: 'point',
|
||||
// auth: "emer.resourse",
|
||||
// title: '人口管理',
|
||||
// breadcrumb: true, //是否显示面包屑
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: 'poor',
|
||||
name: 'poor',
|
||||
|
|
|
|||
|
|
@ -114,6 +114,17 @@ export default {
|
|||
title: '指挥体系',
|
||||
breadcrumb: true, //是否显示面包屑
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'address',
|
||||
name: 'address',
|
||||
component: () => import('@/views/emergency/address-book/index.vue'),
|
||||
meta: {
|
||||
icon: 'point',
|
||||
auth: "emer.address",
|
||||
title: '应急通讯录',
|
||||
breadcrumb: true, //是否显示面包屑
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -6,6 +6,7 @@
|
|||
width="50%"
|
||||
@onSubmit="handleSubmit"
|
||||
:footerclosed="true"
|
||||
:footerkeepnaem="readonly?false:true"
|
||||
:diafooter="true"
|
||||
>
|
||||
<div class="detailForm-content">
|
||||
|
|
@ -16,36 +17,143 @@
|
|||
:model="formData"
|
||||
class="center-form"
|
||||
>
|
||||
<el-form-item label="姓名" prop="sortId">
|
||||
<el-input placeholder="请输入" type="input" v-model="formData.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="户籍" prop="sortId">
|
||||
<el-input placeholder="请输入" type="input" v-model="formData.loc" />
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="sortId">
|
||||
<el-date-picker placeholder="请选择" v-model="formData.birth" />
|
||||
<el-form-item label="姓名" prop="name">
|
||||
<el-input :disabled="readonly" placeholder="请输入" type="input" v-model="formData.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="sortId">
|
||||
<el-select placeholder="请选择" v-model="formData.sex">
|
||||
<el-option label="男" value="女">男</el-option>
|
||||
<el-option label="女" value="女">女</el-option>
|
||||
<el-select :disabled="readonly" placeholder="请选择" v-model="formData.sex">
|
||||
<el-option label="男" :value="1">男</el-option>
|
||||
<el-option label="女" :value="0">女</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="户籍成员" prop="sortId" style="width: 94%">
|
||||
<el-input
|
||||
placeholder="请输入"
|
||||
type="input"
|
||||
v-model="formData.member"
|
||||
<el-form-item prop="areaCode" label="所属区域">
|
||||
<el-cascader
|
||||
:disabled="readonly"
|
||||
ref="cascader"
|
||||
v-model="formData.areaCode"
|
||||
placeholder="请选择地区"
|
||||
:options="orgList"
|
||||
:props="{
|
||||
checkStrictly: true,
|
||||
label: 'orgname',
|
||||
value: 'orgcode',
|
||||
}"
|
||||
clearable
|
||||
></el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="婚姻状态" prop="marriageState">
|
||||
<el-select :disabled="readonly" placeholder="请选择" v-model="formData.marriageState">
|
||||
<el-option label="已婚" :value="1">已婚</el-option>
|
||||
<el-option label="未婚" :value="2">未婚</el-option>
|
||||
<el-option label="离婚" :value="3">离婚</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="出生日期" prop="birthday">
|
||||
<el-date-picker
|
||||
:disabled="readonly"
|
||||
v-model="formData.birthday"
|
||||
type="date"
|
||||
placeholder="请选择出生日期"
|
||||
size="default"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="现居地址" prop="sortId" style="width: 94%">
|
||||
<el-form-item label="户籍创建时间" prop="changeTime">
|
||||
<el-date-picker
|
||||
:disabled="readonly"
|
||||
v-model="formData.changeTime"
|
||||
type="date"
|
||||
placeholder="请选择户籍创建时间"
|
||||
size="default"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号" prop="idCard" style="width: 94%;">
|
||||
<el-input :disabled="readonly" placeholder="请输入身份证号" type="input" v-model="formData.idCard" />
|
||||
</el-form-item>
|
||||
<el-form-item label="现居地址" prop="address" style="width: 94%;">
|
||||
<el-input
|
||||
:disabled="readonly"
|
||||
placeholder="请输入"
|
||||
type="input"
|
||||
v-model="formData.address"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="lon">
|
||||
<el-input :disabled="readonly" placeholder="请输入" type="input" v-model="formData.lon" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="lat">
|
||||
<el-input :disabled="readonly" placeholder="请输入" type="input" v-model="formData.lat" />
|
||||
</el-form-item>
|
||||
<el-form-item v-if="readonly?false:true" label="地图：" style="width: 94%;">
|
||||
<Map
|
||||
@change="handleMapChange"
|
||||
:longlat="
|
||||
formData.lon && formData.lat
|
||||
? [formData.lon, formData.lat]
|
||||
: latAndLon
|
||||
"
|
||||
></Map>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table
|
||||
v-if="readonly"
|
||||
ref="loading"
|
||||
:data="detailTableData"
|
||||
header-row-class-name="el-one-header"
|
||||
border
|
||||
>
|
||||
<el-table-column
|
||||
type="index"
|
||||
align="center"
|
||||
label="序列"
|
||||
width="60"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="姓名"
|
||||
prop="name"
|
||||
width="130"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="联系电话"
|
||||
prop="phoneNumber"
|
||||
width="130"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="性别"
|
||||
prop="sex"
|
||||
width="130"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="当前地址"
|
||||
prop="nowAddress"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="关系"
|
||||
prop="relation"
|
||||
width="130"
|
||||
>
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.relation == 1? '户主':scope.row.relation == 2? '父亲':scope.row.relation == 3? '母亲':scope.row.relation == 4? '祖父':scope.row.relation == 5? '祖母':'子女' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</BaseDialog>
|
||||
</template>
|
||||
|
|
@ -53,50 +161,62 @@
|
|||
import { reactive, ref, onMounted, watch } from "vue";
|
||||
import { ElMessage, FormInstance, FormRules } from "element-plus";
|
||||
import { getUUID } from "@/utils/common";
|
||||
import { areaTree } from "@/api/account";
|
||||
import { domicileAdd, domicileDetail } from "@/api/base";
|
||||
import useUserStore from "@/store/modules/user";
|
||||
const userStore = useUserStore();
|
||||
const user = ref(JSON.parse(userStore.userInfo));
|
||||
const userId = ref(user.value.userId);
|
||||
const uuid = ref(getUUID());
|
||||
|
||||
import { inListAdd } from "@/api/industry";
|
||||
|
||||
const props = defineProps({
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
form: Object,
|
||||
});
|
||||
|
||||
//道孚地图坐标
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
const emits = defineEmits(["close"]);
|
||||
const titleName = ref("新增");
|
||||
// 表单
|
||||
const formRef = ref<FormInstance>();
|
||||
const ruleForm = reactive<FormRules>({
|
||||
itemTitle: [{ required: true, message: "请输入内容", trigger: "blur" }],
|
||||
name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||
sex: [{ required: true, message: "请选择性别", trigger: "blur" }],
|
||||
lat: [{ required: true, message: "请选择纬度", trigger: "blur" }],
|
||||
lon: [{ required: true, message: "请选择经度", trigger: "blur" }],
|
||||
idCard: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||
changeTime: [{ required: true, message: "请选择户籍创建时间", trigger: "blur" }],
|
||||
areaCode:[{ required: true, message: "请选择地区", trigger: "blur" }],
|
||||
address: [{ required: true, message: "请输入地址", trigger: "blur" }],
|
||||
});
|
||||
const formData = ref<any>({});
|
||||
|
||||
const tags = ref([
|
||||
{ label: "流动人口", value: 1 },
|
||||
{ label: "常住人口", value: 2 },
|
||||
]);
|
||||
const types = ref([
|
||||
{ label: "新生儿", value: 1 },
|
||||
{ label: "在校生", value: 2 },
|
||||
{ label: "残疾人", value: 3 },
|
||||
{ label: "低保户", value: 4 },
|
||||
{ label: "五保户", value: 5 },
|
||||
{ label: "党员", value: 6 },
|
||||
{ label: "村组干部", value: 7 },
|
||||
{ label: "其他", value: 8 },
|
||||
]);
|
||||
|
||||
//保存并退出
|
||||
const handleSubmit = () => {
|
||||
formRef.value?.validate((valid) => {
|
||||
if (valid) {
|
||||
formData.value.sortId = formData.value.sortId || 1;
|
||||
formData.value.industryId = props.id;
|
||||
formData.value.delState = formData.value.delState || 1;
|
||||
inListAdd(formData.value).then((res: any) => {
|
||||
let params = {
|
||||
...formData.value,
|
||||
areaCode:"",
|
||||
domicileId:formData.value.domicileId
|
||||
? formData.value.domicileId
|
||||
: null,
|
||||
};
|
||||
if (formData.value.areaCode instanceof Array) {
|
||||
params.areaCode =
|
||||
formData.value.areaCode[formData.value.areaCode.length - 1];
|
||||
} else {
|
||||
params.areaCode = formData.value.areaCode;
|
||||
}
|
||||
console.log(params,'params===>');
|
||||
|
||||
domicileAdd(params).then((res: any) => {
|
||||
if (res.code == 1) {
|
||||
ElMessage.success({
|
||||
message: "操作成功",
|
||||
|
|
@ -114,19 +234,53 @@ const handleSubmit = () => {
|
|||
return false;
|
||||
});
|
||||
};
|
||||
|
||||
//获取地区
|
||||
const orgList = ref([]);
|
||||
const getareaTree = () => {
|
||||
areaTree(userId.value).then((res: any) => {
|
||||
orgList.value = res.data;
|
||||
});
|
||||
};
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
formData.value.lon = pos[0];
|
||||
formData.value.lat = pos[1];
|
||||
};
|
||||
//关闭弹窗
|
||||
const onclone = () => {
|
||||
formRef.value?.clearValidate();
|
||||
formData.value = {};
|
||||
emits("close");
|
||||
};
|
||||
onMounted(() => {});
|
||||
//详情获取户籍人员信息
|
||||
const detailTableData = ref([])
|
||||
const getDomicileDetail = (id)=>{
|
||||
domicileDetail({domicileId:id}).then((res: any) => {
|
||||
detailTableData.value = res.peopleList;
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
getareaTree();
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.readonly,
|
||||
(val: any) => {
|
||||
if (val == true) {
|
||||
console.log(val,'val===>');
|
||||
setTimeout(() => {
|
||||
titleName.value = '查看';
|
||||
getDomicileDetail(formData.value.domicileId);
|
||||
}, 300);
|
||||
|
||||
}
|
||||
}
|
||||
);
|
||||
//详情
|
||||
watch(
|
||||
() => props.form,
|
||||
(val: any) => {
|
||||
titleName.value = val.id ? "编辑" : "新增/迁入";
|
||||
titleName.value = val.domicileId ? "编辑" : "新增/迁入";
|
||||
formData.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
|
|
|
|||
99
src/views/base-manage/residence/dialog/cancel.vue
Normal file
99
src/views/base-manage/residence/dialog/cancel.vue
Normal file
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<BaseDialog
|
||||
:dialogVisible="props.visible"
|
||||
@close="onclone"
|
||||
titleName="注销"
|
||||
width="50%"
|
||||
@onSubmit="handleSubmit"
|
||||
:footerclosed="true"
|
||||
:diafooter="true"
|
||||
>
|
||||
<div class="detailForm-content">
|
||||
<el-form
|
||||
ref="formRef"
|
||||
label-width="120"
|
||||
:rules="ruleForm"
|
||||
:model="formData"
|
||||
class="center-form"
|
||||
>
|
||||
<el-form-item label="注销时间" prop="changeTime">
|
||||
<el-date-picker
|
||||
v-model="formData.changeTime"
|
||||
type="date"
|
||||
placeholder="请选择注销时间"
|
||||
size="default"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</BaseDialog>
|
||||
</template>
|
||||
<script setup lang='ts'>
|
||||
import { reactive, ref, onMounted, watch } from "vue";
|
||||
import { ElMessage, FormInstance, FormRules } from "element-plus";
|
||||
import { domicileCancel } from "@/api/base";
|
||||
|
||||
const props = defineProps({
|
||||
visible: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
form: Object,
|
||||
});
|
||||
const emits = defineEmits(["close"]);
|
||||
// 表单
|
||||
const formRef = ref<FormInstance>();
|
||||
const ruleForm = reactive<FormRules>({
|
||||
changeTime: [{ required: true, message: "请选择注销时间", trigger: "blur" }],
|
||||
});
|
||||
const formData = ref<any>({});
|
||||
const domicileId = ref('')
|
||||
//保存并退出
|
||||
const handleSubmit = () => {
|
||||
formRef.value?.validate((valid) => {
|
||||
if (valid) {
|
||||
let params = {
|
||||
changeTime:formData.value.changeTime,
|
||||
domicileId:domicileId.value,
|
||||
};
|
||||
console.log(params,'params===>');
|
||||
|
||||
domicileCancel(params).then((res: any) => {
|
||||
console.log(res,'res===>');
|
||||
|
||||
if (res.code == 1) {
|
||||
ElMessage.success({
|
||||
message: "操作成功",
|
||||
type: "success",
|
||||
});
|
||||
onclone();
|
||||
} else {
|
||||
ElMessage.error({
|
||||
message: res.message,
|
||||
type: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
return false;
|
||||
});
|
||||
};
|
||||
//关闭弹窗
|
||||
const onclone = () => {
|
||||
formRef.value?.clearValidate();
|
||||
formData.value = {};
|
||||
emits("close");
|
||||
};
|
||||
onMounted(() => {
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.form,
|
||||
(val: any) => {
|
||||
domicileId.value = val.domicileId;
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
|
@ -2,28 +2,48 @@
|
|||
<template>
|
||||
<div class="percentage-content">
|
||||
<div class="content">
|
||||
<div style="margin-bottom: 16px" class="h-layout space-between h-center">
|
||||
<div style="margin-bottom: 16px;" class="h-layout space-between h-center">
|
||||
<div>
|
||||
<div class="h-layout">
|
||||
<div
|
||||
class="tool-item"
|
||||
@click="(currentItem = {}), (visible = true)"
|
||||
@click="
|
||||
(dialogForm = {}), (dialogVisible = true), (readonly = false)
|
||||
"
|
||||
>
|
||||
<svg-icon name="add" class="icon" />
|
||||
<span>新增/迁入</span>
|
||||
</div>
|
||||
<div class="tool-item">
|
||||
<div class="tool-item" @click="getList">
|
||||
<svg-icon name="refurbish" class="icon" />
|
||||
<span>刷新</span>
|
||||
</div>
|
||||
<div class="label-select filter-tab">
|
||||
<label>预案类型</label>
|
||||
<el-select
|
||||
v-model="type"
|
||||
@change="getList"
|
||||
clearable
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in option"
|
||||
:key="item.othtypeid"
|
||||
:label="item.othtypename"
|
||||
:value="item.othtypeid"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 30%">
|
||||
<div style="width: 30%;">
|
||||
<div>
|
||||
<el-input
|
||||
v-model="search"
|
||||
v-model="search.condition"
|
||||
placeholder="请输入关键字"
|
||||
class="search-input"
|
||||
@keydown.enter.native="getList"
|
||||
>
|
||||
<template #append>
|
||||
<span class="search-bottom">
|
||||
|
|
@ -39,6 +59,7 @@
|
|||
<el-table
|
||||
ref="loading"
|
||||
:data="tableData"
|
||||
v-loading="tableDataloading"
|
||||
header-row-class-name="el-one-header"
|
||||
border
|
||||
>
|
||||
|
|
@ -53,6 +74,7 @@
|
|||
align="center"
|
||||
label="姓名"
|
||||
prop="name"
|
||||
width="130"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
|
|
@ -62,30 +84,50 @@
|
|||
prop="sex"
|
||||
width="80"
|
||||
>
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.sex == 1? '男':scope.row.sex == 0? '女':'--' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="出生日期"
|
||||
prop="birth"
|
||||
prop="birthday"
|
||||
width="200"
|
||||
>
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.birthday ? scope.row.birthday:'--' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="婚姻状况"
|
||||
prop="tag"
|
||||
prop="marriageState"
|
||||
width="80"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column :resizable="true" label="户籍成员" prop="member">
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.marriageState == 1? '已婚':scope.row.marriageState == 2? '未婚':scope.row.marriageState == 3? '离婚':'--' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="left"
|
||||
align="center"
|
||||
label="居住地址"
|
||||
prop="address"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="户籍状态"
|
||||
prop="domicileState"
|
||||
width="80"
|
||||
>
|
||||
<template #default="scope">
|
||||
<span>{{ scope.row.domicileState == 1? '正常':scope.row.domicileState == 2? '注销':'--' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
align="center"
|
||||
|
|
@ -95,23 +137,31 @@
|
|||
<template #default="scope">
|
||||
<span
|
||||
class="operate"
|
||||
@click="(currentItem = scope.row), (visible = true)"
|
||||
@click="
|
||||
(dialogForm = scope.row),
|
||||
(dialogVisible = true),
|
||||
(readonly = false)
|
||||
"
|
||||
>
|
||||
<svg-icon name="edit" class="icon"></svg-icon>
|
||||
<span class="edit">编辑</span>
|
||||
</span>
|
||||
<span
|
||||
class="operate"
|
||||
@click="(currentItem = scope.row), (visible = true)"
|
||||
@click="
|
||||
(dialogForm = scope.row),
|
||||
(dialogVisible = true),
|
||||
(readonly = true)
|
||||
"
|
||||
>
|
||||
<svg-icon name="detail" class="icon"></svg-icon>
|
||||
<span class="detail">详情</span>
|
||||
</span>
|
||||
<span class="operate" @click="del(scope.row, '删除')">
|
||||
<span class="operate" @click="del(scope.row.domicileId)">
|
||||
<svg-icon name="delete" class="icon"></svg-icon>
|
||||
<span class="func">删除</span>
|
||||
</span>
|
||||
<span class="operate" @click="del(scope.row, '注销')">
|
||||
<span v-if="scope.row.domicileState!=2" class="operate" @click="(cancelDialogForm = scope.row), (cancelDialogVisible = true)">
|
||||
<svg-icon name="detail" class="icon"></svg-icon>
|
||||
<span class="func">注销</span>
|
||||
</span>
|
||||
|
|
@ -121,8 +171,8 @@
|
|||
<!-- 分页 -->
|
||||
<el-pagination
|
||||
class="pagination"
|
||||
@size-change="getCompanyList"
|
||||
@current-change="getCompanyList"
|
||||
@size-change="getList"
|
||||
@current-change="getList"
|
||||
v-model:current-page.sync="currentPage"
|
||||
:page-sizes="[10, 15, 20, 30]"
|
||||
v-model:page-size.sync="pageSize"
|
||||
|
|
@ -132,86 +182,121 @@
|
|||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
<add-edit
|
||||
:visible="visible"
|
||||
:form="currentItem"
|
||||
@close="(visible = false), (currentItem = {})"
|
||||
/>
|
||||
<add-edit :visible="dialogVisible" :form="dialogForm" :readonly="readonly" @close="onclone" />
|
||||
<Cancel :visible="cancelDialogVisible" :form="cancelDialogForm" @close="cancelonclone" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang='ts' setup>
|
||||
import { ElMessageBox } from "element-plus";
|
||||
import { onMounted, reactive, ref } from "vue";
|
||||
import { domicilePage, domicileDel } from "@/api/base";
|
||||
import AddEdit from "./dialog/add-edit.vue";
|
||||
import Cancel from "./dialog/cancel.vue";
|
||||
import { ElMessage,ElMessageBox } from "element-plus";
|
||||
|
||||
const visible = ref(false);
|
||||
const currentItem = ref();
|
||||
import useUserStore from "@/store/modules/user";
|
||||
const userStore = useUserStore();
|
||||
const user = ref(JSON.parse(userStore.userInfo));
|
||||
const userId = ref(user.value.userId);
|
||||
|
||||
const search = ref([]);
|
||||
const dialogVisible = ref(false);
|
||||
const dialogForm = ref({});
|
||||
const readonly = ref(false);
|
||||
const search = ref({
|
||||
condition: "",
|
||||
});
|
||||
const currentPage = ref(1);
|
||||
const pageSize = ref(10);
|
||||
const total = ref(0);
|
||||
const tableData = ref([
|
||||
{
|
||||
id: 1,
|
||||
name: "张三",
|
||||
sex: "男",
|
||||
tag: "已婚",
|
||||
member: "父亲：张三丰 18140159608；母亲：张媛 18140156666",
|
||||
birth: "2023-12-15",
|
||||
address: "xxxxxxxxxxx地址",
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
name: "张三",
|
||||
sex: "男",
|
||||
tag: "已婚",
|
||||
member: "-",
|
||||
birth: "2023-12-15",
|
||||
address: "xxxxxxxxxxx地址",
|
||||
},
|
||||
]);
|
||||
|
||||
/**
|
||||
* 删除
|
||||
*/
|
||||
const del = (item, tips) => {
|
||||
ElMessageBox.confirm(`是否确认${tips}?`, "提示", {
|
||||
const tableData = ref([]);
|
||||
//获取列表
|
||||
const tableDataloading = ref(false);
|
||||
const getList = () => {
|
||||
tableDataloading.value = true;
|
||||
let params = {
|
||||
limit: pageSize.value,
|
||||
page: currentPage.value,
|
||||
condition: search.value.condition,
|
||||
userId: userId.value,
|
||||
};
|
||||
domicilePage(params).then((res: any) => {
|
||||
console.log(res, "res====>");
|
||||
tableData.value = res.data.list;
|
||||
total.value = res.data.total;
|
||||
tableDataloading.value = false;
|
||||
});
|
||||
};
|
||||
// 删除
|
||||
const del = (id) => {
|
||||
ElMessageBox.confirm("是否确认删除?", "提示", {
|
||||
confirmButtonText: "是",
|
||||
cancelButtonText: "否",
|
||||
type: "warning",
|
||||
}).then(() => {});
|
||||
}).then(() => {
|
||||
let params = {
|
||||
domicileId:id
|
||||
}
|
||||
domicileDel(params).then((res: any) => {
|
||||
if (res.code == 1) {
|
||||
ElMessage.success({
|
||||
message: "删除成功",
|
||||
});
|
||||
} else {
|
||||
ElMessage.error({
|
||||
message: res.message,
|
||||
});
|
||||
}
|
||||
getList();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(() => {});
|
||||
// 注销
|
||||
const cancelDialogVisible = ref(false);
|
||||
const cancelDialogForm= ref({});
|
||||
const cancelonclone = () => {
|
||||
cancelDialogVisible.value = false;
|
||||
cancelDialogForm.value = {};
|
||||
getList();
|
||||
};
|
||||
//关闭新增弹窗
|
||||
const onclone = () => {
|
||||
dialogVisible.value = false;
|
||||
dialogForm.value = {};
|
||||
readonly.value = false;
|
||||
getList();
|
||||
};
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 0.26042vw;
|
||||
box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
|
||||
height: 100%;
|
||||
padding: 0.83333vw;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden !important;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
-o-box-sizing: border-box;
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 0.26042vw;
|
||||
box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
|
||||
height: 100%;
|
||||
padding: 0.83333vw;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden !important;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-moz-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-webkit-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-o-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.dialog-footer button:first-child {
|
||||
margin-right: 10px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.content-top {
|
||||
padding: 16px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0px 0px 6px rgba(0, 120, 255, 0.1);
|
||||
border-radius: 6px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 16px;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 6px rgb(0 120 255 / 10%);
|
||||
border-radius: 6px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -23,10 +23,10 @@
|
|||
v-model="formData.orgname"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item prop="superiororgcode" label="所属区域">
|
||||
<el-form-item prop="orgcode" label="所属区域">
|
||||
<el-cascader
|
||||
ref="cascader"
|
||||
v-model="formData.superiororgcode"
|
||||
v-model="formData.orgcode"
|
||||
placeholder="请选择地区"
|
||||
:options="orgList"
|
||||
:props="{
|
||||
|
|
@ -82,7 +82,7 @@ const formRef = ref<FormInstance>();
|
|||
const ruleForm = reactive<FormRules>({
|
||||
orgname: [{ required: true, message: "请输入村庄名称", trigger: "blur" }],
|
||||
sortId: [{ required: true, message: "请输入排序", trigger: "blur" }],
|
||||
superiororgcode: [{ required: true, message: "请选择所属地区", trigger: "blur" }],
|
||||
orgcode: [{ required: true, message: "请选择所属地区", trigger: "blur" }],
|
||||
});
|
||||
const formData = ref<any>({});
|
||||
|
||||
|
|
@ -92,16 +92,16 @@ const handleSubmit = () => {
|
|||
if (valid) {
|
||||
let params = {
|
||||
orgname:formData.value.orgname,
|
||||
superiororgcode:'',
|
||||
// orgcode:'',
|
||||
sortId:formData.value.sortId,
|
||||
charger:formData.value.charger,
|
||||
telephone:formData.value.telephone,
|
||||
orgcode:formData.value.orgcode?formData.value.orgcode:null,
|
||||
};
|
||||
if (formData.value.superiororgcode instanceof Array) {
|
||||
params.superiororgcode = formData.value.superiororgcode[formData.value.superiororgcode.length - 1];
|
||||
if (formData.value.orgcode instanceof Array) {
|
||||
params.orgcode = formData.value.orgcode[formData.value.orgcode.length - 1];
|
||||
}else{
|
||||
params.superiororgcode = formData.value.superiororgcode;
|
||||
params.orgcode = formData.value.orgcode;
|
||||
};
|
||||
orgAdd(params).then((res: any) => {
|
||||
if (res.code == 1) {
|
||||
|
|
|
|||
|
|
@ -67,6 +67,9 @@
|
|||
align="center"
|
||||
label="负责人"
|
||||
>
|
||||
<template #default="scope">
|
||||
{{ scope.row.charger?scope.row.charger:'--'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="telephone"
|
||||
|
|
@ -74,6 +77,9 @@
|
|||
align="center"
|
||||
label="联系电话"
|
||||
>
|
||||
<template #default="scope">
|
||||
{{ scope.row.telephone?scope.row.telephone:'--'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
:resizable="true"
|
||||
|
|
|
|||
251
src/views/emergency/address-book/index.vue
Normal file
251
src/views/emergency/address-book/index.vue
Normal file
|
|
@ -0,0 +1,251 @@
|
|||
<template>
|
||||
<div class="percentage-content">
|
||||
<div class="content">
|
||||
|
||||
<div class="tree-wrap">
|
||||
|
||||
<vue3-tree-org style="margin-top: 10px;" ref="tree" :data="data" :center="true" :horizontal="horizontal"
|
||||
:collapsable="collapsable" :label-style="style" :node-draggable="true" :scalable="true"
|
||||
:only-one-node="onlyOneNode" :default-expand-level="3" :filter-node-method="filterNodeMethod"
|
||||
:clone-node-drag="cloneNodeDrag" @on-restore="restore" @on-contextmenu="onMenus" :on-expand-all="expandAll"
|
||||
@on-node-blur="nodeBlur" @on-node-delete="nodeDelete" :props="props" :define-menus="defineMenus">
|
||||
<!-- :define-menus="defineMenus" -->
|
||||
<template v-slot="{ node }">
|
||||
<div class="tree-org-node__text node-label tree-div">
|
||||
<div>{{ node.label }}</div>
|
||||
<!-- <input type="text"> -->
|
||||
</div>
|
||||
</template>
|
||||
</vue3-tree-org>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<el-button class="topButton" type="primary" @click="click">提交</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
import { reactive, ref, onMounted } from "vue";
|
||||
// import { getEmergencyUserTree, saveEmergencyUser, delEmergencyUser } from "@/api/emergency";
|
||||
import { getUUID } from "@/utils/common";
|
||||
import { ElMessage } from 'element-plus'
|
||||
const data = ref({
|
||||
id:1,label:"道孚县鲜水镇",
|
||||
children:[
|
||||
{
|
||||
id:2,pid:1,label:"街道",
|
||||
style:{color:"#fff",background:"#108ffe"},
|
||||
children:[
|
||||
{id:6,pid:2,label:"办公室",disabled:true},
|
||||
{id:8,pid:2,label:"安居办",noDragging:true},
|
||||
{id:10,pid:2,label:"规划办"}
|
||||
]
|
||||
},
|
||||
{
|
||||
id:3,pid:1,label:"应急",
|
||||
children:[
|
||||
{id:11,pid:3,label:"应急一部"},
|
||||
{id:12,pid:3,label:"应急二部"}
|
||||
]
|
||||
},
|
||||
]});
|
||||
const horizontal = ref(false);
|
||||
const collapsable = ref(true);
|
||||
const onlyOneNode = ref(true);
|
||||
const cloneNodeDrag = ref(true);
|
||||
const expandAll = ref(true);
|
||||
const style = reactive({
|
||||
background: "#fff",
|
||||
color: "#5e6d82",
|
||||
height: "50%"
|
||||
});
|
||||
const props = reactive({
|
||||
id: 'id',
|
||||
pid: 'pid',
|
||||
label: 'label',
|
||||
children: 'children'
|
||||
});
|
||||
const defineMenus = ref([
|
||||
{ name: '新增', command: 'add' },
|
||||
{ name: '编辑', command: 'edit' },
|
||||
{ name: '删除', command: 'delete' },
|
||||
])
|
||||
/* defineMenus:[
|
||||
{ name:'复制', command: 'copy' },
|
||||
{ name:'新建', command: 'add' },
|
||||
{ name:'编辑', command: 'edit' },
|
||||
{ name:'自定义', command: 'defind' },
|
||||
], */
|
||||
//删除应急组织机构对象
|
||||
const deleteData = ref([])
|
||||
//新增/修改应急组织机构对象
|
||||
const addModifyData = ref([])
|
||||
|
||||
const onMenus = ({ node, command }) => {
|
||||
};
|
||||
const restore = () => {
|
||||
};
|
||||
const filterNodeMethod = (value, data) => {
|
||||
console.log(value, data)
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
};
|
||||
//提交
|
||||
const click = () => {
|
||||
addModifyData.value = [...new Set(addModifyData.value)];
|
||||
//新增
|
||||
addModifyData.value.forEach(item => {
|
||||
console.log(item);
|
||||
let emergencyUserId = '';
|
||||
if (item.newNode == true) {
|
||||
emergencyUserId = getUUID();
|
||||
} else {
|
||||
emergencyUserId = item.emergencyUserId;
|
||||
}
|
||||
let params = {
|
||||
emergencyUserId: emergencyUserId,
|
||||
name: item.name,
|
||||
superId: item.superId,
|
||||
}
|
||||
console.log(params,'params====>');
|
||||
|
||||
// saveEmergencyUser(params).then((res: any) => {
|
||||
// });
|
||||
});
|
||||
//删除
|
||||
// deleteData.value.forEach(item => {
|
||||
// delEmergencyUser({ emergencyUserId: item.emergencyUserId }).then((res: any) => {
|
||||
// });
|
||||
// })
|
||||
|
||||
// setTimeout(() => {
|
||||
// ElMessage({
|
||||
// message: '修改成功',
|
||||
// type: 'success',
|
||||
// })
|
||||
// deleteData.value = [];
|
||||
// addModifyData.value = [];
|
||||
// getEmergencyUserTrees();
|
||||
// }, 2000)
|
||||
|
||||
};
|
||||
//节点失去焦点-添加入增加修改数组
|
||||
const nodeBlur = (e, data) => {
|
||||
addModifyData.value.push(data)
|
||||
};
|
||||
//添加入删除节点数组
|
||||
const nodeDelete = (e) => {
|
||||
deleteData.value.push(e)
|
||||
}
|
||||
//获取应急工作处理领导小组树形
|
||||
const getEmergencyUserTrees = () => {
|
||||
// getEmergencyUserTree().then((res: any) => {
|
||||
// console.log(data.value, ' data.value ');
|
||||
// if (res.code == 1) {
|
||||
// data.value = res.data[0]
|
||||
|
||||
// }
|
||||
// });
|
||||
}
|
||||
onMounted(() => {
|
||||
getEmergencyUserTrees();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.box-style {
|
||||
display: flex !important;
|
||||
}
|
||||
:deep(.el-table--border th.el-table__cell) {
|
||||
color: #333;
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
:deep(.cell) {
|
||||
color: #777;
|
||||
}
|
||||
.filter-border {
|
||||
border: 1px solid rgb(220 220 220);
|
||||
background-color: #e6e6e6;
|
||||
width: 40%;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
}
|
||||
:deep(.el-input__inner) {
|
||||
border-radius: 0%;
|
||||
}
|
||||
.size-style {
|
||||
color: #787878;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
top: 5px;
|
||||
}
|
||||
.topButton {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 35px;
|
||||
left: 50%;
|
||||
bottom: 50px;
|
||||
font-size: 18px;
|
||||
margin-left: -100px;
|
||||
}
|
||||
.tree-div {
|
||||
padding: 20px 10px;
|
||||
>div {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tree-wrap {
|
||||
padding-top: 52px;
|
||||
height: 700px;
|
||||
position: relative;
|
||||
margin-top: -50px;
|
||||
}
|
||||
.search-box {
|
||||
padding: 8px 15px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
input {
|
||||
width: 200px;
|
||||
height: 32px;
|
||||
border: 1px solid #ddd;
|
||||
outline: none;
|
||||
border-radius: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
.tree-org-node__text {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
.custom-content {
|
||||
padding-bottom: 8px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid currentcolor;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
width: 100%;
|
||||
// flex: auto;
|
||||
background: #fff;
|
||||
border-radius: 0.26042vw;
|
||||
box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
|
||||
height: 100%;
|
||||
padding: 0.83333vw;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden !important;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-moz-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-webkit-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-o-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
251
src/views/emergency/address-book/index1.vue
Normal file
251
src/views/emergency/address-book/index1.vue
Normal file
|
|
@ -0,0 +1,251 @@
|
|||
<!-- <template>
|
||||
<div class="percentage-content">
|
||||
<div class="content">
|
||||
<div class="tree-wrap">
|
||||
<vue3-tree-org
|
||||
style="margin-top: 10px;"
|
||||
ref="tree"
|
||||
:data="data"
|
||||
:center="true"
|
||||
:horizontal="horizontal"
|
||||
:collapsable="collapsable"
|
||||
:label-style="style"
|
||||
:node-draggable="true"
|
||||
:scalable="true"
|
||||
:only-one-node="onlyOneNode"
|
||||
:default-expand-level="3"
|
||||
:filter-node-method="filterNodeMethod"
|
||||
:clone-node-drag="cloneNodeDrag"
|
||||
@on-restore="restore"
|
||||
@on-contextmenu="onMenus"
|
||||
:on-expand-all="expandAll"
|
||||
@on-node-blur="nodeBlur"
|
||||
@on-node-delete="nodeDelete"
|
||||
:props="props"
|
||||
:define-menus="defineMenus"
|
||||
>
|
||||
<template v-slot="{ node }">
|
||||
<div class="tree-org-node__text node-label tree-div">
|
||||
<div>{{ node.label }}</div>
|
||||
</div>
|
||||
</template>
|
||||
</vue3-tree-org>
|
||||
</div>
|
||||
<div>
|
||||
<el-button class="topButton" type="primary" @click="click"
|
||||
>提交</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang='ts' setup>
|
||||
import { onMounted, reactive, ref } from "vue";
|
||||
|
||||
import useUserStore from "@/store/modules/user";
|
||||
const userStore = useUserStore();
|
||||
const user = ref(JSON.parse(userStore.userInfo));
|
||||
const userId = ref(user.value.userId);
|
||||
// import { getEmergencyUserTree, saveEmergencyUser, delEmergencyUser } from "@/api/emergency";
|
||||
import { getUUID } from "@/utils/common";
|
||||
import { ElMessage } from 'element-plus'
|
||||
const data = ref({});
|
||||
const horizontal = ref(false);
|
||||
const collapsable = ref(true);
|
||||
const onlyOneNode = ref(true);
|
||||
const cloneNodeDrag = ref(true);
|
||||
const expandAll = ref(true);
|
||||
const style = reactive({
|
||||
background: "#fff",
|
||||
color: "#5e6d82",
|
||||
height: "50%"
|
||||
});
|
||||
const props = reactive({
|
||||
id: 'emergencyUserId',
|
||||
pid: 'superId',
|
||||
label: 'name',
|
||||
children: 'children'
|
||||
});
|
||||
const defineMenus = ref([
|
||||
{ name: '新增', command: 'add' },
|
||||
{ name: '编辑', command: 'edit' },
|
||||
{ name: '删除', command: 'delete' },
|
||||
])
|
||||
/* defineMenus:[
|
||||
{ name:'复制', command: 'copy' },
|
||||
{ name:'新建', command: 'add' },
|
||||
{ name:'编辑', command: 'edit' },
|
||||
{ name:'自定义', command: 'defind' },
|
||||
], */
|
||||
//删除应急组织机构对象
|
||||
const deleteData = ref([])
|
||||
//新增/修改应急组织机构对象
|
||||
const addModifyData = ref([])
|
||||
|
||||
const onMenus = ({ node, command }) => {
|
||||
};
|
||||
const restore = () => {
|
||||
};
|
||||
const filterNodeMethod = (value, data) => {
|
||||
console.log(value, data)
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
};
|
||||
//提交
|
||||
const click = () => {
|
||||
addModifyData.value = [...new Set(addModifyData.value)];
|
||||
//新增
|
||||
addModifyData.value.forEach(item => {
|
||||
console.log(item);
|
||||
let emergencyUserId = '';
|
||||
if (item.newNode == true) {
|
||||
emergencyUserId = getUUID();
|
||||
} else {
|
||||
emergencyUserId = item.emergencyUserId;
|
||||
}
|
||||
let params = {
|
||||
emergencyUserId: emergencyUserId,
|
||||
name: item.name,
|
||||
superId: item.superId,
|
||||
}
|
||||
// saveEmergencyUser(params).then((res: any) => {
|
||||
// });
|
||||
});
|
||||
//删除
|
||||
deleteData.value.forEach(item => {
|
||||
// delEmergencyUser({ emergencyUserId: item.emergencyUserId }).then((res: any) => {
|
||||
// });
|
||||
})
|
||||
|
||||
setTimeout(() => {
|
||||
ElMessage({
|
||||
message: '修改成功',
|
||||
type: 'success',
|
||||
})
|
||||
deleteData.value = [];
|
||||
addModifyData.value = [];
|
||||
// getEmergencyUserTrees();
|
||||
}, 2000)
|
||||
|
||||
};
|
||||
//节点失去焦点-添加入增加修改数组
|
||||
const nodeBlur = (e, data) => {
|
||||
addModifyData.value.push(data)
|
||||
};
|
||||
//添加入删除节点数组
|
||||
const nodeDelete = (e) => {
|
||||
deleteData.value.push(e)
|
||||
}
|
||||
//获取应急工作处理领导小组树形
|
||||
const getEmergencyUserTrees = () => {
|
||||
// getEmergencyUserTree().then((res: any) => {
|
||||
// console.log(data.value, ' data.value ');
|
||||
// if (res.code == 1) {
|
||||
// data.value = res.data[0]
|
||||
|
||||
// }
|
||||
// });
|
||||
}
|
||||
onMounted(() => {
|
||||
// getEmergencyUserTrees();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
border-radius: 0.26042vw;
|
||||
box-shadow: 0 0 0.41667vw 0 rgb(8 33 85 / 10%);
|
||||
height: 100%;
|
||||
padding: 0.83333vw;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden !important;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-moz-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-webkit-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-o-box-sizing: border-box;
|
||||
/* stylelint-disable-next-line property-no-vendor-prefix */
|
||||
-ms-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.box-style {
|
||||
display: flex !important;
|
||||
}
|
||||
:deep(.el-table--border th.el-table__cell) {
|
||||
color: #333;
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
:deep(.cell) {
|
||||
color: #777;
|
||||
}
|
||||
.filter-border {
|
||||
border: 1px solid rgb(220 220 220);
|
||||
background-color: #e6e6e6;
|
||||
width: 40%;
|
||||
height: 32px;
|
||||
text-align: center;
|
||||
}
|
||||
:deep(.el-input__inner) {
|
||||
border-radius: 0%;
|
||||
}
|
||||
.size-style {
|
||||
color: #787878;
|
||||
font-size: 13px;
|
||||
position: relative;
|
||||
top: 5px;
|
||||
}
|
||||
.topButton {
|
||||
position: absolute;
|
||||
width: 100px;
|
||||
height: 35px;
|
||||
left: 50%;
|
||||
bottom: 50px;
|
||||
font-size: 18px;
|
||||
margin-left: -100px;
|
||||
}
|
||||
.tree-div {
|
||||
padding: 20px 10px;
|
||||
> div {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.tree-wrap {
|
||||
padding-top: 52px;
|
||||
height: 700px;
|
||||
position: relative;
|
||||
margin-top: -50px;
|
||||
}
|
||||
.search-box {
|
||||
padding: 8px 15px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
input {
|
||||
width: 200px;
|
||||
height: 32px;
|
||||
border: 1px solid #ddd;
|
||||
outline: none;
|
||||
border-radius: 5px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
.tree-org-node__text {
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
.custom-content {
|
||||
padding-bottom: 8px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid currentcolor;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
-->
|
||||
|
|
@ -64,18 +64,6 @@
|
|||
label="序列"
|
||||
width="60"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="chinaname"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="姓名"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="mobiletel"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="联系方式"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="unitName"
|
||||
:resizable="true"
|
||||
|
|
@ -89,6 +77,18 @@
|
|||
align="center"
|
||||
label="职务名"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="chinaname"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="姓名"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="mobiletel"
|
||||
:resizable="true"
|
||||
align="center"
|
||||
label="联系方式"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
prop="roleName"
|
||||
:resizable="true"
|
||||
|
|
|
|||
|
|
@ -72,6 +72,9 @@
|
|||
type="textarea"
|
||||
v-model="formData.poolDesc"
|
||||
/></el-form-item>
|
||||
<el-form-item label="地图：" style="width: 94%;">
|
||||
<Map @change="handleMapChange" :longlat="formData.lon&&formData.lat?[formData.lon,formData.lat]:latAndLon"></Map>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</BaseDialog>
|
||||
|
|
@ -92,6 +95,7 @@ const props = defineProps({
|
|||
},
|
||||
form: Object,
|
||||
});
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
|
||||
const emits = defineEmits(["close"]);
|
||||
const titleName = ref("新增");
|
||||
|
|
@ -103,8 +107,8 @@ const ruleForm = reactive<FormRules>({
|
|||
address: [{ required: true, message: "请输入详细地址", trigger: "blur" }],
|
||||
poolDesc: [{ required: true, message: "请输入风险描述", trigger: "blur" }],
|
||||
areaCode: [{ required: true, message: "请选择所属地区", trigger: "blur" }],
|
||||
lon: [{ required: true, message: "请输入经度", trigger: "blur" }],
|
||||
lat: [{ required: true, message: "请输入纬度", trigger: "blur" }],
|
||||
lon:[{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
lat:[{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
});
|
||||
const formData = ref<any>({});
|
||||
|
||||
|
|
@ -161,6 +165,11 @@ const getareaTree = () => {
|
|||
orgList.value = res.data;
|
||||
});
|
||||
};
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
formData.value.lon = pos[0];
|
||||
formData.value.lat = pos[1];
|
||||
};
|
||||
onMounted(() => {
|
||||
getRiskTypeList();
|
||||
getareaTree();
|
||||
|
|
|
|||
|
|
@ -82,6 +82,9 @@
|
|||
v-model="addPostFactorForm.address"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="地图：" style="width: 100%;">
|
||||
<Map @change="handleMapChange" :longlat="addPostFactorForm.lon&&addPostFactorForm.lat?[addPostFactorForm.lon,addPostFactorForm.lat]:latAndLon"></Map>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</BaseDialog>
|
||||
|
|
@ -89,6 +92,7 @@
|
|||
<script setup lang="ts" >
|
||||
import { reactive, ref, onMounted, watch } from "vue";
|
||||
import useUserStore from "@/store/modules/user";
|
||||
import Map from "../../../../components/Map/index.vue";
|
||||
import { ElMessage, FormInstance, FormRules } from "element-plus";
|
||||
import { getYears, getUUID, FileType } from "@/utils/common";
|
||||
import {
|
||||
|
|
@ -102,6 +106,7 @@ const userStore = useUserStore();
|
|||
const user = ref(JSON.parse(userStore.userInfo));
|
||||
const userId = ref(user.value.userId);
|
||||
const uuid = ref("");
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
const ruleForm = reactive<FormRules>({
|
||||
houseName: [{ required: true, message: "请输入仓库名称", trigger: "blur" }],
|
||||
telephone: [
|
||||
|
|
@ -125,6 +130,8 @@ const ruleForm = reactive<FormRules>({
|
|||
trigger: "change",
|
||||
},
|
||||
],
|
||||
lon:[{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
lat:[{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
});
|
||||
const adminOptions = ref([]);
|
||||
const props = defineProps({
|
||||
|
|
@ -151,15 +158,18 @@ const handleSubmit = () => {
|
|||
addPostFactorForm.value.userId = userId.value;
|
||||
let params = {
|
||||
...addPostFactorForm.value,
|
||||
areaCode:"",
|
||||
}
|
||||
if (addPostFactorForm.value.areaCode instanceof Array) {
|
||||
params.areaCode = addPostFactorForm.value.areaCode[addPostFactorForm.value.areaCode.length - 1];
|
||||
}else{
|
||||
params.areaCode = addPostFactorForm.value.areaCode;
|
||||
areaCode: "",
|
||||
};
|
||||
console.log(params,'params===>');
|
||||
|
||||
if (addPostFactorForm.value.areaCode instanceof Array) {
|
||||
params.areaCode =
|
||||
addPostFactorForm.value.areaCode[
|
||||
addPostFactorForm.value.areaCode.length - 1
|
||||
];
|
||||
} else {
|
||||
params.areaCode = addPostFactorForm.value.areaCode;
|
||||
}
|
||||
console.log(params, "params===>");
|
||||
|
||||
saveOtheWareHouse(params).then((res: any) => {
|
||||
if (res.code == 1) {
|
||||
ElMessage.success({
|
||||
|
|
@ -208,6 +218,11 @@ const adminId = ref("");
|
|||
const adminOption = (val) => {
|
||||
adminId.value = val;
|
||||
};
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
addPostFactorForm.value.lon = pos[0];
|
||||
addPostFactorForm.value.lat = pos[1];
|
||||
};
|
||||
//关闭弹窗
|
||||
const onclone = () => {
|
||||
emits("close");
|
||||
|
|
|
|||
|
|
@ -53,12 +53,28 @@
|
|||
>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="lon">
|
||||
<el-input placeholder="请输入" type="input" v-model="addPostFactorForm.lon" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="lat">
|
||||
<el-input placeholder="请输入" type="input" v-model="addPostFactorForm.lat" />
|
||||
</el-form-item>
|
||||
<el-form-item prop="personnum" label="人数">
|
||||
<el-input-number
|
||||
v-model="addPostFactorForm.personnum"
|
||||
:min="1"
|
||||
></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="地图：" style="width: 94%;">
|
||||
<Map
|
||||
@change="handleMapChange"
|
||||
:longlat="
|
||||
addPostFactorForm.lon && addPostFactorForm.lat
|
||||
? [addPostFactorForm.lon, addPostFactorForm.lat]
|
||||
: latAndLon
|
||||
"
|
||||
></Map>
|
||||
</el-form-item>
|
||||
<el-form-item prop="chkbillname" style="width: 100%;" label="队伍简介">
|
||||
<el-input
|
||||
placeholder="请输入队伍简介"
|
||||
|
|
@ -91,6 +107,8 @@ const ruleForm = reactive<FormRules>({
|
|||
teamname: [{ required: true, message: "请输入队伍名称", trigger: "change" }],
|
||||
orgcode: [{ required: true, message: "请选择所属区域", trigger: "blur" }],
|
||||
personnum: [{ required: true, message: "请输入人数", trigger: "change" }],
|
||||
lon: [{ required: true, message: "请选择地图点位", trigger: "change" }],
|
||||
lat: [{ required: true, message: "请选择地图点位", trigger: "change" }],
|
||||
});
|
||||
const props = defineProps({
|
||||
visible: {
|
||||
|
|
@ -138,6 +156,12 @@ const getareaTree = () => {
|
|||
orgList.value = res.data;
|
||||
});
|
||||
};
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
addPostFactorForm.value.lon = pos[0];
|
||||
addPostFactorForm.value.lat = pos[1];
|
||||
};
|
||||
onMounted(() => {
|
||||
getareaTree();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -69,6 +69,12 @@
|
|||
v-model="detailForm.principaltel"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="lon">
|
||||
<el-input placeholder="请输入" :readonly="!readonly" type="input" v-model="detailForm.lon" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="lat">
|
||||
<el-input placeholder="请输入" :readonly="!readonly" type="input" v-model="detailForm.lat" />
|
||||
</el-form-item>
|
||||
<el-form-item label="人数" prop="personnum">
|
||||
<el-input
|
||||
type="number"
|
||||
|
|
@ -86,6 +92,16 @@
|
|||
v-model="detailForm.introduction"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="地图：" style="width: 94%;">
|
||||
<Map
|
||||
@change="handleMapChange"
|
||||
:longlat="
|
||||
detailForm.lon && detailForm.lat
|
||||
? [detailForm.lon, detailForm.lat]
|
||||
: latAndLon
|
||||
"
|
||||
></Map>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -290,6 +306,8 @@ const ruleForm = reactive<FormRules>({
|
|||
teamname: [{ required: true, message: "请输入队伍名称", trigger: "change" }],
|
||||
orgcode: [{ required: true, message: "请选择所属区域", trigger: "blur" }],
|
||||
personnum: [{ required: true, message: "请输入人数", trigger: "change" }],
|
||||
lon: [{ required: true, message: "请选择地图点位", trigger: "change" }],
|
||||
lat: [{ required: true, message: "请选择地图点位", trigger: "change" }],
|
||||
});
|
||||
const readonly = ref(false);
|
||||
const tableDataloading = ref(false);
|
||||
|
|
@ -413,6 +431,12 @@ const editMember = (val) => {
|
|||
dialogVisible.value = true;
|
||||
form.value = val;
|
||||
};
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
detailForm.value.lon = pos[0];
|
||||
detailForm.value.lat = pos[1];
|
||||
};
|
||||
onMounted(() => {
|
||||
teamId.value = route.query.id || "";
|
||||
|
||||
|
|
@ -432,9 +456,6 @@ onMounted(() => {
|
|||
overflow-y: scroll;
|
||||
overflow-x: hidden !important;
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.detailForm-content {
|
||||
margin-right: 30px;
|
||||
|
|
|
|||
|
|
@ -17,7 +17,11 @@
|
|||
class="center-form"
|
||||
>
|
||||
<el-form-item label="场所名称" prop="name">
|
||||
<el-input placeholder="请输入场所名称" type="input" v-model="formData.name" />
|
||||
<el-input
|
||||
placeholder="请输入场所名称"
|
||||
type="input"
|
||||
v-model="formData.name"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item prop="areaCode" label="所属区域">
|
||||
<el-cascader
|
||||
|
|
@ -41,30 +45,54 @@
|
|||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="面积" prop="space">
|
||||
<el-input-number
|
||||
v-model="formData.space"
|
||||
:min="1"
|
||||
></el-input-number>
|
||||
<el-input-number v-model="formData.space" :min="1"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="经度" prop="lng">
|
||||
<el-input placeholder="请输入" type="input" v-model="formData.lng" />
|
||||
</el-form-item>
|
||||
<el-form-item label="纬度" prop="lat">
|
||||
<el-input placeholder="请输入" type="input" v-model="formData.lat" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="维护单位" prop="maintainunit">
|
||||
<el-input placeholder="请输入维护单位" type="input" v-model="formData.maintainunit" />
|
||||
<el-input
|
||||
placeholder="请输入维护单位"
|
||||
type="input"
|
||||
v-model="formData.maintainunit"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="产权单位" prop="propertyunit">
|
||||
<el-input placeholder="请输入产权单位" type="input" v-model="formData.propertyunit" />
|
||||
<el-input
|
||||
placeholder="请输入产权单位"
|
||||
type="input"
|
||||
v-model="formData.propertyunit"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="建设单位" prop="buildunit">
|
||||
<el-input placeholder="请输入建设单位" type="input" v-model="formData.buildunit" />
|
||||
<el-input
|
||||
placeholder="请输入建设单位"
|
||||
type="input"
|
||||
v-model="formData.buildunit"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="建成时间" prop="buildtime">
|
||||
<el-date-picker
|
||||
v-model="formData.buildtime"
|
||||
type="date"
|
||||
placeholder="请输入建成时间"
|
||||
size="default"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
v-model="formData.buildtime"
|
||||
type="date"
|
||||
placeholder="请输入建成时间"
|
||||
size="default"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="地图：" style="width: 94%;">
|
||||
<Map
|
||||
@change="handleMapChange"
|
||||
:longlat="
|
||||
formData.lng && formData.lat
|
||||
? [formData.lng, formData.lat]
|
||||
: latAndLon
|
||||
"
|
||||
></Map>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
|
@ -91,7 +119,7 @@ const props = defineProps({
|
|||
},
|
||||
form: Object,
|
||||
});
|
||||
|
||||
const latAndLon = ref([101.13, 30.98]);
|
||||
const emits = defineEmits(["close"]);
|
||||
const titleName = ref("新增");
|
||||
// 表单
|
||||
|
|
@ -100,6 +128,8 @@ const ruleForm = reactive<FormRules>({
|
|||
name: [{ required: true, message: "请输入场所名字", trigger: "blur" }],
|
||||
address: [{ required: true, message: "请输入详细地址", trigger: "blur" }],
|
||||
areaCode: [{ required: true, message: "请选择地区", trigger: "blur" }],
|
||||
lng: [{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
lat: [{ required: true, message: "请选择地图点位", trigger: "blur" }],
|
||||
});
|
||||
const formData = ref<any>({});
|
||||
|
||||
|
|
@ -108,24 +138,29 @@ const handleSubmit = () => {
|
|||
formRef.value?.validate((valid) => {
|
||||
if (valid) {
|
||||
let params = {
|
||||
address:formData.value.address,
|
||||
areaCode:'',
|
||||
buildtime:formData.value.buildtime,
|
||||
buildunit:formData.value.buildunit,
|
||||
maintainunit:formData.value.maintainunit,
|
||||
name:formData.value.name,
|
||||
othrefugeid:formData.value.othrefugeid?formData.value.othrefugeid:null,
|
||||
propertyunit:formData.value.propertyunit,
|
||||
space:formData.value.space,
|
||||
address: formData.value.address,
|
||||
areaCode: "",
|
||||
buildtime: formData.value.buildtime,
|
||||
buildunit: formData.value.buildunit,
|
||||
maintainunit: formData.value.maintainunit,
|
||||
name: formData.value.name,
|
||||
othrefugeid: formData.value.othrefugeid
|
||||
? formData.value.othrefugeid
|
||||
: null,
|
||||
propertyunit: formData.value.propertyunit,
|
||||
space: formData.value.space,
|
||||
lng: formData.value.lng,
|
||||
lat: formData.value.lat,
|
||||
};
|
||||
if (formData.value.areaCode instanceof Array) {
|
||||
params.areaCode = formData.value.areaCode[formData.value.areaCode.length - 1];
|
||||
}else{
|
||||
params.areaCode =
|
||||
formData.value.areaCode[formData.value.areaCode.length - 1];
|
||||
} else {
|
||||
params.areaCode = formData.value.areaCode;
|
||||
};
|
||||
}
|
||||
refugeAdd(params).then((res: any) => {
|
||||
console.log(res,'res===>');
|
||||
|
||||
console.log(res, "res===>");
|
||||
|
||||
if (res.code == 1) {
|
||||
ElMessage.success({
|
||||
message: "操作成功",
|
||||
|
|
@ -157,13 +192,18 @@ const getareaTree = () => {
|
|||
orgList.value = res.data;
|
||||
});
|
||||
};
|
||||
// 地图拖拽结束
|
||||
const handleMapChange = (pos) => {
|
||||
formData.value.lng = pos[0];
|
||||
formData.value.lat = pos[1];
|
||||
};
|
||||
onMounted(() => {
|
||||
getareaTree();
|
||||
});
|
||||
watch(
|
||||
() => props.form,
|
||||
(val: any) => {
|
||||
titleName.value = val.id ? "编辑" : "新增";
|
||||
titleName.value = val.othrefugeid ? "编辑" : "新增";
|
||||
formData.value = JSON.parse(JSON.stringify(val));
|
||||
}
|
||||
);
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user