Merge branch 'dev' of http://192.168.18.88:8077/sznyb/daimp-front into dev
This commit is contained in:
commit
e1d6d9da99
@ -0,0 +1,51 @@
|
||||
import request from '@/utils/axios';
|
||||
|
||||
/**
|
||||
* @Title: 列表
|
||||
*/
|
||||
export function GetEntityList(params = {}) {
|
||||
return request('/cultivation-keep/api/cultivationbreedingbase/list', {
|
||||
method: 'POST',
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 新增
|
||||
*/
|
||||
export function AddEntity(data = {}) {
|
||||
return request('/cultivation-keep/api/cultivationbreedingbase/add', {
|
||||
method: 'POST',
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 修改
|
||||
*/
|
||||
export function UpdateEntity(data = {}) {
|
||||
return request('/cultivation-keep/api/cultivationbreedingbase/update', {
|
||||
method: 'POST',
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 删除
|
||||
*/
|
||||
export function DeleteEntity(params = {}) {
|
||||
return request('/cultivation-keep/api/cultivationbreedingbase/del', {
|
||||
method: 'POST',
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 更改状态
|
||||
*/
|
||||
export function UpdateStatus(params = {}) {
|
||||
return request('/cultivation-keep/api/cultivationbreedingbase/changeStatus', {
|
||||
method: 'POST',
|
||||
params,
|
||||
});
|
||||
}
|
||||
@ -10,15 +10,6 @@ export function GetEntityList(params = {}) {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 信息
|
||||
*/
|
||||
export function GetEntity(id) {
|
||||
return request(`/system/dept/list/exclude/${id}`, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 新增
|
||||
*/
|
||||
@ -43,7 +34,7 @@ export function UpdateEntity(data = {}) {
|
||||
* @Title: 删除
|
||||
*/
|
||||
export function DeleteEntity(params = {}) {
|
||||
return request(`/system/dict/type/${params.id}`, {
|
||||
return request(`/system/dept/${params.id}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
}
|
||||
@ -56,3 +47,12 @@ export function GetDeptExcludeChild(id) {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 信息
|
||||
*/
|
||||
export function GetDept(id) {
|
||||
return request(`/system/dept/list/exclude/${id}`, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
62
sub-government-affairs-service/src/apis/system/menu.js
Normal file
62
sub-government-affairs-service/src/apis/system/menu.js
Normal file
@ -0,0 +1,62 @@
|
||||
import request from '@/utils/axios';
|
||||
|
||||
/**
|
||||
* @Title: 列表
|
||||
*/
|
||||
export function GetEntityList(params = {}) {
|
||||
return request('/system/menu/list', {
|
||||
method: 'GET',
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 新增
|
||||
*/
|
||||
export function AddEntity(data = {}) {
|
||||
return request('/system/menu', {
|
||||
method: 'POST',
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 修改
|
||||
*/
|
||||
export function UpdateEntity(data = {}) {
|
||||
return request('/system/menu', {
|
||||
method: 'PUT',
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @Title: 删除
|
||||
*/
|
||||
export function DeleteEntity(params = {}) {
|
||||
return request(`/system/menu/${params.id}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
}
|
||||
|
||||
// 查询菜单详细
|
||||
export function GetMenu(dictType) {
|
||||
return request(`/system/menu/${dictType}`, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
// 查询菜单下拉树结构
|
||||
// 返回parentId
|
||||
export function GetMenuTree() {
|
||||
return request('/system/menu/treeselect', {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
||||
// 根据角色ID查询菜单下拉树结构
|
||||
export function GetRoleMenu(roleId) {
|
||||
return request(`/system/menu/roleMenuTreeselect/${roleId}`, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
@ -20,6 +20,18 @@ export default [
|
||||
name: 'system-dict',
|
||||
meta: { title: '字典管理', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/system-menu',
|
||||
component: () => import('@/views/system/menu/index.vue'),
|
||||
name: 'system-menu',
|
||||
meta: { title: '菜单管理', icon: 'Document' },
|
||||
},
|
||||
// {
|
||||
// path: '/sub-government-affairs-service/system-dept',
|
||||
// component: () => import('@/views/system/dept/index.vue'),
|
||||
// name: 'system-dept',
|
||||
// meta: { title: '部门管理', icon: 'Document' },
|
||||
// },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
@ -52,25 +52,17 @@ export default [
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-manage',
|
||||
name: 'trace-manage',
|
||||
component: Views,
|
||||
meta: { title: '溯源查询和统计', icon: 'Document' },
|
||||
children: [
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-search',
|
||||
name: 'trace-search',
|
||||
component: () => import('@/views/trace/search/index.vue'),
|
||||
meta: { title: '溯源查询', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-info',
|
||||
name: 'trace-info',
|
||||
component: () => import('@/views/trace/search/info.vue'),
|
||||
meta: { title: '溯源详情', icon: 'Document' },
|
||||
hidden: true,
|
||||
},
|
||||
],
|
||||
path: '/sub-government-affairs-service/trace-search',
|
||||
name: 'trace-search',
|
||||
component: () => import('@/views/trace/search/index.vue'),
|
||||
meta: { title: '溯源查询', icon: 'Document' },
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-info',
|
||||
name: 'trace-info',
|
||||
component: () => import('@/views/trace/search/info.vue'),
|
||||
meta: { title: '溯源详情', icon: 'Document' },
|
||||
hidden: true,
|
||||
},
|
||||
{
|
||||
path: '/sub-government-affairs-service/trace-statistic',
|
||||
|
||||
@ -39,8 +39,9 @@ import { useRouter } from 'vue-router';
|
||||
import { useApp } from '@/hooks';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import { isEmpty, mockData, sleep, setDicData } from '@/utils';
|
||||
import { isEmpty, setDicData, debounce } from '@/utils';
|
||||
import { getLandsList } from '@/apis/land';
|
||||
import { GetEntityList, AddEntity, UpdateEntity, DeleteEntity, UpdateStatus } from '@/apis/plantingAndBreeding/base';
|
||||
|
||||
const { VITE_APP_BASE_API } = import.meta.env;
|
||||
const app = useApp();
|
||||
@ -61,7 +62,7 @@ const state = reactive({
|
||||
column: [
|
||||
{
|
||||
label: '基地名称',
|
||||
prop: 'p1',
|
||||
prop: 'baseName',
|
||||
search: true,
|
||||
width: 200,
|
||||
rules: {
|
||||
@ -72,8 +73,8 @@ const state = reactive({
|
||||
overHidden: true,
|
||||
},
|
||||
{
|
||||
label: '基地分类',
|
||||
prop: 'type',
|
||||
label: '基地类型',
|
||||
prop: 'baseType',
|
||||
type: 'select',
|
||||
search: true,
|
||||
props: {
|
||||
@ -95,7 +96,20 @@ const state = reactive({
|
||||
label: '地块名',
|
||||
prop: 'landName',
|
||||
width: 200,
|
||||
addDisplay: false,
|
||||
editDisplay: false,
|
||||
viewDisplay: true,
|
||||
overHidden: true,
|
||||
},
|
||||
{
|
||||
label: '地块名',
|
||||
prop: 'landId',
|
||||
width: 200,
|
||||
type: 'select',
|
||||
hide: true,
|
||||
addDisplay: true,
|
||||
editDisplay: true,
|
||||
viewDisplay: false,
|
||||
props: {
|
||||
label: 'landName',
|
||||
value: 'id',
|
||||
@ -108,37 +122,28 @@ const state = reactive({
|
||||
filterable: true,
|
||||
remote: true,
|
||||
clearable: true,
|
||||
remoteMethod: (val) => remoteLandList(val),
|
||||
remoteMethod: (val) => debounce(remoteLandList(val), 200),
|
||||
change: (val) => selectedChange(val),
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
// addDisplay: true,
|
||||
// editDisplay: true,
|
||||
// viewDisplay: false,
|
||||
// overHidden: true,
|
||||
},
|
||||
{
|
||||
label: '区域位置',
|
||||
prop: 'p3',
|
||||
prop: 'address',
|
||||
width: 200,
|
||||
overHidden: true,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
disabled: true,
|
||||
labelTip: '请先选择地块！',
|
||||
},
|
||||
{
|
||||
label: '区域面积',
|
||||
prop: 'p4',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
prop: 'area',
|
||||
width: 100,
|
||||
disabled: true,
|
||||
labelTip: '请先选择地块！',
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
@ -154,6 +159,7 @@ const state = reactive({
|
||||
value: 0,
|
||||
},
|
||||
],
|
||||
value: 1,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -162,7 +168,7 @@ const state = reactive({
|
||||
},
|
||||
{
|
||||
label: '负责人',
|
||||
prop: 'p5',
|
||||
prop: 'contactPerson',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
@ -171,7 +177,7 @@ const state = reactive({
|
||||
},
|
||||
{
|
||||
label: '联系电话',
|
||||
prop: 'p6',
|
||||
prop: 'contactPhone',
|
||||
width: 150,
|
||||
rules: {
|
||||
required: true,
|
||||
@ -181,15 +187,14 @@ const state = reactive({
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
prop: 'createTime',
|
||||
width: 150,
|
||||
// search: true,
|
||||
prop: 'createdAt',
|
||||
width: 200,
|
||||
display: false,
|
||||
},
|
||||
{
|
||||
label: '更新时间',
|
||||
prop: 'updateTime',
|
||||
width: 150,
|
||||
prop: 'updatedAt',
|
||||
width: 200,
|
||||
display: false,
|
||||
},
|
||||
],
|
||||
@ -204,16 +209,16 @@ const state = reactive({
|
||||
icon: 'edit',
|
||||
event: ({ row }) => rowEdit(row),
|
||||
},
|
||||
// {
|
||||
// type: 'success',
|
||||
// name: ({ row }) => {
|
||||
// return row.status === 1 ? '禁用' : '启用';
|
||||
// },
|
||||
// icon: ({ row }) => {
|
||||
// return row.status === 1 ? 'turnOff' : 'open';
|
||||
// },
|
||||
// event: ({ row }) => rowStatus(row),
|
||||
// },
|
||||
{
|
||||
type: 'primary',
|
||||
name: ({ row }) => {
|
||||
return row.status === 1 ? '禁用' : '启用';
|
||||
},
|
||||
icon: ({ row }) => {
|
||||
return row.status === 1 ? 'turnOff' : 'open';
|
||||
},
|
||||
event: ({ row }) => rowStatus(row),
|
||||
},
|
||||
{
|
||||
type: 'danger',
|
||||
name: '删除',
|
||||
@ -233,45 +238,26 @@ const state = reactive({
|
||||
|
||||
// 加载
|
||||
const loadData = async () => {
|
||||
//state.loading = true;
|
||||
// GetEntityList(state.query)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// const { current, size, total, records } = res.data;
|
||||
// state.data = records;
|
||||
// state.pageData = {
|
||||
// currentPage: current || 1,
|
||||
// pageSize: size || 10,
|
||||
// total: total,
|
||||
// };
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// state.data = [];
|
||||
// })
|
||||
// .finally(() => {
|
||||
// state.loading = false;
|
||||
// });
|
||||
|
||||
state.loading = true;
|
||||
await sleep(500);
|
||||
state.data = mockData(
|
||||
{
|
||||
p1: '耿马镇一号基地',
|
||||
landName: '耿马镇2025001号地块',
|
||||
p3: '耿马傣族佤族自治县/耿马镇',
|
||||
p4: '1000',
|
||||
p5: '张三',
|
||||
p6: '13837633838',
|
||||
status: 1,
|
||||
type: 'base_plant',
|
||||
createTime: '2025-01-01',
|
||||
updateTime: '2025-01-15',
|
||||
},
|
||||
10
|
||||
);
|
||||
state.loading = false;
|
||||
GetEntityList(state.query)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
const { current, size, total, records } = res.data;
|
||||
state.data = records;
|
||||
state.pageData = {
|
||||
currentPage: current || 1,
|
||||
pageSize: size || 10,
|
||||
total: total,
|
||||
};
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
state.data = [];
|
||||
})
|
||||
.finally(() => {
|
||||
state.loading = false;
|
||||
});
|
||||
};
|
||||
|
||||
loadData();
|
||||
@ -313,29 +299,36 @@ const rowView = (row) => {
|
||||
};
|
||||
|
||||
// 启用、禁用
|
||||
// const rowStatus = (row) => {
|
||||
// console.info('操作状态');
|
||||
// };
|
||||
const rowStatus = (row) => {
|
||||
let status = row.status === 1 ? 0 : 1;
|
||||
UpdateStatus({ id: row.id, status })
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('状态更改成功！');
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
});
|
||||
};
|
||||
|
||||
// 新增
|
||||
// const onAdd = () => {
|
||||
// crudRef.value && crudRef.value.rowAdd();
|
||||
// };
|
||||
const rowSave = (row, done, loading) => {
|
||||
// AddEntity(row)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('添加成功！');
|
||||
// done();
|
||||
// loadData();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
AddEntity(row)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('添加成功！');
|
||||
done();
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
})
|
||||
.finally(() => {
|
||||
loading();
|
||||
});
|
||||
};
|
||||
|
||||
// 编辑
|
||||
@ -344,20 +337,20 @@ const rowEdit = (row) => {
|
||||
};
|
||||
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
// UpdateEntity(row)
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('更新成功！');
|
||||
// done();
|
||||
// loadData();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// loading();
|
||||
// });
|
||||
UpdateEntity(row)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('更新成功！');
|
||||
done();
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
})
|
||||
.finally(() => {
|
||||
loading();
|
||||
});
|
||||
};
|
||||
|
||||
// 删除
|
||||
@ -371,16 +364,16 @@ const onDel = (rows = []) => {
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
// DeleteEntity({ ids: ids.join(',') })
|
||||
// .then((res) => {
|
||||
// if (res.code === 200) {
|
||||
// app.$message.success('删除成功！');
|
||||
// loadData();
|
||||
// }
|
||||
// })
|
||||
// .catch((err) => {
|
||||
// app.$message.error(err.msg);
|
||||
// });
|
||||
DeleteEntity({ ids: ids.join(',') })
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('删除成功！');
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
@ -391,16 +384,26 @@ const rowDel = (row, index, done) => {
|
||||
|
||||
// 远程搜搜
|
||||
const remoteLandList = async (val) => {
|
||||
if (isEmpty(val)) return;
|
||||
if (!isEmpty(val)) return;
|
||||
const query = { landName: val, current: 1, size: 20 };
|
||||
const res = await getLandsList(query);
|
||||
if (res.code === 200) {
|
||||
setDicData(state.options.column, 'landName', res.data.records);
|
||||
setDicData(state.options.column, 'landId', res.data.records);
|
||||
}
|
||||
};
|
||||
|
||||
// 选择赋值
|
||||
const selectedChange = ({ value, item }) => {
|
||||
console.log(430, value, item, item.landName, item.address, item.area);
|
||||
const selectedChange = ({ item, value, dic }) => {
|
||||
// console.log(390, value, item);
|
||||
crudRef.value.tableForm.landId = item?.id;
|
||||
crudRef.value.tableForm.landName = item?.landName;
|
||||
crudRef.value.tableForm.address = item?.address;
|
||||
crudRef.value.tableForm.area = item?.area;
|
||||
crudRef.value.tableForm.provinceCode = item?.provinceCode;
|
||||
// crudRef.value.tableForm.provinceName = item?.provinceName;
|
||||
crudRef.value.tableForm.cityCode = item?.cityCode;
|
||||
crudRef.value.tableForm.districtCode = item?.county;
|
||||
crudRef.value.tableForm.townCode = item?.townCode;
|
||||
crudRef.value.tableForm.villageCode = item?.villageCode;
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -15,6 +15,11 @@
|
||||
@row-update="rowUpdate"
|
||||
@row-del="rowDel"
|
||||
>
|
||||
<template #status="{ row }">
|
||||
<el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
|
||||
<el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
|
||||
</template>
|
||||
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="state.options.actions" :data="scope" />
|
||||
</template>
|
||||
@ -26,9 +31,12 @@ import { reactive, ref } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import { isEmpty, getTree } from '@/utils';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { GetEntityList, AddEntity, UpdateEntity, DeleteEntity } from '@/apis/system/dept';
|
||||
|
||||
const { VITE_APP_BASE_API } = import.meta.env;
|
||||
const app = useApp();
|
||||
const UserStore = useUserStore();
|
||||
const crudRef = ref(null);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
@ -40,18 +48,39 @@ const state = reactive({
|
||||
rowKey: 'deptId',
|
||||
index: false,
|
||||
selection: false,
|
||||
expand: true,
|
||||
tree: true,
|
||||
defaultExpandAll: true,
|
||||
treeProps: { children: 'children', hasChildren: 'hasChildren' },
|
||||
column: [
|
||||
{
|
||||
label: '部门名称',
|
||||
prop: 'deptName',
|
||||
search: true,
|
||||
width: 200,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '上级部门',
|
||||
prop: 'parentId',
|
||||
type: 'select',
|
||||
hide: true,
|
||||
props: {
|
||||
label: 'deptName',
|
||||
value: 'deptId',
|
||||
},
|
||||
dicUrl: `${VITE_APP_BASE_API}/system/dept/list`,
|
||||
dicHeaders: {
|
||||
authorization: UserStore.token,
|
||||
},
|
||||
dicFormatter: (res) => {
|
||||
const data = [{ deptId: 0, deptName: '根目录' }, ...res.data];
|
||||
return data;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '状态',
|
||||
prop: 'status',
|
||||
@ -70,7 +99,7 @@ const state = reactive({
|
||||
value: '0',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
@ -137,7 +166,6 @@ const loadData = () => {
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
state.data = getTree(res.data, 'deptId');
|
||||
console.log(139, state.data);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
@ -223,7 +251,7 @@ const rowDel = (row, index, done) => {
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
DeleteEntity({ id: row.id })
|
||||
DeleteEntity({ id: row.deptId })
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('删除成功！');
|
||||
|
||||
@ -18,6 +18,11 @@
|
||||
@row-update="rowUpdate"
|
||||
@row-del="rowDel"
|
||||
>
|
||||
<template #status="{ row }">
|
||||
<el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
|
||||
<el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
|
||||
</template>
|
||||
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="state.options.actions" :data="scope" />
|
||||
</template>
|
||||
@ -48,13 +53,6 @@ const state = reactive({
|
||||
...CRUD_OPTIONS,
|
||||
selection: false,
|
||||
column: [
|
||||
// {
|
||||
// label: '编码',
|
||||
// prop: 'dictCode',
|
||||
// addDisplay: false,
|
||||
// editDisplay: false,
|
||||
// viewDisplay: false,
|
||||
// },
|
||||
{
|
||||
label: '字典名称',
|
||||
prop: 'dictLabel',
|
||||
@ -116,6 +114,12 @@ const state = reactive({
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '排序',
|
||||
prop: 'dictSort',
|
||||
type: 'number',
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '备注',
|
||||
prop: 'remark',
|
||||
|
||||
@ -18,6 +18,11 @@
|
||||
@row-update="rowUpdate"
|
||||
@row-del="rowDel"
|
||||
>
|
||||
<template #status="{ row }">
|
||||
<el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
|
||||
<el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
|
||||
</template>
|
||||
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="state.options.actions" :data="scope" />
|
||||
</template>
|
||||
|
||||
490
sub-government-affairs-service/src/views/system/menu/index.vue
Normal file
490
sub-government-affairs-service/src/views/system/menu/index.vue
Normal file
@ -0,0 +1,490 @@
|
||||
<template>
|
||||
<div class="custom-page">
|
||||
<el-row :gutter="20">
|
||||
<splitpanes class="default-theme">
|
||||
<pane size="16">
|
||||
<el-col>
|
||||
<custom-table-tree title="应用分类" :data="treeData" :option="treeOption" filter @node-click="handleNodeClick">
|
||||
<template #default="{ data }">
|
||||
<div :class="{ 'text-primary': data.dictValue == treeSelected.dictValue }">
|
||||
{{ data.dictLabel }}
|
||||
</div>
|
||||
</template>
|
||||
</custom-table-tree>
|
||||
</el-col>
|
||||
</pane>
|
||||
<pane size="84">
|
||||
<el-col>
|
||||
<avue-crud
|
||||
ref="crudRef"
|
||||
v-model="state.form"
|
||||
v-model:search="state.query"
|
||||
:table-loading="state.loading"
|
||||
:data="state.data"
|
||||
:option="state.options"
|
||||
@refresh-change="refreshChange"
|
||||
@search-reset="searchChange"
|
||||
@search-change="searchChange"
|
||||
@selection-change="selectionChange"
|
||||
@row-save="rowSave"
|
||||
@row-update="rowUpdate"
|
||||
@row-del="rowDel"
|
||||
>
|
||||
<template #menuType="{ row }">
|
||||
<el-tag v-if="row.menuType == 'M'" type="primary">目录</el-tag>
|
||||
<el-tag v-if="row.menuType == 'C'" type="success">菜单</el-tag>
|
||||
<el-tag v-if="row.menuType == 'F'" type="info">按钮</el-tag>
|
||||
</template>
|
||||
|
||||
<template #status="{ row }">
|
||||
<el-tag v-if="row.status == 0" type="success">启用</el-tag>
|
||||
<el-tag v-if="row.status == 1" type="danger">禁用</el-tag>
|
||||
</template>
|
||||
|
||||
<template #menu="scope">
|
||||
<custom-table-operate :actions="state.options.actions" :data="scope" />
|
||||
</template>
|
||||
</avue-crud>
|
||||
</el-col>
|
||||
</pane>
|
||||
</splitpanes>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { computed, onMounted, reactive, ref } from 'vue';
|
||||
import { useApp } from '@/hooks';
|
||||
import { CRUD_OPTIONS } from '@/config';
|
||||
import { isEmpty, getTree, getParentIds, setPropDisplay } from '@/utils';
|
||||
import { useUserStore } from '@/store/modules/user';
|
||||
import { GetEntityList, AddEntity, UpdateEntity, DeleteEntity } from '@/apis/system/menu';
|
||||
import { CommonDicData } from '@/apis';
|
||||
|
||||
const { VITE_APP_BASE_API, VITE_APP_NAME } = import.meta.env;
|
||||
const app = useApp();
|
||||
const UserStore = useUserStore();
|
||||
const crudRef = ref(null);
|
||||
const treeData = ref([]);
|
||||
const treeOption = ref({
|
||||
nodeKey: 'id',
|
||||
props: { children: 'children', label: 'dictLabel', id: 'dictValue' },
|
||||
});
|
||||
const treeSelected = ref({});
|
||||
const dicUrl = computed(() => `${VITE_APP_BASE_API}/system/menu/treeselect?appId=${treeSelected.value?.dictValue ?? VITE_APP_NAME}`);
|
||||
const state = reactive({
|
||||
loading: false,
|
||||
query: {},
|
||||
form: {},
|
||||
selection: [],
|
||||
options: {
|
||||
...CRUD_OPTIONS,
|
||||
rowKey: 'menuId',
|
||||
index: false,
|
||||
selection: false,
|
||||
tree: true,
|
||||
defaultExpandAll: false,
|
||||
treeProps: { children: 'children', hasChildren: 'hasChildren' },
|
||||
column: [
|
||||
{
|
||||
label: '菜单名称',
|
||||
prop: 'menuName',
|
||||
search: true,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '菜单分类',
|
||||
prop: 'appId',
|
||||
type: 'select',
|
||||
hide: true,
|
||||
props: {
|
||||
label: 'dictLabel',
|
||||
value: 'dictValue',
|
||||
},
|
||||
dicUrl: `${VITE_APP_BASE_API}/system/dict/data/type/sys_app_type`,
|
||||
dicHeaders: {
|
||||
authorization: UserStore.token,
|
||||
},
|
||||
dicFormatter: (res) => {
|
||||
return res.data;
|
||||
},
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '菜单类型',
|
||||
prop: 'menuType',
|
||||
type: 'select',
|
||||
dicData: [
|
||||
{
|
||||
label: '目录',
|
||||
value: 'M',
|
||||
},
|
||||
{
|
||||
label: '菜单',
|
||||
value: 'C',
|
||||
},
|
||||
{
|
||||
label: '按钮',
|
||||
value: 'F',
|
||||
},
|
||||
],
|
||||
change: (val) => changeMenuType(val),
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '上级菜单',
|
||||
prop: 'pids',
|
||||
type: 'cascader',
|
||||
checkStrictly: true,
|
||||
hide: true,
|
||||
props: {
|
||||
label: 'label',
|
||||
value: 'id',
|
||||
},
|
||||
dicUrl: dicUrl,
|
||||
dicFlag: true,
|
||||
dicHeaders: {
|
||||
authorization: UserStore.token,
|
||||
},
|
||||
dicFormatter: (res) => {
|
||||
return res.data;
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '菜单图标',
|
||||
prop: 'icon',
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '路由名称',
|
||||
prop: 'routeName',
|
||||
width: 200,
|
||||
overHidden: true,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '路由地址',
|
||||
prop: 'path',
|
||||
width: 200,
|
||||
overHidden: true,
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '组件路径',
|
||||
prop: 'component',
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '路由参数',
|
||||
prop: 'query',
|
||||
hide: true,
|
||||
},
|
||||
{
|
||||
label: '权限标识',
|
||||
prop: 'perms',
|
||||
},
|
||||
{
|
||||
label: '菜单状态',
|
||||
prop: 'status',
|
||||
type: 'select',
|
||||
search: true,
|
||||
dicData: [
|
||||
{
|
||||
label: '启用',
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
label: '禁用',
|
||||
value: '1',
|
||||
},
|
||||
],
|
||||
value: '0',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '菜单顺序',
|
||||
prop: 'orderNum',
|
||||
type: 'number',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请输入',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '是否外链',
|
||||
prop: 'isFrame',
|
||||
type: 'select',
|
||||
hide: true,
|
||||
// labelTip: '选择是外链则路由地址需要以`http(s)://`开头',
|
||||
dicData: [
|
||||
{
|
||||
label: '是',
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
label: '否',
|
||||
value: '1',
|
||||
},
|
||||
],
|
||||
value: '1',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '显示状态',
|
||||
prop: 'visible',
|
||||
type: 'select',
|
||||
hide: true,
|
||||
dicData: [
|
||||
{
|
||||
label: '显示',
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
label: '隐藏',
|
||||
value: '1',
|
||||
},
|
||||
],
|
||||
value: '0',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '是否缓存',
|
||||
prop: 'isCache',
|
||||
type: 'select',
|
||||
hide: true,
|
||||
dicData: [
|
||||
{
|
||||
label: '缓存',
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
label: '不缓存',
|
||||
value: '1',
|
||||
},
|
||||
],
|
||||
value: '0',
|
||||
rules: {
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'blur',
|
||||
},
|
||||
},
|
||||
],
|
||||
actions: [
|
||||
{
|
||||
name: '查看',
|
||||
icon: 'view',
|
||||
event: ({ row }) => rowView(row),
|
||||
},
|
||||
{
|
||||
name: '编辑',
|
||||
icon: 'edit',
|
||||
event: ({ row }) => rowEdit(row),
|
||||
},
|
||||
{
|
||||
type: 'danger',
|
||||
name: '删除',
|
||||
icon: 'delete',
|
||||
event: ({ row }) => rowDel(row),
|
||||
},
|
||||
],
|
||||
},
|
||||
data: [],
|
||||
});
|
||||
|
||||
// tree
|
||||
const getMenuTree = async () => {
|
||||
try {
|
||||
const res = await CommonDicData('sys_app_type');
|
||||
if (res.code == 200) {
|
||||
treeData.value = res.data;
|
||||
}
|
||||
} catch (err) {
|
||||
app.$message.error(err.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const handleNodeClick = (data) => {
|
||||
treeSelected.value = data;
|
||||
state.query.appId = data.dictValue;
|
||||
loadData();
|
||||
};
|
||||
|
||||
getMenuTree();
|
||||
|
||||
// 加载
|
||||
const loadData = () => {
|
||||
state.loading = true;
|
||||
GetEntityList(state.query)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
state.data = getTree(res.data, 'menuId');
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
state.data = [];
|
||||
})
|
||||
.finally(() => {
|
||||
state.loading = false;
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
loadData();
|
||||
});
|
||||
|
||||
// 搜索
|
||||
const searchChange = (params, done) => {
|
||||
if (done) done();
|
||||
state.query = params;
|
||||
loadData();
|
||||
};
|
||||
|
||||
// 刷新
|
||||
const refreshChange = () => {
|
||||
loadData();
|
||||
app.$message.success('刷新成功');
|
||||
};
|
||||
|
||||
// 选择
|
||||
const selectionChange = (rows) => {
|
||||
state.selection = rows;
|
||||
};
|
||||
|
||||
const changeMenuType = ({ value }) => {
|
||||
console.log(value);
|
||||
switch (value) {
|
||||
case 'M': {
|
||||
const fields = ['routeName', 'component', 'perms', 'query', 'isCache'];
|
||||
setPropDisplay(state.options.column, fields);
|
||||
break;
|
||||
}
|
||||
case 'C': {
|
||||
const fields = [];
|
||||
setPropDisplay(state.options.column, fields);
|
||||
break;
|
||||
}
|
||||
case 'F': {
|
||||
const fields = ['icon', 'routeName', 'path', 'component', 'query', 'isFrame', 'visible', 'isCache'];
|
||||
setPropDisplay(state.options.column, fields);
|
||||
break;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 查看
|
||||
const rowView = (row) => {
|
||||
crudRef.value.rowView(row);
|
||||
};
|
||||
|
||||
const setPid = (row) => {
|
||||
if (!isEmpty(row.pids)) {
|
||||
const len = row.pids.length;
|
||||
row.parentId = row?.pids[len - 1] ?? 0;
|
||||
}
|
||||
};
|
||||
|
||||
// 新增
|
||||
const rowSave = (row, done, loading) => {
|
||||
setPid(row);
|
||||
AddEntity(row)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('添加成功！');
|
||||
done();
|
||||
getMenuTree();
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
})
|
||||
.finally(() => {
|
||||
loading();
|
||||
});
|
||||
};
|
||||
|
||||
// 编辑
|
||||
const rowEdit = (row) => {
|
||||
// row.pids = getParentIds(treeData.value, row.menuId, 'menuId');
|
||||
row.pids = getParentIds(state.data, row.menuId, 'menuId');
|
||||
crudRef.value.rowEdit(row);
|
||||
};
|
||||
|
||||
const rowUpdate = (row, index, done, loading) => {
|
||||
setPid(row);
|
||||
UpdateEntity(row)
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('更新成功！');
|
||||
done();
|
||||
getMenuTree();
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
})
|
||||
.finally(() => {
|
||||
loading();
|
||||
});
|
||||
};
|
||||
|
||||
// 删除
|
||||
const rowDel = (row, index, done) => {
|
||||
if (isEmpty(row)) return;
|
||||
app
|
||||
.$confirm(`删除后信息将不可查看，确认要删除吗？`, '确定删除', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
DeleteEntity({ id: row.menuId })
|
||||
.then((res) => {
|
||||
if (res.code === 200) {
|
||||
app.$message.success('删除成功！');
|
||||
getMenuTree();
|
||||
loadData();
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
app.$message.error(err.msg);
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
</script>
|
||||
75
sub-government-screen-service/auto-imports.d.ts
vendored
Normal file
75
sub-government-screen-service/auto-imports.d.ts
vendored
Normal file
@ -0,0 +1,75 @@
|
||||
/* eslint-disable */
|
||||
/* prettier-ignore */
|
||||
// @ts-nocheck
|
||||
// noinspection JSUnusedGlobalSymbols
|
||||
// Generated by unplugin-auto-import
|
||||
export {}
|
||||
declare global {
|
||||
const EffectScope: typeof import('vue')['EffectScope']
|
||||
const computed: typeof import('vue')['computed']
|
||||
const createApp: typeof import('vue')['createApp']
|
||||
const customRef: typeof import('vue')['customRef']
|
||||
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
|
||||
const defineComponent: typeof import('vue')['defineComponent']
|
||||
const effectScope: typeof import('vue')['effectScope']
|
||||
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
|
||||
const getCurrentScope: typeof import('vue')['getCurrentScope']
|
||||
const h: typeof import('vue')['h']
|
||||
const inject: typeof import('vue')['inject']
|
||||
const isProxy: typeof import('vue')['isProxy']
|
||||
const isReactive: typeof import('vue')['isReactive']
|
||||
const isReadonly: typeof import('vue')['isReadonly']
|
||||
const isRef: typeof import('vue')['isRef']
|
||||
const markRaw: typeof import('vue')['markRaw']
|
||||
const nextTick: typeof import('vue')['nextTick']
|
||||
const onActivated: typeof import('vue')['onActivated']
|
||||
const onBeforeMount: typeof import('vue')['onBeforeMount']
|
||||
const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
|
||||
const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
|
||||
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
|
||||
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
|
||||
const onDeactivated: typeof import('vue')['onDeactivated']
|
||||
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
|
||||
const onMounted: typeof import('vue')['onMounted']
|
||||
const onRenderTracked: typeof import('vue')['onRenderTracked']
|
||||
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
|
||||
const onScopeDispose: typeof import('vue')['onScopeDispose']
|
||||
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
|
||||
const onUnmounted: typeof import('vue')['onUnmounted']
|
||||
const onUpdated: typeof import('vue')['onUpdated']
|
||||
const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
|
||||
const provide: typeof import('vue')['provide']
|
||||
const reactive: typeof import('vue')['reactive']
|
||||
const readonly: typeof import('vue')['readonly']
|
||||
const ref: typeof import('vue')['ref']
|
||||
const resolveComponent: typeof import('vue')['resolveComponent']
|
||||
const shallowReactive: typeof import('vue')['shallowReactive']
|
||||
const shallowReadonly: typeof import('vue')['shallowReadonly']
|
||||
const shallowRef: typeof import('vue')['shallowRef']
|
||||
const toRaw: typeof import('vue')['toRaw']
|
||||
const toRef: typeof import('vue')['toRef']
|
||||
const toRefs: typeof import('vue')['toRefs']
|
||||
const toValue: typeof import('vue')['toValue']
|
||||
const triggerRef: typeof import('vue')['triggerRef']
|
||||
const unref: typeof import('vue')['unref']
|
||||
const useAttrs: typeof import('vue')['useAttrs']
|
||||
const useCssModule: typeof import('vue')['useCssModule']
|
||||
const useCssVars: typeof import('vue')['useCssVars']
|
||||
const useId: typeof import('vue')['useId']
|
||||
const useLink: typeof import('vue-router')['useLink']
|
||||
const useModel: typeof import('vue')['useModel']
|
||||
const useRoute: typeof import('vue-router')['useRoute']
|
||||
const useRouter: typeof import('vue-router')['useRouter']
|
||||
const useSlots: typeof import('vue')['useSlots']
|
||||
const useTemplateRef: typeof import('vue')['useTemplateRef']
|
||||
const watch: typeof import('vue')['watch']
|
||||
const watchEffect: typeof import('vue')['watchEffect']
|
||||
const watchPostEffect: typeof import('vue')['watchPostEffect']
|
||||
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
|
||||
}
|
||||
// for type re-export
|
||||
declare global {
|
||||
// @ts-ignore
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||
import('vue')
|
||||
}
|
||||
@ -46,7 +46,7 @@ const chartsData = reactive({
|
||||
geo: {
|
||||
map: mapName.value,
|
||||
roam: true,
|
||||
zoom: 1.1,
|
||||
zoom: 0.9,
|
||||
show: false,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
@ -151,10 +151,10 @@ const chartsData = reactive({
|
||||
},
|
||||
},
|
||||
{
|
||||
name: '勐永镇',
|
||||
name: '贺派乡',
|
||||
value: [99.406653, 23.534142, 80], // 经度, 纬度, 数值
|
||||
itemStyle: {
|
||||
color: '#00FF00', // 勐永镇的颜色
|
||||
color: '#00FF00', // 贺派乡的颜色
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
@ -1,10 +1,85 @@
|
||||
<template>
|
||||
<div class="plant-gs-warp">
|
||||
<div class="plant-gs-content" :style="{ 'background-image': 'url(' + getAssetsFile('images/plant/bg1.png') + ')' }"></div>
|
||||
<div ref="viewwarp" class="plant-gs-content" :style="{ 'background-image': 'url(' + getAssetsFile('images/plant/bg1.png') + ')' }">
|
||||
<vc-config-provider :cesium-path="vcConfig.cesiumPath" :access-token="vcConfig.accessToken">
|
||||
<vc-viewer ref="viewerRef" @ready="onViewerReady">
|
||||
<vc-layer-imagery :minimum-level="12" :maximum-level="18" :contrast="1.8" :saturation="1" :alpha="1">
|
||||
<vc-imagery-provider-amap :key="'c843a50db7157faf295c6fa37c48719f'"></vc-imagery-provider-amap>
|
||||
</vc-layer-imagery>
|
||||
|
||||
<vc-overlay-html ref="html" :position="pos" :show="show">
|
||||
<div class="vc-name">耿马镇</div>
|
||||
</vc-overlay-html>
|
||||
|
||||
<vc-entity description="Hello VueCesium">
|
||||
<vc-graphics-rectangle
|
||||
ref="rectangle2"
|
||||
:coordinates="hierarchy4"
|
||||
:material="[59, 199, 231, 80]"
|
||||
:rotation="0.9"
|
||||
:extruded-height="1000"
|
||||
:height="0"
|
||||
:outline="true"
|
||||
:outline-width="0.1"
|
||||
:clamp-to-ground="false"
|
||||
:outline-color="[59, 199, 231, 150]"
|
||||
></vc-graphics-rectangle>
|
||||
</vc-entity>
|
||||
</vc-viewer>
|
||||
</vc-config-provider>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { isEmpty, getAssetsFile } from '@/utils';
|
||||
import { ref, reactive, onMounted, computed, nextTick, getCurrentInstance } from 'vue';
|
||||
import {
|
||||
VcViewer,
|
||||
VcConfigProvider,
|
||||
VcImageryProviderAmap,
|
||||
VcLayerImagery,
|
||||
VcGraphicsPlane,
|
||||
VcEntity,
|
||||
VcGraphicsPolygon,
|
||||
VcGraphicsRectangle,
|
||||
VcOverlayHtml,
|
||||
} from 'vue-cesium';
|
||||
import 'vue-cesium/dist/index.css';
|
||||
|
||||
const vcConfig = reactive({
|
||||
cesiumPath: 'https://cdn.bootcdn.net/ajax/libs/cesium/1.80.0/Cesium.js',
|
||||
accessToken:
|
||||
'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJiNjJjZTUxYi1lOTQ3LTQ3YjctOGI3ZS02ZGUzY2E4YWFkNDkiLCJpZCI6Mjg4MjAxLCJpYXQiOjE3NDMwNTY0MzN9.rjHQiqf7Y8bccaqsapqveULVAUH6M1QkeFp-AKG-frA',
|
||||
});
|
||||
const viewerRef = ref(null);
|
||||
const viewwarp = ref(null);
|
||||
const rectangle2 = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
Promise.all([rectangle2.value.creatingPromise]).then((instances) => {
|
||||
// console.info('aa', instances[0].viewer.entities);
|
||||
instances[0].viewer.zoomTo(instances[0].viewer.entities);
|
||||
});
|
||||
});
|
||||
const hierarchy4 = reactive([99.302267, 23.438899, 99.312267, 23.448889]);
|
||||
const pos = reactive([99.302267, 23.438899]);
|
||||
|
||||
const onViewerReady = (readyObj) => {
|
||||
console.info('readyObj', readyObj.Cesium); // Cesium namespace object
|
||||
console.log(readyObj.viewer); // instanceof Cesium.Viewer
|
||||
|
||||
const { Cesium, viewer } = readyObj;
|
||||
|
||||
// 设置相机视角
|
||||
viewer.camera.setView({
|
||||
destination: Cesium.Cartesian3.fromDegrees(99.516667, 23.640556, 4000), // 目标中心点
|
||||
orientation: {
|
||||
ading: Cesium.Math.toRadians(6), //
|
||||
pitch: Cesium.Math.toRadians(-25), //
|
||||
roll: Cesium.Math.toRadians(6), //
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.plant-gs-warp {
|
||||
@ -17,6 +92,25 @@ import { isEmpty, getAssetsFile } from '@/utils';
|
||||
background-repeat: no-repeat;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
.vc-name {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
::v-deep() {
|
||||
.vc-viewer {
|
||||
height: calc(100% - 30px) !important;
|
||||
width: calc(100% - 20px) !important;
|
||||
margin: 20px 10px 10px 10px !important;
|
||||
}
|
||||
canvas {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
.cesium-viewer-bottom {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,9 +26,9 @@
|
||||
</customBack>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-col :span="12" style="height: 100%">
|
||||
<el-row style="height: 67%">
|
||||
<el-col :span="24" class="center-top">
|
||||
<el-col :span="24" class="center-top" style="height: 100%">
|
||||
<div class="notice">
|
||||
<noticeBar :height="'40px'"></noticeBar>
|
||||
</div>
|
||||
|
||||
@ -6,15 +6,16 @@
|
||||
<vc-layer-imagery :minimum-level="12" :maximum-level="18" :contrast="1.8" :saturation="1" :alpha="1">
|
||||
<vc-imagery-provider-amap :key="'c843a50db7157faf295c6fa37c48719f'"></vc-imagery-provider-amap>
|
||||
</vc-layer-imagery>
|
||||
|
||||
<!-- 蒙版层 -->
|
||||
<vc-entity>
|
||||
<!-- <vc-graphics-polygon
|
||||
ref="polygon5"
|
||||
:hierarchy="[99.402267, 23.538889, 99.402267, 23.538889, 5000.0, 99.402267, 23.538889, 0.0]"
|
||||
:material="[0, 255, 255, 125]"
|
||||
:per-position-height="true"
|
||||
:outline="true"
|
||||
outline-color="black"
|
||||
></vc-graphics-polygon> -->
|
||||
<vc-graphics-polygon
|
||||
ref="polygon4"
|
||||
:hierarchy="hierarchy4"
|
||||
:material="[110, 161, 153, 150]"
|
||||
:height="0"
|
||||
:outline="false"
|
||||
></vc-graphics-polygon>
|
||||
</vc-entity>
|
||||
</vc-viewer>
|
||||
</vc-config-provider>
|
||||
@ -24,7 +25,16 @@
|
||||
<script setup>
|
||||
import { isEmpty, getAssetsFile } from '@/utils';
|
||||
import { ref, reactive, onMounted, computed, nextTick, getCurrentInstance } from 'vue';
|
||||
import { VcViewer, VcConfigProvider, VcImageryProviderAmap, VcLayerImagery, VcGraphicsPlane, VcEntity, VcGraphicsPolygon } from 'vue-cesium';
|
||||
import {
|
||||
VcViewer,
|
||||
VcConfigProvider,
|
||||
VcImageryProviderAmap,
|
||||
VcLayerImagery,
|
||||
VcGraphicsPlane,
|
||||
VcEntity,
|
||||
VcGraphicsPolygon,
|
||||
VcGraphicsRectangle,
|
||||
} from 'vue-cesium';
|
||||
import 'vue-cesium/dist/index.css';
|
||||
|
||||
const vcConfig = reactive({
|
||||
@ -34,32 +44,68 @@ const vcConfig = reactive({
|
||||
});
|
||||
const viewerRef = ref(null);
|
||||
const viewwarp = ref(null);
|
||||
let plane2 = ref(null);
|
||||
let polygon4 = ref(null);
|
||||
|
||||
onMounted(() => {
|
||||
console.info('onMounted', viewerRef);
|
||||
Promise.all([plane2.value.creatingPromise]).then((instances) => {
|
||||
Promise.all([polygon4.value.creatingPromise]).then((instances) => {
|
||||
console.info('instances');
|
||||
// instances[0].viewer.zoomTo(instances[0].viewer.entities);
|
||||
});
|
||||
});
|
||||
|
||||
const hierarchy4 = reactive({
|
||||
positions: [
|
||||
[99.406653, 23.534142], // 左下角
|
||||
[99.706653, 23.534142], // 右下角
|
||||
[99.706653, 23.834142], // 右上角
|
||||
[99.406653, 23.834142], // 左上角
|
||||
],
|
||||
holes: [
|
||||
{
|
||||
positions: [
|
||||
[99.506653, 23.634142], // 耿马镇边界点 1
|
||||
[99.606653, 23.634142], // 耿马镇边界点 2
|
||||
[99.606653, 23.734142], // 耿马镇边界点 3
|
||||
[99.506653, 23.734142], // 耿马镇边界点 4
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const onViewerReady = (readyObj) => {
|
||||
console.info('readyObj', readyObj.Cesium); // Cesium namespace object
|
||||
console.log(readyObj.viewer); // instanceof Cesium.Viewer
|
||||
|
||||
// 在这里处理 Viewer 的初始化逻辑
|
||||
const { Cesium, viewer } = readyObj;
|
||||
|
||||
// 示例：设置地球背景颜色
|
||||
viewer.scene.globe.baseColor = Cesium.Color.DARKBLUE;
|
||||
// 将耿马县和耿马镇的所有边界点合并
|
||||
const allPositions = [...hierarchy4.positions, ...hierarchy4.holes[0].positions].map((coord) => Cesium.Cartesian3.fromDegrees(coord[0], coord[1]));
|
||||
|
||||
// 计算所有边界点的包围球
|
||||
const boundingSphere = Cesium.BoundingSphere.fromPoints(allPositions);
|
||||
|
||||
// 设置相机视角
|
||||
viewer.camera.setView({
|
||||
destination: Cesium.Cartesian3.fromDegrees(99.406653, 23.534142, 4000),
|
||||
destination: boundingSphere.center, // 目标中心点
|
||||
orientation: {
|
||||
heading: Cesium.Math.toRadians(0), // 方向角
|
||||
pitch: Cesium.Math.toRadians(-90), // 俯仰角
|
||||
roll: 0, // 滚动角
|
||||
// heading: Cesium.Math.toRadians(-10), // 方向角
|
||||
// pitch: Cesium.Math.toRadians(-90), // 俯仰角
|
||||
// roll: 0, // 滚动角
|
||||
heading: Cesium.Math.toRadians(6), //
|
||||
pitch: Cesium.Math.toRadians(-25), //
|
||||
roll: Cesium.Math.toRadians(6), //
|
||||
},
|
||||
});
|
||||
|
||||
// 动态调整相机高度，确保整个区域可见
|
||||
const radius = boundingSphere.radius; // 包围球半径
|
||||
const cameraHeight = radius * 1; // 根据经验公式调整高度
|
||||
viewer.camera.moveBackward(cameraHeight); // 向后移动相机
|
||||
|
||||
// viewer.camera.changed.addEventListener(() => {
|
||||
// console.log('Camera changed:', viewer.camera);
|
||||
// });
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user