BUG 28264

This commit is contained in:
aixianling
2022-03-16 12:02:38 +08:00
parent 458b03dd0c
commit 92249196a4

View File

@@ -7,14 +7,14 @@
<template slot="left">
<ai-tree-menu title="网格层级" @search="(v) => $refs.tree.filter(v)">
<el-tree
:data="treeObj.treeList"
:props="treeObj.defaultProps"
@node-click="handleNodeClick"
node-key="id"
ref="tree"
:filter-node-method="filterNode"
default-expand-all
highlight-current
:data="treeObj.treeList"
:props="treeObj.defaultProps"
@node-click="handleNodeClick"
node-key="id"
ref="tree"
:filter-node-method="filterNode"
default-expand-all
highlight-current
/>
</ai-tree-menu>
</template>
@@ -22,62 +22,63 @@
<ai-search-bar>
<template slot="left">
<el-date-picker
v-model="searchObj.createTimeStr"
type="date"
@change="(page.current = 1), getList()"
value-format="yyyy-MM-dd"
size="small"
placeholder="创建时间"
v-model="searchObj.createTimeStr"
type="date"
@change="(page.current = 1), getList()"
value-format="yyyy-MM-dd"
size="small"
placeholder="创建时间"
>
</el-date-picker>
</template>
<template slot="right">
<el-input
v-model="searchObj.girdName"
size="small"
placeholder="输入网格名称"
@keyup.enter.native="(page.current = 1), getList()"
clearable
@clear="(searchObj.girdName = '', page.current = 1), getList()"
suffix-icon="iconfont iconSearch"
v-model="searchObj.girdName"
size="small"
placeholder="输入网格名称"
@keyup.enter.native="(page.current = 1), getList()"
clearable
@clear="(searchObj.girdName = '', page.current = 1), getList()"
suffix-icon="iconfont iconSearch"
/>
</template>
</ai-search-bar>
<ai-search-bar bottomBorder>
<template slot="left">
<el-button
type="primary"
icon="iconfont iconAdd"
:disabled="info.girdLevel === '3'"
@click="(isEdit = false), toAdd()"
>新增
type="primary"
icon="iconfont iconAdd"
:disabled="info.girdLevel === '3'"
@click="(isEdit = false), toAdd()"
>新增
</el-button>
<el-button
icon="iconfont iconDelete"
@click="deleteById(ids.join(','))"
:disabled="!Boolean(ids.length)"
icon="iconfont iconDelete"
@click="deleteById(ids.join(','))"
:disabled="!Boolean(ids.length)"
>
删除
</el-button>
<ai-download
:instance="instance"
url="/app/appgirdinfo/exportGirdInfo"
:params="{ ...searchObj, ids: ids.join(',') }"
fileName="网格区块"
:instance="instance"
url="/app/appgirdinfo/exportGirdInfo"
:params="{ ...searchObj, ids: ids.join(',') }"
fileName="网格区块"
>
<el-button icon="iconfont iconExported" size="small"
>导出全部</el-button
>导出全部
</el-button
>
</ai-download>
<ai-import
ref="import"
title="导入"
name="网格区块"
url="/app/appgirdinfo/downloadGirdInfo"
importUrl="/app/appgirdinfo/importGirdInfo"
suffixName="xlsx"
:customCliker="true"
:instance="instance"
ref="import"
title="导入"
name="网格区块"
url="/app/appgirdinfo/downloadGirdInfo"
importUrl="/app/appgirdinfo/importGirdInfo"
suffixName="xlsx"
:customCliker="true"
:instance="instance"
>
<template slot="tips">
<p>
@@ -85,49 +86,51 @@
</p>
</template>
<el-button size="small" icon="iconfont iconImport"
>导入</el-button
>导入
</el-button
>
</ai-import>
</template>
</ai-search-bar>
<ai-table
class="mt10"
:tableData="tableData"
:col-configs="colConfigs"
:total="page.total"
ref="aitableex"
:current.sync="page.current"
:size.sync="page.size"
@selection-change="(v) => (ids = v.map((e) => e.id))"
@getList="getList()"
class="mt10"
:tableData="tableData"
:col-configs="colConfigs"
:total="page.total"
ref="aitableex"
:current.sync="page.current"
:size.sync="page.size"
@selection-change="(v) => (ids = v.map((e) => e.id))"
@getList="getList()"
>
<el-table-column
slot="selectId"
type="selection"
align="center"
width="40"
slot="selectId"
type="selection"
align="center"
width="40"
>
</el-table-column>
<el-table-column
label="网格员"
slot="user"
align="center"
fixed="right"
width="160">
label="网格员"
slot="user"
align="center"
fixed="right"
width="160">
<template slot-scope="{ row }">
<div class="flex-box">
<div v-for="(item, index) in row.girdMemberNames" v-show="index < 3" :key="index">
<AiOpenData type="userName" :openid="item"></AiOpenData><span v-if="index < 2 && index < row.girdMemberNames.length - 1">、</span>
<AiOpenData type="userName" :openid="item"></AiOpenData>
<span v-if="index < 2 && index < row.girdMemberNames.length - 1">、</span>
</div>
</div>
</template>
</el-table-column>
<el-table-column
label="操作"
slot="options"
align="center"
fixed="right"
width="160">
label="操作"
slot="options"
align="center"
fixed="right"
width="160">
<template slot-scope="{ row }">
<div class="table-options">
<el-button type="text" @click="see(row)">编辑</el-button>
@@ -140,43 +143,45 @@
</template>
</ai-list>
<ai-dialog
title="网格范围"
:visible.sync="showMap"
:customFooter="true"
:destroyOnClose="true"
border
width="850px"
title="网格范围"
:visible.sync="showMap"
:customFooter="true"
:destroyOnClose="true"
border
width="850px"
>
<div class="map">
<div class="tipinput">
<el-input
v-if="editRow.plottingStatus == 0"
v-model="searchAddress"
@change="addressChange"
clearable
placeholder="请输入关键字"
id="tipinput"
size="medium"
style="width: 200px"
v-if="editRow.plottingStatus == 0"
v-model="searchAddress"
@change="addressChange"
clearable
placeholder="请输入关键字"
id="tipinput"
size="medium"
style="width: 200px"
></el-input>
</div>
<div id="panel" v-if="editRow.plottingStatus == 0"></div>
<div class="container" id="container"></div>
<el-button-group
style="margin-top: 8px"
v-if="editRow.plottingStatus == 1"
style="margin-top: 8px"
v-if="editRow.plottingStatus == 1"
>
<el-button type="primary" size="mini" @click="beginPoltting()"
>开始编辑</el-button
>开始编辑
</el-button
>
<el-button size="mini" @click="finishPoltting()">结束编辑</el-button>
</el-button-group>
<el-button-group
style="margin-top: 8px"
v-if="editRow.plottingStatus == 0"
style="margin-top: 8px"
v-if="editRow.plottingStatus == 0"
>
<el-button size="mini" @click="draw('polygon')"
>开始绘制多边形</el-button
>开始绘制多边形
</el-button
>
<!-- <el-button size="mini" @click="close()">关闭绘制</el-button> -->
<el-button size="mini" @click="clear()">清除绘制</el-button>
@@ -185,7 +190,8 @@
<div class="dialog-footer" slot="footer">
<el-button size="medium" @click="showMap = false">取消</el-button>
<el-button type="primary" size="medium" @click="confirm()"
>确认</el-button
>确认
</el-button
>
</div>
</ai-dialog>
@@ -197,7 +203,7 @@ import AMapLoader from "@amap/amap-jsapi-loader";
import Template from '../../../../../packages/wechat/AppAskForm/components/Template.vue';
export default {
components: { Template },
components: {Template},
name: "List",
label: "网格区块",
props: {
@@ -253,7 +259,7 @@ export default {
colConfigs() {
let _ = this;
return [
{ type: 'selection'},
{type: 'selection'},
{
prop: "girdName",
align: "left",
@@ -268,7 +274,7 @@ export default {
prop: "girdType",
align: "center",
label: "网格类型",
render(h, { row }) {
render(h, {row}) {
return h("span", {}, _.dict.getLabel("girdType", row.girdType) || '-');
},
},
@@ -276,7 +282,7 @@ export default {
prop: "girdLevel",
align: "center",
label: "网格层级",
render(h, { row }) {
render(h, {row}) {
return h("span", {}, _.dict.getLabel("girdLevel", row.girdLevel) || '-');
},
},
@@ -284,15 +290,15 @@ export default {
prop: "plottingStatus",
align: "center",
label: "标绘状态",
render(h, { row }) {
render(h, {row}) {
return h(
"span",
{
style: {
color: _.dict.getColor("plottingStatus", row.plottingStatus),
"span",
{
style: {
color: _.dict.getColor("plottingStatus", row.plottingStatus),
},
},
},
_.dict.getLabel("plottingStatus", row.plottingStatus)
_.dict.getLabel("plottingStatus", row.plottingStatus)
);
},
},
@@ -300,7 +306,7 @@ export default {
prop: "createTime",
align: "center",
label: "创建时间",
render(h, { row }) {
render(h, {row}) {
return h("span", {}, row.createTime.substring(0, 11));
},
},
@@ -309,41 +315,41 @@ export default {
align: "center",
slot: 'user',
width: 200,
label: "网格员",
label: "网格员",
},
];
},
},
methods: {
getCorpLocation(){
this.instance.post("/app/appdvcpconfig/getCorpLocation").then(res=>{
if(res.code==0){
getCorpLocation() {
this.instance.post("/app/appdvcpconfig/getCorpLocation").then(res => {
if (res.code == 0) {
this.location = res.data
}
})
},
handleNodeClick(val) {
this.info = { ...val };
this.info = {...val};
this.searchId = val.id;
this.getList();
},
getTreeList() {
this.instance
.post("/app/appgirdinfo/listByTop", null, null)
.then((res) => {
if (res.code == 0) {
this.treeObj.treeList = [...res.data];
.post("/app/appgirdinfo/listByTop", null, null)
.then((res) => {
if (res.code == 0) {
this.treeObj.treeList = [...res.data];
this.$nextTick(() => {
if (this.treeObj.treeList.length && !this.info.girdLevel) {
this.$refs.tree.setCurrentKey(this.treeObj.treeList[0].id)
this.info = { ...this.treeObj.treeList[0] };
} else {
this.$refs.tree.setCurrentKey(this.info.id)
}
})
}
});
this.$nextTick(() => {
if (this.treeObj.treeList.length && !this.info.girdLevel) {
this.$refs.tree.setCurrentKey(this.treeObj.treeList[0].id)
this.info = {...this.treeObj.treeList[0]};
} else {
this.$refs.tree.setCurrentKey(this.info.id)
}
})
}
});
},
filterNode(value, data) {
if (!value) return true;
@@ -351,64 +357,66 @@ export default {
},
deleteById(ids) {
ids &&
this.$confirm("是否要删除该网格区块", {
type: "error",
this.$confirm("是否要删除该网格区块", {
type: "error",
})
.then(() => {
this.instance
.post("/app/appgirdinfo/delete", null, {
params: {ids},
})
.then(() => {
this.instance
.post("/app/appgirdinfo/delete", null, {
params: { ids },
})
.then((res) => {
if (res?.code == 0) {
this.$message.success("删除成功!");
.then((res) => {
if (res?.code == 0) {
this.$message.success("删除成功!");
this.getList();
}
});
})
.catch(() => {});
this.getList();
}
});
})
.catch(() => {
});
},
deleteTree(ids) {
ids &&
this.$confirm("是否要删除该网格区块", {
type: "error",
this.$confirm("是否要删除该网格区块", {
type: "error",
})
.then(() => {
this.instance
.post("/app/appgirdinfo/delete", null, {
params: {ids},
})
.then(() => {
this.instance
.post("/app/appgirdinfo/delete", null, {
params: { ids },
})
.then((res) => {
if (res?.code == 0) {
this.$message.success("删除成功!");
.then((res) => {
if (res?.code == 0) {
this.$message.success("删除成功!");
this.getTreeList();
}
});
})
.catch(() => {});
this.getTreeList();
}
});
})
.catch(() => {
});
},
getList() {
this.instance
.post("/app/appgirdinfo/list", null, {
params: {
...this.searchObj,
...this.page,
parentGirdId: this.info.girdLevel === '0' ? '' : this.searchId,
},
})
.then((res) => {
if (res?.data) {
this.tableData = res.data.records.map(v => {
return {
...v,
girdMemberNames: v.girdMemberNames ? v.girdMemberNames.split(',') : []
}
});
this.page.total = res.data.total;
}
});
.post("/app/appgirdinfo/list", null, {
params: {
...this.searchObj,
...this.page,
parentGirdId: this.info.girdLevel === '0' ? '' : this.searchId,
},
})
.then((res) => {
if (res?.data) {
this.tableData = res.data.records.map(v => {
return {
...v,
girdMemberNames: v.girdMemberNames ? v.girdMemberNames.split(',') : []
}
});
this.page.total = res.data.total;
}
});
},
handleSelectionChange(val) {
this.ids = [];
@@ -418,7 +426,7 @@ export default {
},
//添加二级网格
addTwoLevel() {
this.info = { ...this.treeObj.treeList[0] };
this.info = {...this.treeObj.treeList[0]};
this.toAdd()
},
toAdd() {
@@ -437,7 +445,7 @@ export default {
},
poltting(row) {
this.showMap = true;
this.editRow = { ...row };
this.editRow = {...row};
AMapLoader.load({
key: "b553334ba34f7ac3cd09df9bc8b539dc", // 申请好的Web端开发者Key首次调用 load 时必填
version: "2.0", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
@@ -448,52 +456,52 @@ export default {
plugins: [], // 需要加载的 AMapUI ui插件
},
})
.then((AMap) => {
this.map = new AMap.Map("container", {
resizeEnable: true,
zoom: 14,
});
if (this.editRow.plottingStatus == 1) {
let path = [];
this.editRow.points.map((e, index) => {
path[index] = [e.lng, e.lat];
});
let polygon = new AMap.Polygon({
path: path,
strokeColor: "#FF33FF",
strokeWeight: 6,
strokeOpacity: 0.2,
fillOpacity: 0.4,
fillColor: "#1791fc",
zIndex: 50,
bubble: true,
});
this.map.add([polygon]);
this.map.setFitView();
this.polyEditor = new AMap.PolygonEditor(this.map, polygon);
} else {
this.mouseTool = new AMap.MouseTool(this.map);
this.placeSearch = new AMap.PlaceSearch({
pageSize: 3, // 单页显示结果条数
pageIndex: 1, // 页码
city: "", // 兴趣点城市
citylimit: false, //是否强制限制在设置的城市内搜索
map: this.map, // 展现结果的地图实例
panel: "panel", // 结果列表将在此容器中进行展示。
autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
});
// this.map.setZoomAndCenter(14, [this.location.lng, this.location.lat], false, 600);
this.eventOn();
}
})
.catch((e) => {
console.log(e);
.then((AMap) => {
this.map = new AMap.Map("container", {
resizeEnable: true,
zoom: 14,
});
if (this.editRow.plottingStatus == 1) {
let path = [];
this.editRow.points.map((e, index) => {
path[index] = [e.lng, e.lat];
});
let polygon = new AMap.Polygon({
path: path,
strokeColor: "#FF33FF",
strokeWeight: 6,
strokeOpacity: 0.2,
fillOpacity: 0.4,
fillColor: "#1791fc",
zIndex: 50,
bubble: true,
});
this.map.add([polygon]);
this.map.setFitView();
this.polyEditor = new AMap.PolygonEditor(this.map, polygon);
} else {
this.mouseTool = new AMap.MouseTool(this.map);
this.placeSearch = new AMap.PlaceSearch({
pageSize: 3, // 单页显示结果条数
pageIndex: 1, // 页码
city: "", // 兴趣点城市
citylimit: false, //是否强制限制在设置的城市内搜索
map: this.map, // 展现结果的地图实例
panel: "panel", // 结果列表将在此容器中进行展示。
autoFitView: true, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
});
// this.map.setZoomAndCenter(14, [this.location.lng, this.location.lat], false, 600);
this.eventOn();
}
})
.catch((e) => {
console.log(e);
});
},
see(row) {
this.info = { ...row };
this.info = {...row};
this.isEdit = true;
this.toAdd()
this.toAdd()
},
draw(type) {
switch (type) {
@@ -560,39 +568,35 @@ export default {
let path = [];
if (this.editRow.plottingStatus == 1) {
this.polyEditor
.getTarget()
.getPath()
.map((e) => {
path.push({ lng: e.lng, lat: e.lat });
});
.getTarget()
.getPath()
.map((e) => {
path.push({lng: e.lng, lat: e.lat});
});
} else {
path = [...this.path];
}
delete this.editRow.points;
this.instance
.post(
`/app/appgirdinfo/addOrUpdate`,
{
...this.editRow,
points: path,
},
null
)
.then((res) => {
if (res.code == 0) {
this.getList();
this.showMap = false;
}
});
let {girdMemberNames} = this.editRow
this.instance.post(`/app/appgirdinfo/addOrUpdate`, {
...this.editRow,
points: path,
girdMemberNames: girdMemberNames?.toString()
}).then((res) => {
if (res.code == 0) {
this.getList();
this.showMap = false;
}
});
},
eventOn() {
this.path = [];
this.overlays = [];
this.map.on("mousemove", this.showInfoMove, this);
this.mouseTool.on("draw", ({ type, obj }) => {
this.mouseTool.on("draw", ({type, obj}) => {
obj.getPath().map((e) => {
console.log(e)
this.path.push({ lat: e.getLat(), lng: e.getLng() });
this.path.push({lat: e.getLat(), lng: e.getLng()});
});
this.overlays.push(obj);
});
@@ -611,11 +615,12 @@ export default {
.app-grid-block {
width: 100%;
height: 100%;
::v-deep .el-tree {
background: transparent;
.el-tree-node__expand-icon.is-leaf {
color: transparent!important;
color: transparent !important;
}
.el-tree-node__content > .el-tree-node__expand-icon {
@@ -648,7 +653,7 @@ export default {
}
background: #2266FF;
span {
color: #fff;
}