desc: 调整代码
This commit is contained in:
parent
850f492b45
commit
443051edc3
@ -2,113 +2,113 @@ import request from '@/utils/request';
|
|||||||
|
|
||||||
/** 获取发布地图树*/
|
/** 获取发布地图树*/
|
||||||
export function getPublishMapTree(cityCode) {
|
export function getPublishMapTree(cityCode) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${cityCode}/tree`,
|
url: `/api/mapPrd/${cityCode}/tree`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 获取产品详细内容*/
|
/** 获取产品详细内容*/
|
||||||
export function getProductDetail(prdCode) {
|
export function getProductDetail(prdCode) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${prdCode}`,
|
url: `/api/mapPrd/${prdCode}`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 检查实训编码是否已存在*/
|
/** 检查实训编码是否已存在*/
|
||||||
export function checkCodeExist(data) {
|
export function checkCodeExist(data) {
|
||||||
return request({
|
return request({
|
||||||
url: '/api/mapPrd/checkCodeExist',
|
url: '/api/mapPrd/checkCodeExist',
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: data
|
params: data
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 获取产品类目数*/
|
/** 获取产品树*/
|
||||||
export function getProductTree() {
|
export function getProductTree() {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/tree`,
|
url: `/api/mapPrd/tree`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 创建实训类目*/
|
/** 创建实训类目*/
|
||||||
export function createTrainingCategory(data) {
|
export function createTrainingCategory(data) {
|
||||||
return request({
|
return request({
|
||||||
url: '/api/mapPrd',
|
url: '/api/mapPrd',
|
||||||
method: 'post',
|
method: 'post',
|
||||||
data: data
|
data: data
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 更新实训类目*/
|
/** 更新实训类目*/
|
||||||
export function updateTrainingCategory(data) {
|
export function updateTrainingCategory(data) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${data.id}`,
|
url: `/api/mapPrd/${data.id}`,
|
||||||
method: 'put',
|
method: 'put',
|
||||||
data: data
|
data: data
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 删除实训类目*/
|
/** 删除实训类目*/
|
||||||
export function deleteTrainingCategory(data) {
|
export function deleteTrainingCategory(data) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${data.id}`,
|
url: `/api/mapPrd/${data.id}`,
|
||||||
method: 'delete'
|
method: 'delete'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取地图下的产品列表
|
* 获取地图下的产品列表
|
||||||
*/
|
*/
|
||||||
export function getCommodityMapProduct(skinCode) {
|
export function getCommodityMapProduct(skinCode) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${skinCode}/list`,
|
url: `/api/mapPrd/${skinCode}/list`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取地图下的产品详情
|
* 获取地图下的产品详情
|
||||||
*/
|
*/
|
||||||
export function getMapProductDetail(prdCode) {
|
export function getMapProductDetail(prdCode) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${prdCode}`,
|
url: `/api/mapPrd/${prdCode}`,
|
||||||
method: 'get'
|
method: 'get'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 获取产品管理列表*/
|
/** 获取产品管理列表*/
|
||||||
export function getProductList(data) {
|
export function getProductList(data) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/list`,
|
url: `/api/mapPrd/list`,
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: data
|
params: data
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 发布地图产品上架*/
|
/** 发布地图产品上架*/
|
||||||
export function putMapProductOnLine(id) {
|
export function putMapProductOnLine(id) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${id}/onLine`,
|
url: `/api/mapPrd/${id}/onLine`,
|
||||||
method: 'put'
|
method: 'put'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 发布地图产品下架*/
|
/** 发布地图产品下架*/
|
||||||
export function putMapProductOffLine(id) {
|
export function putMapProductOffLine(id) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/${id}/offLine`,
|
url: `/api/mapPrd/${id}/offLine`,
|
||||||
method: 'put'
|
method: 'put'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 校验产品code是否已存在*/
|
/** 校验产品code是否已存在*/
|
||||||
export function checkMapProductCodeExist(params) {
|
export function checkMapProductCodeExist(params) {
|
||||||
return request({
|
return request({
|
||||||
url: `/api/mapPrd/checkCodeExist`,
|
url: `/api/mapPrd/checkCodeExist`,
|
||||||
method: 'get',
|
method: 'get',
|
||||||
params: params
|
params: params
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -21,11 +21,11 @@ import Errpr404 from '@/views/error-page/404';
|
|||||||
|
|
||||||
import SkinCode from '@/views/system/skinCode/index';
|
import SkinCode from '@/views/system/skinCode/index';
|
||||||
import SkinCodeDraft from '@/views/system/skinCode/draft';
|
import SkinCodeDraft from '@/views/system/skinCode/draft';
|
||||||
|
import MapProduct from '@/views/system/product/index';
|
||||||
|
|
||||||
import Mapdraft from '@/views/map/mapdraft/index';
|
// import Mapdraft from '@/views/map/mapdraft/index';
|
||||||
import Mapedit from '@/views/map/mapdraft/mapedit/index';
|
import Mapedit from '@/views/map/mapdraft/mapedit/index';
|
||||||
import Runplan from '@/views/map/runplan/index';
|
// import Runplan from '@/views/map/runplan/index';
|
||||||
import MapProduct from '@/views/map/product/index';
|
|
||||||
import RunplanView from '@/views/map/runplan/chart';
|
import RunplanView from '@/views/map/runplan/chart';
|
||||||
|
|
||||||
import Trainingrecord from '@/views/lesson/trainingrecord/index';
|
import Trainingrecord from '@/views/lesson/trainingrecord/index';
|
||||||
@ -54,22 +54,23 @@ import PublishExamRule from '@/views/publish/examRule/index';
|
|||||||
import PublishExamRuleDraft from '@/views/publish/examRule/draft/index';
|
import PublishExamRuleDraft from '@/views/publish/examRule/draft/index';
|
||||||
|
|
||||||
import DemonstrationDetail from '@/views/demonstration/detail/index';
|
import DemonstrationDetail from '@/views/demonstration/detail/index';
|
||||||
import ScreenMonitor from '@/views/screenMonitor/index';
|
// import ScreenMonitor from '@/views/screenMonitor/index';
|
||||||
import ScreenMonitorHome from '@/views/screenMonitor/home';
|
// import ScreenMonitorHome from '@/views/screenMonitor/home';
|
||||||
import ScreenMonitorDetail from '@/views/screenMonitor/detail/index';
|
// import ScreenMonitorDetail from '@/views/screenMonitor/detail/index';
|
||||||
|
|
||||||
import PlanMonitorEditTool from '@/views/planMonitor/editTool/index';
|
import PlanMonitorEditTool from '@/views/planMonitor/editTool/index';
|
||||||
import PlanMonitorEditUserTool from '@/views/planMonitor/editTool/userindex';
|
import PlanMonitorEditUserTool from '@/views/planMonitor/editTool/userindex';
|
||||||
import PlanMonitor from '@/views/planMonitor/index';
|
// import PlanMonitor from '@/views/planMonitor/index';
|
||||||
import PlanMonitorHome from '@/views/planMonitor/home';
|
// import PlanMonitorHome from '@/views/planMonitor/home';
|
||||||
import PlanMonitorDetail from '@/views/planMonitor/detail';
|
import PlanMonitorDetail from '@/views/planMonitor/detail';
|
||||||
|
|
||||||
import DesignPlatformHome from '@/views/designPlatform/home';
|
import DesignPlatformHome from '@/views/designPlatform/home';
|
||||||
import DesignPlatform from '@/views/designPlatform/index';
|
import DesignPlatform from '@/views/designPlatform/index';
|
||||||
import DesignPlatformUser from '@/views/designPlatform/userIndex';
|
|
||||||
import MapPreview from '@/views/designPlatform/mapPreview';
|
import MapPreview from '@/views/designPlatform/mapPreview';
|
||||||
|
|
||||||
import Replay from '@/views/replay/index';
|
import DesignPlatformUser from '@/views/designUser/index';
|
||||||
|
|
||||||
|
// import Replay from '@/views/replay/index';
|
||||||
import Package from '@/views/package/index';
|
import Package from '@/views/package/index';
|
||||||
import PackageDraft from '@/views/package/draft/ruleForm';
|
import PackageDraft from '@/views/package/draft/ruleForm';
|
||||||
import PackageDetail from '@/views/package/detail';
|
import PackageDetail from '@/views/package/detail';
|
||||||
@ -321,7 +322,7 @@ export const constantRoutes = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export const asyncRouter = [
|
export const asyncRouter = [
|
||||||
{
|
{ // 公共地图
|
||||||
path: '/design',
|
path: '/design',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
redirect: '/design/home',
|
redirect: '/design/home',
|
||||||
@ -424,7 +425,7 @@ export const asyncRouter = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{ // 个人地图
|
||||||
path: '/design/userlist',
|
path: '/design/userlist',
|
||||||
redirect: '/design/userlist/home',
|
redirect: '/design/userlist/home',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
@ -484,7 +485,7 @@ export const asyncRouter = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{ // 全屏战场图
|
||||||
path: '/display/:mode',
|
path: '/display/:mode',
|
||||||
component: Display,
|
component: Display,
|
||||||
meta: {
|
meta: {
|
||||||
@ -505,7 +506,7 @@ export const asyncRouter = [
|
|||||||
},
|
},
|
||||||
hidden: true
|
hidden: true
|
||||||
},
|
},
|
||||||
{
|
{ // 综合演练室
|
||||||
path: '/trainroom',
|
path: '/trainroom',
|
||||||
component: TrainRoom,
|
component: TrainRoom,
|
||||||
meta: {
|
meta: {
|
||||||
@ -685,67 +686,67 @@ export const asyncRouter = [
|
|||||||
// }
|
// }
|
||||||
// ]
|
// ]
|
||||||
// },
|
// },
|
||||||
{
|
{ // 运行图编辑
|
||||||
path: '/plan/usertool',
|
path: '/plan/usertool',
|
||||||
component: PlanMonitorEditUserTool,
|
component: PlanMonitorEditUserTool,
|
||||||
meta: {
|
meta: {
|
||||||
},
|
},
|
||||||
hidden: true
|
hidden: true
|
||||||
},
|
},
|
||||||
{
|
{ // 运行图编辑
|
||||||
path: '/plan/tool',
|
path: '/plan/tool',
|
||||||
component: PlanMonitorEditTool,
|
component: PlanMonitorEditTool,
|
||||||
meta: {
|
meta: {
|
||||||
},
|
},
|
||||||
hidden: true
|
hidden: true
|
||||||
},
|
},
|
||||||
{
|
// { // 琏计划
|
||||||
path: '/plan',
|
// path: '/plan',
|
||||||
redirect: '/plan/home',
|
// redirect: '/plan/home',
|
||||||
component: PlanMonitor,
|
// component: PlanMonitor,
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
meta: {
|
// meta: {
|
||||||
roles: [admin, user, userDesign]
|
// roles: [admin, user, userDesign]
|
||||||
},
|
// },
|
||||||
children: [
|
// children: [
|
||||||
{
|
// {
|
||||||
path: 'home',
|
// path: 'home',
|
||||||
component: PlanMonitorHome,
|
// component: PlanMonitorHome,
|
||||||
meta: {
|
// meta: {
|
||||||
i18n: 'router.planSystem'
|
// i18n: 'router.planSystem'
|
||||||
},
|
// },
|
||||||
target: true
|
// target: true
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'detail/:lessonId',
|
// path: 'detail/:lessonId',
|
||||||
component: PlanMonitorDetail,
|
// component: PlanMonitorDetail,
|
||||||
hidden: true
|
// hidden: true
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: 'pay/:lessonId',
|
// path: 'pay/:lessonId',
|
||||||
component: Pay,
|
// component: Pay,
|
||||||
hidden: true
|
// hidden: true
|
||||||
}
|
// }
|
||||||
]
|
// ]
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
path: '/replay',
|
// path: '/replay',
|
||||||
component: Layout,
|
// component: Layout,
|
||||||
hidden: true,
|
// hidden: true,
|
||||||
meta: {
|
// meta: {
|
||||||
roles: [admin, userDesign]
|
// roles: [admin, userDesign]
|
||||||
},
|
// },
|
||||||
children: [
|
// children: [
|
||||||
{
|
// {
|
||||||
path: 'manage',
|
// path: 'manage',
|
||||||
component: Replay,
|
// component: Replay,
|
||||||
meta: {
|
// meta: {
|
||||||
i18n: 'router.replayManage'
|
// i18n: 'router.replayManage'
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
]
|
// ]
|
||||||
},
|
// },
|
||||||
{
|
{ // 发布内容管理
|
||||||
path: '/publish',
|
path: '/publish',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
meta: {
|
meta: {
|
||||||
@ -829,7 +830,7 @@ export const asyncRouter = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{ // 订单权限管理
|
||||||
path: '/orderauthor',
|
path: '/orderauthor',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
meta: {
|
meta: {
|
||||||
@ -921,7 +922,7 @@ export const asyncRouter = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{ // 系统管理
|
||||||
path: '/system',
|
path: '/system',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
meta: {
|
meta: {
|
||||||
@ -1037,7 +1038,7 @@ export const asyncRouter = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{ // 发布申请
|
||||||
path: '/apply',
|
path: '/apply',
|
||||||
component: Layout,
|
component: Layout,
|
||||||
meta: {
|
meta: {
|
||||||
|
@ -3,10 +3,10 @@ export function getBaseUrl() {
|
|||||||
let BASE_API;
|
let BASE_API;
|
||||||
if (process.env.NODE_ENV === 'development') {
|
if (process.env.NODE_ENV === 'development') {
|
||||||
// BASE_API = 'https://joylink.club/jlcloud';
|
// BASE_API = 'https://joylink.club/jlcloud';
|
||||||
// BASE_API = 'https://test.joylink.club/jlcloud';
|
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||||
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
||||||
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
||||||
BASE_API = 'http://192.168.3.41:9000'; // 王兴杰
|
// BASE_API = 'http://192.168.3.41:9000'; // 王兴杰
|
||||||
} else {
|
} else {
|
||||||
BASE_API = process.env.VUE_APP_BASE_API;
|
BASE_API = process.env.VUE_APP_BASE_API;
|
||||||
}
|
}
|
||||||
|
@ -29,24 +29,24 @@ import home5 from '@/assets/home/tring4.jpg';
|
|||||||
import home6 from '@/assets/home/demon2.jpg';
|
import home6 from '@/assets/home/demon2.jpg';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Home',
|
name: 'Home',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
listImg: [
|
listImg: [
|
||||||
{ src: home1 },
|
{ src: home1 },
|
||||||
{ src: home2 },
|
{ src: home2 },
|
||||||
{ src: home3 },
|
{ src: home3 },
|
||||||
{ src: home4 },
|
{ src: home4 },
|
||||||
{ src: home5 },
|
{ src: home5 },
|
||||||
{ src: home6 }
|
{ src: home6 }
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
height() {
|
height() {
|
||||||
return this.$store.state.app.height - 93;
|
return this.$store.state.app.height - 93;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@ -19,70 +19,70 @@ import localStore from 'storejs';
|
|||||||
import { getSessionStorage, setSessionStorage } from '@/utils/auth';
|
import { getSessionStorage, setSessionStorage } from '@/utils/auth';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'DesignPlatform',
|
name: 'DesignPlatform',
|
||||||
components: {
|
components: {
|
||||||
demonList,
|
demonList,
|
||||||
drapLeft
|
drapLeft
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
listShow: true,
|
listShow: true,
|
||||||
widthLeft: Number(localStore.get('LeftWidth')) || 450,
|
widthLeft: Number(localStore.get('LeftWidth')) || 450,
|
||||||
productList: [],
|
productList: [],
|
||||||
skinCode: '',
|
skinCode: '',
|
||||||
currentWidth: ''
|
currentWidth: ''
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapGetters([
|
...mapGetters([
|
||||||
'lessonbar'
|
'lessonbar'
|
||||||
]),
|
]),
|
||||||
width() {
|
width() {
|
||||||
return this.$store.state.app.width;
|
return this.$store.state.app.width;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
'lessonbar.opened': function (val) {
|
'lessonbar.opened': function (val) {
|
||||||
this.listShow = val;
|
this.listShow = val;
|
||||||
},
|
},
|
||||||
widthLeft(val) {
|
widthLeft(val) {
|
||||||
this.setMapResize(val);
|
this.setMapResize(val);
|
||||||
},
|
},
|
||||||
'$store.state.app.windowSizeCount': function() {
|
'$store.state.app.windowSizeCount': function() {
|
||||||
this.resize();
|
this.resize();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.currentWidth=this.$store.state.app.width - this.widthLeft;
|
this.currentWidth = this.$store.state.app.width - this.widthLeft;
|
||||||
const againEnter = getSessionStorage('againEnter') || null;
|
const againEnter = getSessionStorage('againEnter') || null;
|
||||||
if (!againEnter) {
|
if (!againEnter) {
|
||||||
launchFullscreen();
|
launchFullscreen();
|
||||||
setSessionStorage('againEnter', true);
|
setSessionStorage('againEnter', true);
|
||||||
}
|
}
|
||||||
this.resize();
|
this.resize();
|
||||||
this.widthLeft = Number(localStore.get('LeftWidth'));
|
this.widthLeft = Number(localStore.get('LeftWidth'));
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
refresh() {
|
refresh() {
|
||||||
this.$refs && this.$refs.demonList && this.$refs.demonList.loadInitData();
|
this.$refs && this.$refs.demonList && this.$refs.demonList.loadInitData();
|
||||||
},
|
},
|
||||||
drapWidth(width) {
|
drapWidth(width) {
|
||||||
this.widthLeft = Number(width);
|
this.widthLeft = Number(width);
|
||||||
},
|
},
|
||||||
resize() {
|
resize() {
|
||||||
this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
|
this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
|
||||||
const width = this.$store.state.app.width - 521 - this.widthLeft;
|
const width = this.$store.state.app.width - 521 - this.widthLeft;
|
||||||
// const height = this.$store.state.app.height - 90;
|
// const height = this.$store.state.app.height - 90;
|
||||||
this.$store.dispatch('config/resize', { width: width });
|
this.$store.dispatch('config/resize', { width: width });
|
||||||
},
|
},
|
||||||
setMapResize(LeftWidth) {
|
setMapResize(LeftWidth) {
|
||||||
this.currentWidth=this.$store.state.app.width - this.widthLeft;
|
this.currentWidth = this.$store.state.app.width - this.widthLeft;
|
||||||
const widths = this.$store.state.app.width - 521 - LeftWidth;
|
const widths = this.$store.state.app.width - 521 - LeftWidth;
|
||||||
// const heights = this.$store.state.app.height - 90;
|
// const heights = this.$store.state.app.height - 90;
|
||||||
this.$store.dispatch('config/resize', { width: widths });
|
this.$store.dispatch('config/resize', { width: widths });
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@ -9,104 +9,104 @@ import { loadMapDataById } from '@/utils/loaddata';
|
|||||||
import { EventBus } from '@/scripts/event-bus';
|
import { EventBus } from '@/scripts/event-bus';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MapPreview',
|
name: 'MapPreview',
|
||||||
components: {
|
components: {
|
||||||
JlmapVisual
|
JlmapVisual
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
widthLeft: {
|
widthLeft: {
|
||||||
type: Number,
|
type: Number,
|
||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
size: {
|
size: {
|
||||||
width: document.documentElement.clientWidth - 400,
|
width: document.documentElement.clientWidth - 400,
|
||||||
height: document.documentElement.clientHeight - 80
|
height: document.documentElement.clientHeight - 80
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
mapId() {
|
mapId() {
|
||||||
return this.$route.params.mapId;
|
return this.$route.params.mapId;
|
||||||
},
|
},
|
||||||
height() {
|
height() {
|
||||||
return this.$store.state.app.height - 50-30;
|
return this.$store.state.app.height - 50 - 30;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
widthLeft(val) {
|
widthLeft(val) {
|
||||||
this.setWindowSize();
|
this.setWindowSize();
|
||||||
},
|
},
|
||||||
$route() {
|
$route() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.initLoadData();
|
this.initLoadData();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// '$store.state.map.mapViewLoadedCount': function (val) {
|
// '$store.state.map.mapViewLoadedCount': function (val) {
|
||||||
// // this.subscribe();
|
// // this.subscribe();
|
||||||
// debugger;
|
// debugger;
|
||||||
// this.$store.dispatch('map/setTrainWindowShow', false);
|
// this.$store.dispatch('map/setTrainWindowShow', false);
|
||||||
// },
|
// },
|
||||||
'$store.state.app.windowSizeCount': function() {
|
'$store.state.app.windowSizeCount': function() {
|
||||||
this.setWindowSize();
|
this.setWindowSize();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async beforeDestroy() {
|
async beforeDestroy() {
|
||||||
// await this.clearAllTimer();
|
// await this.clearAllTimer();
|
||||||
// if (!this.isReplay) {
|
// if (!this.isReplay) {
|
||||||
// await this.quit();
|
// await this.quit();
|
||||||
// }
|
// }
|
||||||
// await this.$store.dispatch('training/reset');
|
// await this.$store.dispatch('training/reset');
|
||||||
await this.$store.dispatch('map/mapClear');
|
await this.$store.dispatch('map/mapClear');
|
||||||
// EventBus.$off('clearCheckLogin');
|
// EventBus.$off('clearCheckLogin');
|
||||||
},
|
},
|
||||||
async mounted() {
|
async mounted() {
|
||||||
await this.setWindowSize();
|
await this.setWindowSize();
|
||||||
await this.initLoadData();
|
await this.initLoadData();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async initLoadData() {
|
async initLoadData() {
|
||||||
if (parseInt(this.mapId)) {
|
if (parseInt(this.mapId)) {
|
||||||
await this.loadMapDataById(this.mapId);
|
await this.loadMapDataById(this.mapId);
|
||||||
} else {
|
} else {
|
||||||
this.endViewLoading();
|
this.endViewLoading();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 通过id加载地图数据
|
// 通过id加载地图数据
|
||||||
async loadMapDataById(mapId) {
|
async loadMapDataById(mapId) {
|
||||||
try {
|
try {
|
||||||
await this.$store.dispatch('training/changeMode', { mode: null });
|
await this.$store.dispatch('training/changeMode', { mode: null });
|
||||||
await loadMapDataById(mapId);
|
await loadMapDataById(mapId);
|
||||||
await this.$store.dispatch('training/over');
|
await this.$store.dispatch('training/over');
|
||||||
await this.$store.dispatch('training/setMapDefaultState');
|
await this.$store.dispatch('training/setMapDefaultState');
|
||||||
await this.$store.dispatch('map/clearJlmapTrainView');
|
await this.$store.dispatch('map/clearJlmapTrainView');
|
||||||
await this.$store.dispatch('map/setTrainWindowShow', false);
|
await this.$store.dispatch('map/setTrainWindowShow', false);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
this.$messageBox(`获取地图数据失败: ${error.message}`);
|
this.$messageBox(`获取地图数据失败: ${error.message}`);
|
||||||
this.endViewLoading();
|
this.endViewLoading();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 结束加载状态
|
// 结束加载状态
|
||||||
endViewLoading(isSuccess) {
|
endViewLoading(isSuccess) {
|
||||||
if (!isSuccess) {
|
if (!isSuccess) {
|
||||||
this.$store.dispatch('map/mapClear');
|
this.$store.dispatch('map/mapClear');
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
EventBus.$emit('viewLoading', false);
|
EventBus.$emit('viewLoading', false);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
setWindowSize() {
|
setWindowSize() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
const width = this.$store.state.app.width-(this.widthLeft||450);
|
const width = this.$store.state.app.width - (this.widthLeft || 450);
|
||||||
const height = this.height;
|
const height = this.height;
|
||||||
this.$store.dispatch('config/resize', { width, height });
|
this.$store.dispatch('config/resize', { width, height });
|
||||||
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
|
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
@ -1,136 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="app-wrapper" style="height: 100%;">
|
|
||||||
<map-create ref="mapCreate" :skin-code="skinCode" @refresh="refresh1" @editmap="handleNodeClick" />
|
|
||||||
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
|
|
||||||
<demon-list ref="demonList" :width="widthLeft" @createMap="createMap" />
|
|
||||||
</div>
|
|
||||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
|
||||||
<transition>
|
|
||||||
<router-view :product-list="productList" />
|
|
||||||
</transition>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { mapGetters } from 'vuex';
|
|
||||||
import demonList from './userDemonList';
|
|
||||||
import drapLeft from '@/views/components/drapLeft/index';
|
|
||||||
import { launchFullscreen } from '@/utils/screen';
|
|
||||||
import localStore from 'storejs';
|
|
||||||
import { getSessionStorage, setSessionStorage } from '@/utils/auth';
|
|
||||||
import MapCreate from '@/views/map/mapdraft/mapmanage/create';
|
|
||||||
import { UrlConfig } from '@/router/index';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'DesignPlatform',
|
|
||||||
components: {
|
|
||||||
demonList,
|
|
||||||
drapLeft,
|
|
||||||
MapCreate
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
listShow: true,
|
|
||||||
widthLeft: Number(localStore.get('LeftWidth')) || 450,
|
|
||||||
productList: [],
|
|
||||||
skinCode: ''
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
...mapGetters([
|
|
||||||
'lessonbar'
|
|
||||||
]),
|
|
||||||
width() {
|
|
||||||
return this.$store.state.app.width;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
'lessonbar.opened': function (val) {
|
|
||||||
this.listShow = val;
|
|
||||||
},
|
|
||||||
widthLeft(val) {
|
|
||||||
this.setMapResize(val);
|
|
||||||
},
|
|
||||||
'$store.state.app.windowSizeCount': function() {
|
|
||||||
this.resize();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
const againEnter = getSessionStorage('againEnter') || null;
|
|
||||||
if (!againEnter) {
|
|
||||||
launchFullscreen();
|
|
||||||
setSessionStorage('againEnter', true);
|
|
||||||
}
|
|
||||||
this.resize();
|
|
||||||
this.widthLeft = Number(localStore.get('LeftWidth'));
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
refresh() {
|
|
||||||
this.$refs && this.$refs.demonList && this.$refs.demonList.loadInitData();
|
|
||||||
},
|
|
||||||
drapWidth(width) {
|
|
||||||
this.widthLeft = Number(width);
|
|
||||||
},
|
|
||||||
|
|
||||||
createMap() {
|
|
||||||
this.$refs.mapCreate.show();
|
|
||||||
},
|
|
||||||
|
|
||||||
refresh1() {
|
|
||||||
this.$refs.demonList.loadInitData();
|
|
||||||
},
|
|
||||||
|
|
||||||
getSkinCode(node) {
|
|
||||||
let next = node;
|
|
||||||
while (next) {
|
|
||||||
if (next.data && next.data.type == 'skin') {
|
|
||||||
this.skinCode = next.data.id;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
next = next.parent;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleNodeClick(obj, node) {
|
|
||||||
this.getSkinCode(node);
|
|
||||||
if (obj && obj.type == 'map') {
|
|
||||||
this.editModel = obj;
|
|
||||||
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
|
|
||||||
this.mapSelected({ view: 'draft' });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mapSelected(data) {
|
|
||||||
if (data && this.editModel) {
|
|
||||||
this.$router.push({ path: `${UrlConfig.map.draft}/${this.editModel.id}/${data.view}`, query: { name: this.editModel.name } });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
resize() {
|
|
||||||
this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
|
|
||||||
const width = this.$store.state.app.width - 521 - this.widthLeft;
|
|
||||||
const height = this.$store.state.app.height - 90;
|
|
||||||
this.$store.dispatch('config/resize', { width: width, height: height });
|
|
||||||
},
|
|
||||||
setMapResize(LeftWidth) {
|
|
||||||
const widths = this.$store.state.app.width - 521 - LeftWidth;
|
|
||||||
const heights = this.$store.state.app.height - 90;
|
|
||||||
this.$store.dispatch('config/resize', { width: widths, height: heights });
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
||||||
@import "src/styles/mixin.scss";
|
|
||||||
|
|
||||||
.app-wrapper {
|
|
||||||
@include clearfix;
|
|
||||||
position: relative;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.examList {
|
|
||||||
float: left;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
</style>
|
|
136
src/views/designUser/index.vue
Normal file
136
src/views/designUser/index.vue
Normal file
@ -0,0 +1,136 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-wrapper" style="height: 100%;">
|
||||||
|
<map-create ref="mapCreate" :skin-code="skinCode" @refresh="refresh1" @editmap="handleNodeClick" />
|
||||||
|
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
|
||||||
|
<demon-list ref="demonList" :width="widthLeft" @createMap="createMap" />
|
||||||
|
</div>
|
||||||
|
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
||||||
|
<transition>
|
||||||
|
<router-view :product-list="productList" />
|
||||||
|
</transition>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { mapGetters } from 'vuex';
|
||||||
|
import demonList from './demonList';
|
||||||
|
import drapLeft from '@/views/components/drapLeft/index';
|
||||||
|
import { launchFullscreen } from '@/utils/screen';
|
||||||
|
import localStore from 'storejs';
|
||||||
|
import { getSessionStorage, setSessionStorage } from '@/utils/auth';
|
||||||
|
import MapCreate from '@/views/map/mapdraft/mapmanage/create';
|
||||||
|
import { UrlConfig } from '@/router/index';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'DesignPlatform',
|
||||||
|
components: {
|
||||||
|
demonList,
|
||||||
|
drapLeft,
|
||||||
|
MapCreate
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
listShow: true,
|
||||||
|
widthLeft: Number(localStore.get('LeftWidth')) || 450,
|
||||||
|
productList: [],
|
||||||
|
skinCode: ''
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapGetters([
|
||||||
|
'lessonbar'
|
||||||
|
]),
|
||||||
|
width() {
|
||||||
|
return this.$store.state.app.width;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
'lessonbar.opened': function (val) {
|
||||||
|
this.listShow = val;
|
||||||
|
},
|
||||||
|
widthLeft(val) {
|
||||||
|
this.setMapResize(val);
|
||||||
|
},
|
||||||
|
'$store.state.app.windowSizeCount': function() {
|
||||||
|
this.resize();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
const againEnter = getSessionStorage('againEnter') || null;
|
||||||
|
if (!againEnter) {
|
||||||
|
launchFullscreen();
|
||||||
|
setSessionStorage('againEnter', true);
|
||||||
|
}
|
||||||
|
this.resize();
|
||||||
|
this.widthLeft = Number(localStore.get('LeftWidth'));
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
refresh() {
|
||||||
|
this.$refs && this.$refs.demonList && this.$refs.demonList.loadInitData();
|
||||||
|
},
|
||||||
|
drapWidth(width) {
|
||||||
|
this.widthLeft = Number(width);
|
||||||
|
},
|
||||||
|
|
||||||
|
createMap() {
|
||||||
|
this.$refs.mapCreate.show();
|
||||||
|
},
|
||||||
|
|
||||||
|
refresh1() {
|
||||||
|
this.$refs.demonList.loadInitData();
|
||||||
|
},
|
||||||
|
|
||||||
|
getSkinCode(node) {
|
||||||
|
let next = node;
|
||||||
|
while (next) {
|
||||||
|
if (next.data && next.data.type == 'skin') {
|
||||||
|
this.skinCode = next.data.id;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
next = next.parent;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleNodeClick(obj, node) {
|
||||||
|
this.getSkinCode(node);
|
||||||
|
if (obj && obj.type == 'map') {
|
||||||
|
this.editModel = obj;
|
||||||
|
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
|
||||||
|
this.mapSelected({ view: 'draft' });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mapSelected(data) {
|
||||||
|
if (data && this.editModel) {
|
||||||
|
this.$router.push({ path: `${UrlConfig.map.draft}/${this.editModel.id}/${data.view}`, query: { name: this.editModel.name } });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
resize() {
|
||||||
|
this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
|
||||||
|
const width = this.$store.state.app.width - 521 - this.widthLeft;
|
||||||
|
const height = this.$store.state.app.height - 90;
|
||||||
|
this.$store.dispatch('config/resize', { width: width, height: height });
|
||||||
|
},
|
||||||
|
setMapResize(LeftWidth) {
|
||||||
|
const widths = this.$store.state.app.width - 521 - LeftWidth;
|
||||||
|
const heights = this.$store.state.app.height - 90;
|
||||||
|
this.$store.dispatch('config/resize', { width: widths, height: heights });
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@import "src/styles/mixin.scss";
|
||||||
|
|
||||||
|
.app-wrapper {
|
||||||
|
@include clearfix;
|
||||||
|
position: relative;
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.examList {
|
||||||
|
float: left;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
File diff suppressed because it is too large
Load Diff
@ -1,69 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div id="mapMain" class="mapDraft">
|
|
||||||
<div class="map-list" :style="{width: widthLeft+'px'}">
|
|
||||||
<map-list-operation ref="mapListOperation" />
|
|
||||||
</div>
|
|
||||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
|
||||||
<transition>
|
|
||||||
<router-view />
|
|
||||||
</transition>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import MapListOperation from './mapmanage/maplist';
|
|
||||||
import localStore from 'storejs';
|
|
||||||
import DrapLeft from '@/views/components/drapLeft/index';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'MapDraft',
|
|
||||||
components: {
|
|
||||||
MapListOperation,
|
|
||||||
DrapLeft
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
widthLeft: 320
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
widthLeft(val) {
|
|
||||||
this.setMapResize(val);
|
|
||||||
},
|
|
||||||
'$store.state.app.windowSizeCount': function() {
|
|
||||||
this.resize();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.$store.dispatch('training/setPrdType', null);
|
|
||||||
this.resize();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
drapWidth(width) {
|
|
||||||
this.widthLeft = Number(width);
|
|
||||||
},
|
|
||||||
resize() {
|
|
||||||
this.widthLeft = Number(localStore.get('LeftWidth')) || this.widthLeft;
|
|
||||||
const width = this.$store.state.app.width - 521 - this.widthLeft;
|
|
||||||
const height = this.$store.state.app.height - 90;
|
|
||||||
this.$store.dispatch('config/resize', { width: width, height: height });
|
|
||||||
},
|
|
||||||
setMapResize(LeftWidth) {
|
|
||||||
const widths = this.$store.state.app.width - 521 - LeftWidth;
|
|
||||||
const heights = this.$store.state.app.height - 90;
|
|
||||||
this.$store.dispatch('config/resize', { width: widths, height: heights });
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
||||||
@import "src/styles/mixin.scss";
|
|
||||||
|
|
||||||
.mapDraft {
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.map-list {
|
|
||||||
float: left;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -59,287 +59,287 @@ import ConfigMap from './configMap';
|
|||||||
import DataRelation from './dataRelation/index';
|
import DataRelation from './dataRelation/index';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MapView',
|
name: 'MapView',
|
||||||
components: {
|
components: {
|
||||||
JlmapVisual,
|
JlmapVisual,
|
||||||
MapOperate,
|
MapOperate,
|
||||||
DataRelation,
|
DataRelation,
|
||||||
ConfigMap
|
ConfigMap
|
||||||
// MapCreate,
|
// MapCreate,
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
viewSelect: ViewMode.MIX,
|
viewSelect: ViewMode.MIX,
|
||||||
mapSaveing: false,
|
mapSaveing: false,
|
||||||
ViewMode: ViewMode,
|
ViewMode: ViewMode,
|
||||||
viewDraft: 'draft',
|
viewDraft: 'draft',
|
||||||
autoSaveTask: null,
|
autoSaveTask: null,
|
||||||
selected: null,
|
selected: null,
|
||||||
mapInfo: { name: this.$t('map.pleaseSelectMap') },
|
mapInfo: { name: this.$t('map.pleaseSelectMap') },
|
||||||
timeDemon: null
|
timeDemon: null
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
cardHeight() {
|
cardHeight() {
|
||||||
return this.$store.state.app.height - 195-30;
|
return this.$store.state.app.height - 195 - 30;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
'$store.state.map.mapDataLoadedCount': function (val) {
|
'$store.state.map.mapDataLoadedCount': function (val) {
|
||||||
this.initAutoSaveTask();
|
this.initAutoSaveTask();
|
||||||
},
|
},
|
||||||
$route() {
|
$route() {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.loadInitPage();
|
this.loadInitPage();
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.loadInitPage();
|
this.loadInitPage();
|
||||||
this.timeDemon = setInterval(() => {
|
this.timeDemon = setInterval(() => {
|
||||||
checkLoginLine();
|
checkLoginLine();
|
||||||
}, 5000 * 60);
|
}, 5000 * 60);
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
this.clearAutoSave();
|
this.clearAutoSave();
|
||||||
this.$store.dispatch('map/mapClear');
|
this.$store.dispatch('map/mapClear');
|
||||||
if (this.timeDemon) {
|
if (this.timeDemon) {
|
||||||
clearTimeout(this.timeDemon);
|
clearTimeout(this.timeDemon);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
endViewLoading(isSuccess) {
|
endViewLoading(isSuccess) {
|
||||||
if (!isSuccess) {
|
if (!isSuccess) {
|
||||||
this.$store.dispatch('map/mapClear');
|
this.$store.dispatch('map/mapClear');
|
||||||
}
|
}
|
||||||
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
EventBus.$emit('viewLoading', false);
|
EventBus.$emit('viewLoading', false);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
showMap() {
|
showMap() {
|
||||||
this.$refs.configMap.doShow();
|
this.$refs.configMap.doShow();
|
||||||
},
|
},
|
||||||
selectViewDraft(data) {
|
selectViewDraft(data) {
|
||||||
this.viewDraft = data;
|
this.viewDraft = data;
|
||||||
},
|
},
|
||||||
loadInitPage() {
|
loadInitPage() {
|
||||||
this.$store.dispatch('training/changeMode', { mode: TrainingMode.MAP_EDIT });
|
this.$store.dispatch('training/changeMode', { mode: TrainingMode.MAP_EDIT });
|
||||||
this.mapInfo = { name: this.$t('map.pleaseSelectMap'), id: this.$route.params.mapId };
|
this.mapInfo = { name: this.$t('map.pleaseSelectMap'), id: this.$route.params.mapId };
|
||||||
if (parseInt(this.mapInfo.id)) {
|
if (parseInt(this.mapInfo.id)) {
|
||||||
this.mapInfo.name = this.$route.query.name;
|
this.mapInfo.name = this.$route.query.name;
|
||||||
getMapDetail(this.$route.params.mapId).then(response => {
|
getMapDetail(this.$route.params.mapId).then(response => {
|
||||||
this.$store.dispatch('map/setMapData', response.data).then(resp => {
|
this.$store.dispatch('map/setMapData', response.data).then(resp => {
|
||||||
this.$store.dispatch('training/setMapDefaultState');
|
this.$store.dispatch('training/setMapDefaultState');
|
||||||
});
|
});
|
||||||
this.setDelayUnlockStatus(response.data, '00');
|
this.setDelayUnlockStatus(response.data, '00');
|
||||||
this.initAutoSaveTask();
|
this.initAutoSaveTask();
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
this.$messageBox(this.$t('tip.failedLoadMap'));
|
this.$messageBox(this.$t('tip.failedLoadMap'));
|
||||||
this.endViewLoading();
|
this.endViewLoading();
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
this.endViewLoading();
|
this.endViewLoading();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
initAutoSaveTask() {
|
initAutoSaveTask() {
|
||||||
const timeout = 1000 * 60 * 3;
|
const timeout = 1000 * 60 * 3;
|
||||||
this.clearAutoSave(this.autoSaveTask);
|
this.clearAutoSave(this.autoSaveTask);
|
||||||
if (this.viewDraft == 'draft') {
|
if (this.viewDraft == 'draft') {
|
||||||
this.autoSaveTask = setInterval(this.saveMapEvent, timeout);
|
this.autoSaveTask = setInterval(this.saveMapEvent, timeout);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clearAutoSave() {
|
clearAutoSave() {
|
||||||
if (this.autoSaveTask) {
|
if (this.autoSaveTask) {
|
||||||
clearInterval(this.autoSaveTask);
|
clearInterval(this.autoSaveTask);
|
||||||
this.autoSaveTask = null;
|
this.autoSaveTask = null;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSelectControlPage (model) {
|
handleSelectControlPage (model) {
|
||||||
if (this.$refs && this.$refs.mapOperate) {
|
if (this.$refs && this.$refs.mapOperate) {
|
||||||
this.$refs.mapOperate.handleSelectControlPage(model);
|
this.$refs.mapOperate.handleSelectControlPage(model);
|
||||||
this.$store.dispatch('menuOperation/setMapDrawSelectCount');
|
this.$store.dispatch('menuOperation/setMapDrawSelectCount');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSelectView(handle) {
|
handleSelectView(handle) {
|
||||||
if (this.$refs && this.$refs.jlmapVisual) {
|
if (this.$refs && this.$refs.jlmapVisual) {
|
||||||
this.$refs.jlmapVisual.setLayerVisible(handle);
|
this.$refs.jlmapVisual.setLayerVisible(handle);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSelectLogicalView(handle) {
|
handleSelectLogicalView(handle) {
|
||||||
if (this.$refs && this.$refs.jlmapVisual) {
|
if (this.$refs && this.$refs.jlmapVisual) {
|
||||||
this.$refs.jlmapVisual.setLevelVisible(handle);
|
this.$refs.jlmapVisual.setLevelVisible(handle);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSelectPhysicalView(handle) {
|
handleSelectPhysicalView(handle) {
|
||||||
if (this.$refs && this.$refs.jlmapVisual) {
|
if (this.$refs && this.$refs.jlmapVisual) {
|
||||||
this.$refs.jlmapVisual.setLevelVisible(handle);
|
this.$refs.jlmapVisual.setLevelVisible(handle);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handleSelectHybridView(handle) {
|
handleSelectHybridView(handle) {
|
||||||
if (this.$refs && this.$refs.jlmapVisual) {
|
if (this.$refs && this.$refs.jlmapVisual) {
|
||||||
this.$refs.jlmapVisual.setLevelVisible(handle);
|
this.$refs.jlmapVisual.setLevelVisible(handle);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clickEvent(em) {
|
clickEvent(em) {
|
||||||
var device = this.getDeviceByEm(em);
|
var device = this.getDeviceByEm(em);
|
||||||
this.onSelect(device);
|
this.onSelect(device);
|
||||||
if (this.$refs.dataRelation) {
|
if (this.$refs.dataRelation) {
|
||||||
this.$refs.dataRelation.setSelected(device);
|
this.$refs.dataRelation.setSelected(device);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 获取设备数据
|
// 获取设备数据
|
||||||
getDeviceByEm(em) {
|
getDeviceByEm(em) {
|
||||||
var device = this.$store.getters['map/getDeviceByCode'](em.deviceCode) || null;
|
var device = this.$store.getters['map/getDeviceByCode'](em.deviceCode) || null;
|
||||||
if (device) {
|
if (device) {
|
||||||
device._viewVal = em.val;
|
device._viewVal = em.val;
|
||||||
}
|
}
|
||||||
return device;
|
return device;
|
||||||
},
|
},
|
||||||
onSelect(device) {
|
onSelect(device) {
|
||||||
this.selected = device || null;
|
this.selected = device || null;
|
||||||
this.selected && this.handleSelectControlPage(device);
|
this.selected && this.handleSelectControlPage(device);
|
||||||
},
|
},
|
||||||
onContextmenu(em) {
|
onContextmenu(em) {
|
||||||
this.point = {
|
this.point = {
|
||||||
x: em.clientX,
|
x: em.clientX,
|
||||||
y: em.clientY
|
y: em.clientY
|
||||||
};
|
};
|
||||||
if (!em.deviceType) {
|
if (!em.deviceType) {
|
||||||
var menu = getDeviceMenuByDeviceType('Cancel');
|
var menu = getDeviceMenuByDeviceType('Cancel');
|
||||||
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu });
|
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu });
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
saveMapEvent() {
|
saveMapEvent() {
|
||||||
if (this.$refs.jlmapVisual) {
|
if (this.$refs.jlmapVisual) {
|
||||||
const map = this.$store.state.map.map;
|
const map = this.$store.state.map.map;
|
||||||
if (map && parseInt(this.$route.params.mapId)) {
|
if (map && parseInt(this.$route.params.mapId)) {
|
||||||
for (const i in map.sectionList) {
|
for (const i in map.sectionList) {
|
||||||
if (map.sectionList[i].points.length > 0) {
|
if (map.sectionList[i].points.length > 0) {
|
||||||
for (let index = 0; index < map.sectionList[i].points.length; index++) {
|
for (let index = 0; index < map.sectionList[i].points.length; index++) {
|
||||||
if (String(map.sectionList[i].points[index].x) == 'undefined' || String(map.sectionList[i].points[index].y) == 'undefined') {
|
if (String(map.sectionList[i].points[index].x) == 'undefined' || String(map.sectionList[i].points[index].y) == 'undefined') {
|
||||||
this.$messageBox(this.$t('tip.sectionPointsDeficiency'));
|
this.$messageBox(this.$t('tip.sectionPointsDeficiency'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.$messageBox(this.$t('tip.sectionPointsDeficiency'));
|
this.$messageBox(this.$t('tip.sectionPointsDeficiency'));
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
this.mapSaveing = true;
|
this.mapSaveing = true;
|
||||||
this.$store.dispatch('map/saveMapDeviceDefaultRelations').then(() => {
|
this.$store.dispatch('map/saveMapDeviceDefaultRelations').then(() => {
|
||||||
saveMap(Object.assign(map, { mapId: this.$route.params.mapId })).then(response => {
|
saveMap(Object.assign(map, { mapId: this.$route.params.mapId })).then(response => {
|
||||||
this.$message.success(this.$t('tip.saveSuccessfully'));
|
this.$message.success(this.$t('tip.saveSuccessfully'));
|
||||||
this.mapSaveing = false;
|
this.mapSaveing = false;
|
||||||
this.initAutoSaveTask();
|
this.initAutoSaveTask();
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
console.log(error);
|
console.log(error);
|
||||||
this.$messageBox(this.$t('tip.saveFailed'));
|
this.$messageBox(this.$t('tip.saveFailed'));
|
||||||
this.mapSaveing = false;
|
this.mapSaveing = false;
|
||||||
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
|
if (error.code === 40004 || error.code === 40005 || error.code === 40003) {
|
||||||
this.clearAutoSave();
|
this.clearAutoSave();
|
||||||
} else {
|
} else {
|
||||||
this.initAutoSaveTask();
|
this.initAutoSaveTask();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
console.log(error, '错误提示');
|
console.log(error, '错误提示');
|
||||||
this.mapSaveing = false;
|
this.mapSaveing = false;
|
||||||
this.$messageBox(this.$t('tip.saveFailed'));
|
this.$messageBox(this.$t('tip.saveFailed'));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
verifyMapEvent() {
|
verifyMapEvent() {
|
||||||
if (this.$refs.jlmapVisual) {
|
if (this.$refs.jlmapVisual) {
|
||||||
const map = this.$store.state.map.map;
|
const map = this.$store.state.map.map;
|
||||||
if (map && this.$route.params.mapId) {
|
if (map && this.$route.params.mapId) {
|
||||||
verifyMap(this.$route.params.mapId).then(res => {
|
verifyMap(this.$route.params.mapId).then(res => {
|
||||||
if (res.data.length) {
|
if (res.data.length) {
|
||||||
this.tableToExcel(res.data);
|
this.tableToExcel(res.data);
|
||||||
this.$messageBox(this.$t('tip.dataValidationFailed'));
|
this.$messageBox(this.$t('tip.dataValidationFailed'));
|
||||||
} else {
|
} else {
|
||||||
this.$message.success(this.$t('tip.dataValidationSuccess'));
|
this.$message.success(this.$t('tip.dataValidationSuccess'));
|
||||||
}
|
}
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
this.$messageBox(this.$t('tip.requestFailed'));
|
this.$messageBox(this.$t('tip.requestFailed'));
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
tableToExcel(data) {
|
tableToExcel(data) {
|
||||||
const filterVal = ['index'];
|
const filterVal = ['index'];
|
||||||
const arr = [];
|
const arr = [];
|
||||||
data.forEach(item => {
|
data.forEach(item => {
|
||||||
arr.push({ index: item });
|
arr.push({ index: item });
|
||||||
});
|
});
|
||||||
const dataList = this.formatJson(filterVal, arr);
|
const dataList = this.formatJson(filterVal, arr);
|
||||||
import('@/utils/Export2Excel').then(excel => {
|
import('@/utils/Export2Excel').then(excel => {
|
||||||
excel.export_json_to_excel([this.$t('tip.dataQuestion')], dataList, this.$t('tip.dataList'));
|
excel.export_json_to_excel([this.$t('tip.dataQuestion')], dataList, this.$t('tip.dataList'));
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
formatJson(filterVal, jsonData) {
|
formatJson(filterVal, jsonData) {
|
||||||
return jsonData.map(v => filterVal.map(j => v[j]));
|
return jsonData.map(v => filterVal.map(j => v[j]));
|
||||||
},
|
},
|
||||||
|
|
||||||
setDelayUnlockStatus(data, status) {
|
setDelayUnlockStatus(data, status) {
|
||||||
if (data && data.delayShowList) {
|
if (data && data.delayShowList) {
|
||||||
data.delayShowList.forEach(elem => {
|
data.delayShowList.forEach(elem => {
|
||||||
elem.status = status;
|
elem.status = status;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// 增加数据数据 给vuex map对象中
|
// 增加数据数据 给vuex map对象中
|
||||||
addOrUpdateMapModel(obj) {
|
addOrUpdateMapModel(obj) {
|
||||||
this.$store.dispatch('map/updateMapDevices', obj);
|
this.$store.dispatch('map/updateMapDevices', obj);
|
||||||
},
|
},
|
||||||
// 删除数据 同时del map
|
// 删除数据 同时del map
|
||||||
delMapModel(obj) {
|
delMapModel(obj) {
|
||||||
this.$store.dispatch('map/deleteMapDevices', obj).then(() => {
|
this.$store.dispatch('map/deleteMapDevices', obj).then(() => {
|
||||||
this.selected = null;
|
this.selected = null;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 设置显示中心
|
// 设置显示中心
|
||||||
setCenter(code) {
|
setCenter(code) {
|
||||||
this.$refs.jlmapVisual.setCenter(code);
|
this.$refs.jlmapVisual.setCenter(code);
|
||||||
},
|
},
|
||||||
createMap() {
|
createMap() {
|
||||||
this.$refs.mapCreate.show();
|
this.$refs.mapCreate.show();
|
||||||
},
|
},
|
||||||
importf() {
|
importf() {
|
||||||
const loading = this.$loading({
|
const loading = this.$loading({
|
||||||
lock: true,
|
lock: true,
|
||||||
text: '正在导入中...',
|
text: '正在导入中...',
|
||||||
spinner: 'el-icon-loading',
|
spinner: 'el-icon-loading',
|
||||||
background: 'rgba(0, 0, 0, 0.7)'
|
background: 'rgba(0, 0, 0, 0.7)'
|
||||||
});
|
});
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
const obj = this.$refs.files;
|
const obj = this.$refs.files;
|
||||||
if (!obj.files) return;
|
if (!obj.files) return;
|
||||||
const f = obj.files[0];
|
const f = obj.files[0];
|
||||||
const reader = new FileReader();
|
const reader = new FileReader();
|
||||||
const that = this;
|
const that = this;
|
||||||
reader.readAsText(f, 'utf-8');
|
reader.readAsText(f, 'utf-8');
|
||||||
reader.onload = function(e) {
|
reader.onload = function(e) {
|
||||||
const data = e.target.result;
|
const data = e.target.result;
|
||||||
postBuildMapImport(JSON.parse(data)).then(res => {
|
postBuildMapImport(JSON.parse(data)).then(res => {
|
||||||
loading.close();
|
loading.close();
|
||||||
that.$message.success('导入成功!');
|
that.$message.success('导入成功!');
|
||||||
that.refresh();
|
that.refresh();
|
||||||
loading.close();
|
loading.close();
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
loading.close();
|
loading.close();
|
||||||
that.$message.error('导入失败' + error.message);
|
that.$message.error('导入失败' + error.message);
|
||||||
});
|
});
|
||||||
obj.value = '';
|
obj.value = '';
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@ -1,361 +0,0 @@
|
|||||||
<template>
|
|
||||||
<el-card v-loading="loading" class="map-list-main">
|
|
||||||
<div slot="header" class="clearfix">
|
|
||||||
<span>{{ $t('map.sketchMap') }}</span>
|
|
||||||
<el-button type="text" style="float: right; padding: 3px 0" @click="createMap">{{ $t('map.newConstruction') }}</el-button>
|
|
||||||
<el-button type="text" class="uploadDemo">
|
|
||||||
<!-- <input
|
|
||||||
ref="files"
|
|
||||||
type="file"
|
|
||||||
class="file_box"
|
|
||||||
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
|
||||||
@change="importf"
|
|
||||||
> -->
|
|
||||||
<input
|
|
||||||
ref="files"
|
|
||||||
type="file"
|
|
||||||
class="file_box"
|
|
||||||
accept=".json, application/json"
|
|
||||||
@change="importf"
|
|
||||||
>
|
|
||||||
{{ $t('map.importMap') }}
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: height + 'px'}">
|
|
||||||
<el-tree
|
|
||||||
ref="tree"
|
|
||||||
:data="mapList"
|
|
||||||
node-key="id"
|
|
||||||
highlight-current
|
|
||||||
:props="defaultProps"
|
|
||||||
class="tree-height-max"
|
|
||||||
@node-click="handleNodeClick"
|
|
||||||
@node-contextmenu="showContextMenu"
|
|
||||||
>
|
|
||||||
<span slot-scope="{ node }">
|
|
||||||
<span v-if="node.data.type == 'skin'" class="el-icon-news"></span>
|
|
||||||
<span v-if="node.data.type == 'map'" class="el-icon-edit-outline"></span>
|
|
||||||
<span> {{ node.label }}</span>
|
|
||||||
</span>
|
|
||||||
</el-tree>
|
|
||||||
</el-scrollbar>
|
|
||||||
<map-create ref="mapCreate" :skin-code="skinCode" @refresh="refresh" @editmap="handleNodeClick" />
|
|
||||||
<map-operate-menu
|
|
||||||
ref="menu"
|
|
||||||
:point="point"
|
|
||||||
:edit-model="editModel"
|
|
||||||
:skin-code="skinCode"
|
|
||||||
@refresh="refresh"
|
|
||||||
@jlmap3d="jlmap3d"
|
|
||||||
/>
|
|
||||||
|
|
||||||
</el-card>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
|
||||||
import { getMapTree, getMapDetail, postBuildMapImport } from '@/api/jmap/mapdraft';
|
|
||||||
import { UrlConfig } from '@/router/index';
|
|
||||||
import { translate, translateSheetTitle } from '@/scripts/translate';
|
|
||||||
// import { sheet_to_json } from '@/utils/Export2Excel';
|
|
||||||
// import PopMenu from '@/components/PopMenu';
|
|
||||||
import MapOperateMenu from './operateMenu';
|
|
||||||
import MapCreate from './create';
|
|
||||||
// import XLSX from 'xlsx';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'MapListDraft',
|
|
||||||
components: {
|
|
||||||
MapCreate,
|
|
||||||
MapOperateMenu
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
loading: true,
|
|
||||||
activeName: 'first',
|
|
||||||
mapList: [],
|
|
||||||
defaultProps: {
|
|
||||||
children: 'children',
|
|
||||||
label: 'name'
|
|
||||||
},
|
|
||||||
editModel: {},
|
|
||||||
skinCode: '',
|
|
||||||
point: {
|
|
||||||
x: 0,
|
|
||||||
y: 0
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
height() {
|
|
||||||
return this.$store.state.app.height - 115;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.refresh();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
getSkinCode(node) {
|
|
||||||
let next = node;
|
|
||||||
while (next) {
|
|
||||||
if (next.data && next.data.type == 'skin') {
|
|
||||||
this.skinCode = next.data.id;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
next = next.parent;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
showContextMenu(e, obj, node, vueElem) {
|
|
||||||
if (obj && obj.type == 'map') {
|
|
||||||
e.preventDefault();
|
|
||||||
const menu = DeviceMenu.Map;
|
|
||||||
|
|
||||||
this.point = {
|
|
||||||
x: e.clientX,
|
|
||||||
y: e.clientY
|
|
||||||
};
|
|
||||||
this.editModel = obj;
|
|
||||||
this.editModel.skinCode = node.parent.data.id;
|
|
||||||
this.$store.dispatch('menuOperation/setPopMenu', { position: this.point, menu: menu });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleNodeClick(obj, node) {
|
|
||||||
this.getSkinCode(node);
|
|
||||||
if (obj && obj.type == 'map') {
|
|
||||||
this.editModel = obj;
|
|
||||||
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
|
|
||||||
this.mapSelected({ view: 'draft' });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mapSelected(data) {
|
|
||||||
if (data && this.editModel) {
|
|
||||||
this.$router.push({ path: `${UrlConfig.map.draft}/${this.editModel.id}/${data.view}`, query: { name: this.editModel.name } });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
jlmap3d() {
|
|
||||||
this.$router.push({ path: '/jlmap3d/edit', query: { mapid: this.editModel.id } });
|
|
||||||
},
|
|
||||||
createMap() {
|
|
||||||
this.$refs.mapCreate.show();
|
|
||||||
},
|
|
||||||
refresh() {
|
|
||||||
this.mapList = [];
|
|
||||||
this.loading = true;
|
|
||||||
getMapTree().then(response => {
|
|
||||||
this.loading = false;
|
|
||||||
this.mapList = response.data;
|
|
||||||
this.$refs.tree.setCurrentKey(this.$route.params.mapId); // value 绑定的node-key
|
|
||||||
}).catch(() => {
|
|
||||||
this.$messageBox('刷新树级列表失败');
|
|
||||||
this.loading = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
importf() {
|
|
||||||
// const loading = this.$loading({
|
|
||||||
// lock: true,
|
|
||||||
// text: '正在导入中...',
|
|
||||||
// spinner: 'el-icon-loading',
|
|
||||||
// background: 'rgba(0, 0, 0, 0.7)'
|
|
||||||
// });
|
|
||||||
// const obj = this.$refs.files;
|
|
||||||
// let wb;
|
|
||||||
// if (!obj.files) return;
|
|
||||||
// const f = obj.files[0];
|
|
||||||
// const reader = new FileReader();
|
|
||||||
// const that = this;
|
|
||||||
// reader.onload = function (e) {
|
|
||||||
// const data = e.target.result;
|
|
||||||
// if (that.rABS) {
|
|
||||||
// wb = XLSX.read(btoa(that.fixdata(data)), {// 手动转化
|
|
||||||
// type: 'base64'
|
|
||||||
// });
|
|
||||||
// } else {
|
|
||||||
// wb = XLSX.read(data, {
|
|
||||||
// type: 'binary'
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// const resultJSONData = { 'devices': {} };
|
|
||||||
// for (const index in wb.Sheets) {
|
|
||||||
|
|
||||||
// const titleNum = that.formatSheetTitle(index);
|
|
||||||
// const key = translateSheetTitle.sheetName[titleNum];
|
|
||||||
|
|
||||||
// const filterVal = that.handelData(key);
|
|
||||||
// const jsonData = sheet_to_json(wb.Sheets[index]);
|
|
||||||
// const data = that.formatJson(filterVal, jsonData, key);
|
|
||||||
// if (key === 'base') {
|
|
||||||
// Object.assign(resultJSONData, data[0]);
|
|
||||||
// } else if (key === 'skinVO') {
|
|
||||||
// resultJSONData['devices'][key] = data[0];
|
|
||||||
// } else {
|
|
||||||
// resultJSONData['devices'][key] = data;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// that.resultJSON = resultJSONData;
|
|
||||||
// if (that.resultJSON) {
|
|
||||||
// postBuildMapImport(that.resultJSON).then(res => {
|
|
||||||
// loading.close();
|
|
||||||
// that.$message.success('导入成功!');
|
|
||||||
// that.refresh();
|
|
||||||
// }).catch(error => {
|
|
||||||
// loading.close();
|
|
||||||
// that.$message.error('导入失败' + error.message);
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
// obj.value = ''; // 清空上次导入文件
|
|
||||||
// };
|
|
||||||
// if (that.rABS) {
|
|
||||||
// reader.readAsArrayBuffer(f);
|
|
||||||
// } else {
|
|
||||||
// reader.readAsBinaryString(f);
|
|
||||||
// }
|
|
||||||
|
|
||||||
const loading = this.$loading({
|
|
||||||
lock: true,
|
|
||||||
text: '正在导入中...',
|
|
||||||
spinner: 'el-icon-loading',
|
|
||||||
background: 'rgba(0, 0, 0, 0.7)'
|
|
||||||
});
|
|
||||||
setTimeout(() => {
|
|
||||||
const obj = this.$refs.files;
|
|
||||||
if (!obj.files) return;
|
|
||||||
const f = obj.files[0];
|
|
||||||
const reader = new FileReader();
|
|
||||||
const that = this;
|
|
||||||
reader.readAsText(f, 'utf-8');
|
|
||||||
reader.onload = function(e) {
|
|
||||||
const data = e.target.result;
|
|
||||||
postBuildMapImport(JSON.parse(data)).then(res => {
|
|
||||||
loading.close();
|
|
||||||
that.$message.success('导入成功!');
|
|
||||||
that.refresh();
|
|
||||||
loading.close();
|
|
||||||
}).catch(error => {
|
|
||||||
loading.close();
|
|
||||||
that.$message.error('导入失败' + error.message);
|
|
||||||
});
|
|
||||||
obj.value = '';
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
},
|
|
||||||
// 转换数据格式
|
|
||||||
handelData(key) {
|
|
||||||
const tHeader = [];
|
|
||||||
const tHeaderF = [];
|
|
||||||
if (translate[key]) {
|
|
||||||
translate[key].columns.forEach(item => {
|
|
||||||
tHeader.push(item.tHeader);
|
|
||||||
tHeaderF.push(item.key);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
const filterVal = {
|
|
||||||
tHeader: tHeader,
|
|
||||||
tHeaderF: tHeaderF
|
|
||||||
};
|
|
||||||
return filterVal;
|
|
||||||
},
|
|
||||||
// 文件流转BinaryString
|
|
||||||
fixdata(data) {
|
|
||||||
var o = '';
|
|
||||||
var l = 0;
|
|
||||||
var w = 10240;
|
|
||||||
for (; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w + w)));
|
|
||||||
o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w)));
|
|
||||||
return o;
|
|
||||||
},
|
|
||||||
// 转换属性名称 格式
|
|
||||||
formatJson(filterVal, jsonData, key) {
|
|
||||||
jsonData.map((item, index) => {
|
|
||||||
const json = {};
|
|
||||||
filterVal.tHeader.map((j, o) => {
|
|
||||||
if (item[j] != undefined) {
|
|
||||||
json[filterVal.tHeaderF[o]] = translate[key].columns[o].formatter(item[j]);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
jsonData.splice(index, 1, json);
|
|
||||||
});
|
|
||||||
return jsonData;
|
|
||||||
},
|
|
||||||
// 转换sheet名字
|
|
||||||
formatSheetTitle(title) {
|
|
||||||
let index;
|
|
||||||
translateSheetTitle.sheetTitle.forEach((v, i) => {
|
|
||||||
if (title == v) index = i;
|
|
||||||
});
|
|
||||||
return index;
|
|
||||||
},
|
|
||||||
|
|
||||||
// 前端方式导出
|
|
||||||
async doExportFront() {
|
|
||||||
const res = await getMapDetail(this.$route.params.mapId);
|
|
||||||
const resultData = res.data;
|
|
||||||
if (resultData === false) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const self = this;
|
|
||||||
import('@/utils/Export2Excel').then(excel => {
|
|
||||||
self.queryExportData(resultData).then(data => {
|
|
||||||
excel.export_json_excel(data, resultData.name);
|
|
||||||
}).catch(error => {
|
|
||||||
self.$message.error('导出执行异常:' + error.message);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 格式化数据列表
|
|
||||||
queryExportData(data) {
|
|
||||||
return new Promise((resolve, reject) => {
|
|
||||||
const result = {
|
|
||||||
base: []
|
|
||||||
};
|
|
||||||
const obj = {};
|
|
||||||
for (const i in data) {
|
|
||||||
if (typeof data[i] != 'object') {
|
|
||||||
obj[i] = data[i];
|
|
||||||
} else if (data[i] instanceof Array) {
|
|
||||||
if (data[i].length) {
|
|
||||||
result[i] = [...data[i]];
|
|
||||||
}
|
|
||||||
} else if (data[i] instanceof Object) {
|
|
||||||
obj[i] = data[i];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
result.base.push(obj);
|
|
||||||
resolve(result);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped rel="stylesheet/scss" lang="scss">
|
|
||||||
.uploadDemo {
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
float: right;
|
|
||||||
padding: 3px 0;
|
|
||||||
margin-right: 3px;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
opacity: 0;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
<style>
|
|
||||||
.el-tree {
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
.el-card__body {
|
|
||||||
padding: 0px;
|
|
||||||
}
|
|
||||||
.el-tree-node.is-current>.el-tree-node__content {
|
|
||||||
background-color: #e4e3e3 !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -19,196 +19,196 @@ import MapPublish from './publish';
|
|||||||
import { mapGetters } from 'vuex';
|
import { mapGetters } from 'vuex';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MapOperateMenu',
|
name: 'MapOperateMenu',
|
||||||
components: {
|
components: {
|
||||||
PopMenu,
|
PopMenu,
|
||||||
MapEdit,
|
MapEdit,
|
||||||
MapSaveAs,
|
MapSaveAs,
|
||||||
MapPublish
|
MapPublish
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
point: {
|
point: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true
|
required: true
|
||||||
},
|
},
|
||||||
skinCode: {
|
skinCode: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true
|
required: true
|
||||||
},
|
},
|
||||||
editModel: {
|
editModel: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true
|
required: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
menuMap: [
|
menuMap: [
|
||||||
{
|
{
|
||||||
label: this.$t('map.updateObj'),
|
label: this.$t('map.updateObj'),
|
||||||
handler: this.updateObj
|
handler: this.updateObj
|
||||||
},
|
},
|
||||||
// {
|
// {
|
||||||
// label: this.$t('map.updateObjAxis'),
|
// label: this.$t('map.updateObjAxis'),
|
||||||
// handler: this.updateObjAxis
|
// handler: this.updateObjAxis
|
||||||
// },
|
// },
|
||||||
{
|
{
|
||||||
label: this.$t('map.saveAs'),
|
label: this.$t('map.saveAs'),
|
||||||
handler: this.saveAs
|
handler: this.saveAs
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: this.$t('map.deleteObj'),
|
label: this.$t('map.deleteObj'),
|
||||||
handler: this.deleteObj
|
handler: this.deleteObj
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: this.$t('map.jlmap3d'),
|
label: this.$t('map.jlmap3d'),
|
||||||
handler: this.jlmap3d
|
handler: this.jlmap3d
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
publishMapMenu: {
|
publishMapMenu: {
|
||||||
label: this.$t('map.publish'),
|
label: this.$t('map.publish'),
|
||||||
handler: this.publish
|
handler: this.publish
|
||||||
},
|
},
|
||||||
menuNormal: [],
|
menuNormal: [],
|
||||||
menu: []
|
menu: []
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapGetters('map', [
|
...mapGetters('map', [
|
||||||
'stationList'
|
'stationList'
|
||||||
]),
|
]),
|
||||||
hasRelease() {
|
hasRelease() {
|
||||||
return this.$store.state.user.roles.includes('04') ||
|
return this.$store.state.user.roles.includes('04') ||
|
||||||
this.$store.state.user.roles.includes('05');
|
this.$store.state.user.roles.includes('05');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
'$store.state.menuOperation.menuCount': function (val) {
|
'$store.state.menuOperation.menuCount': function (val) {
|
||||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.Map)) {
|
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.Map)) {
|
||||||
this.menu = [...this.menuMap];
|
this.menu = [...this.menuMap];
|
||||||
if (this.hasRelease) {
|
if (this.hasRelease) {
|
||||||
this.menu.push(this.publishMapMenu);
|
this.menu.push(this.publishMapMenu);
|
||||||
}
|
}
|
||||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||||
} else if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.Cancel)) {
|
} else if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.Cancel)) {
|
||||||
this.initCancelMenu();
|
this.initCancelMenu();
|
||||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||||
} else {
|
} else {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.closeEvent();
|
this.closeEvent();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
closeEvent() {
|
closeEvent() {
|
||||||
const self = this;
|
const self = this;
|
||||||
window.onclick = function (e) {
|
window.onclick = function (e) {
|
||||||
self.doClose();
|
self.doClose();
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
doShow(point) {
|
doShow(point) {
|
||||||
this.closeEvent();
|
this.closeEvent();
|
||||||
if (this.$refs && this.$refs.popMenu) {
|
if (this.$refs && this.$refs.popMenu) {
|
||||||
this.$refs.popMenu.resetShowPosition(point);
|
this.$refs.popMenu.resetShowPosition(point);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
doClose() {
|
doClose() {
|
||||||
if (this.$refs && this.$refs.popMenu) {
|
if (this.$refs && this.$refs.popMenu) {
|
||||||
this.$refs.popMenu.close();
|
this.$refs.popMenu.close();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
updateObj() {
|
updateObj() {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
if (this.$refs && this.$refs.edit) {
|
if (this.$refs && this.$refs.edit) {
|
||||||
this.$refs.edit.show('editCode');
|
this.$refs.edit.show('editCode');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
updateObjAxis() {
|
updateObjAxis() {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
if (this.$refs && this.$refs.axisEdit) {
|
if (this.$refs && this.$refs.axisEdit) {
|
||||||
this.$refs.axisEdit.show('editPoint');
|
this.$refs.axisEdit.show('editPoint');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
saveAs() {
|
saveAs() {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
if (this.$refs && this.$refs.saveAs) {
|
if (this.$refs && this.$refs.saveAs) {
|
||||||
this.$refs.saveAs.show();
|
this.$refs.saveAs.show();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
publish() {
|
publish() {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
if (this.$refs && this.$refs.publish) {
|
if (this.$refs && this.$refs.publish) {
|
||||||
this.$refs.publish.show();
|
this.$refs.publish.show();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
deleteObj() {
|
deleteObj() {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
const _that = this;
|
const _that = this;
|
||||||
this.$confirm(this.$t('tip.confirmDeletion'), this.$t('tip.hint'), {
|
this.$confirm(this.$t('tip.confirmDeletion'), this.$t('tip.hint'), {
|
||||||
confirmButtonText: this.$t('map.confirm'),
|
confirmButtonText: this.$t('map.confirm'),
|
||||||
cancelButtonText: this.$t('map.cancel'),
|
cancelButtonText: this.$t('map.cancel'),
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
deleteMap(this.editModel.id).then(response => {
|
deleteMap(this.editModel.id).then(response => {
|
||||||
if (this.editModel.id == this.$route.params.mapId) {
|
if (this.editModel.id == this.$route.params.mapId) {
|
||||||
this.$store.dispatch('map/mapClear').then(() => {
|
this.$store.dispatch('map/mapClear').then(() => {
|
||||||
_that.$emit('editMap', null);
|
_that.$emit('editMap', null);
|
||||||
// _that.$router.push({ path: `${UrlConfig.map.draft}/0/draft` });
|
// _that.$router.push({ path: `${UrlConfig.map.draft}/0/draft` });
|
||||||
_that.$router.push({ path: `${UrlConfig.designUser.prefix}` });
|
_that.$router.push({ path: `${UrlConfig.designUser.prefix}` });
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
_that.refresh();
|
_that.refresh();
|
||||||
_that.$message.success(this.$t('map.successfullyDelete'));
|
_that.$message.success(this.$t('map.successfullyDelete'));
|
||||||
}).catch(error => {
|
}).catch(error => {
|
||||||
_that.$message.error(this.$t('map.failDelete') + error.message);
|
_that.$message.error(this.$t('map.failDelete') + error.message);
|
||||||
});
|
});
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
jlmap3d() {
|
jlmap3d() {
|
||||||
this.$emit('jlmap3d');
|
this.$emit('jlmap3d');
|
||||||
},
|
},
|
||||||
refresh() {
|
refresh() {
|
||||||
this.$emit('refresh');
|
this.$emit('refresh');
|
||||||
},
|
},
|
||||||
initCancelMenu() {
|
initCancelMenu() {
|
||||||
this.menuNormal = [];
|
this.menuNormal = [];
|
||||||
this.stationList.forEach(station => {
|
this.stationList.forEach(station => {
|
||||||
if (station.code === station.concentrateStationCode) {
|
if (station.code === station.concentrateStationCode) {
|
||||||
const node = {
|
const node = {
|
||||||
label: station.name,
|
label: station.name,
|
||||||
children: []
|
children: []
|
||||||
};
|
};
|
||||||
|
|
||||||
this.stationList.forEach(elem => {
|
this.stationList.forEach(elem => {
|
||||||
if (elem.visible) {
|
if (elem.visible) {
|
||||||
let next = elem;
|
let next = elem;
|
||||||
while (next.code != next.concentrateStationCode || !next.concentrateStationCode) {
|
while (next.code != next.concentrateStationCode || !next.concentrateStationCode) {
|
||||||
next = this.$store.getters['map/getDeviceByCode'](next.concentrateStationCode);
|
next = this.$store.getters['map/getDeviceByCode'](next.concentrateStationCode);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (station.code == next.code) {
|
if (station.code == next.code) {
|
||||||
node.children.push({
|
node.children.push({
|
||||||
code: elem.code,
|
code: elem.code,
|
||||||
label: elem.name,
|
label: elem.name,
|
||||||
handler: this.mapLocation
|
handler: this.mapLocation
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
this.menuNormal.push(node);
|
this.menuNormal.push(node);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
this.menu = [...this.menuNormal];
|
this.menu = [...this.menuNormal];
|
||||||
},
|
},
|
||||||
mapLocation(item) {
|
mapLocation(item) {
|
||||||
if (item) {
|
if (item) {
|
||||||
this.doClose();
|
this.doClose();
|
||||||
this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: item.code });
|
this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: item.code });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,312 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div v-loading="loading" class="card-box">
|
|
||||||
<el-steps class="steps" :active="display">
|
|
||||||
<el-step :title="title" icon="el-icon-edit-outline" />
|
|
||||||
<el-step title="" icon="el-icon-upload" />
|
|
||||||
</el-steps>
|
|
||||||
<el-card class="forms">
|
|
||||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height:height -120 + 'px'}" style="padding-top: 40px">
|
|
||||||
<el-form ref="form" :model="addModel" label-width="140px">
|
|
||||||
<el-form-item :label="$t('map.skinStyleColon')" prop="mapName">
|
|
||||||
<el-input v-model="addModel.mapName" :disabled="true" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item :label="$t('map.productType') + ':'" prop="prdType">
|
|
||||||
<el-radio-group v-model="addModel.prdType" :disabled="isUpdate">
|
|
||||||
<template v-for="item in chooseList">
|
|
||||||
<el-radio-button :key="item.code" :label="item.code">{{ item.name }}</el-radio-button>
|
|
||||||
</template>
|
|
||||||
</el-radio-group>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
:label="$t('map.productCode') + ':'"
|
|
||||||
prop="code"
|
|
||||||
:rules="node && node.data.type ==='skin' ? baseRules.code:{}"
|
|
||||||
>
|
|
||||||
<el-input v-model="addModel.code" :disabled="codeDisabled" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item :label="$t('map.productName') + ':'" prop="name" :rules="baseRules.name">
|
|
||||||
<el-input v-model="addModel.name" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item
|
|
||||||
v-if="isShowTrainTypes"
|
|
||||||
:label="$t('map.associateTrainingTypes') + ':'"
|
|
||||||
prop="trainTypes"
|
|
||||||
:rules="baseRules.trainTypes"
|
|
||||||
>
|
|
||||||
<el-select v-model="addModel.trainTypes" multiple :placeholder="$t('map.pleaseSelect')" @change="trainTypesChange">
|
|
||||||
<el-option
|
|
||||||
v-for="item in trainTypesList"
|
|
||||||
:key="item.code"
|
|
||||||
:label="item.name"
|
|
||||||
:value="item.code"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item :label="$t('map.productDescription') + ':'" prop="remarks" :rules="baseRules.remarks">
|
|
||||||
<el-input v-model="addModel.remarks" type="textarea" :rows="4" />
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</el-scrollbar>
|
|
||||||
</el-card>
|
|
||||||
<div class="draft">
|
|
||||||
<el-button-group>
|
|
||||||
<el-button v-if="isCreate" type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
|
||||||
<el-button v-if="isUpdate" type="primary" @click="update">{{ $t('map.updata') }}</el-button>
|
|
||||||
<el-button v-if="isDelete" type="danger" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
|
||||||
</el-button-group>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { createTrainingCategory, updateTrainingCategory, getProductDetail, deleteTrainingCategory, checkMapProductCodeExist } from '@/api/management/mapprd';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'ShowDetail',
|
|
||||||
props: {
|
|
||||||
height: {
|
|
||||||
type: Number,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
loading: false,
|
|
||||||
node: null,
|
|
||||||
display: 1,
|
|
||||||
codeDisabled: true,
|
|
||||||
rules: {},
|
|
||||||
trainTypesList: [],
|
|
||||||
initTrainTypes: [],
|
|
||||||
chooseList: [],
|
|
||||||
addModel: {
|
|
||||||
id: '',
|
|
||||||
mapId: '',
|
|
||||||
mapName: '',
|
|
||||||
skinCode: '',
|
|
||||||
name: '',
|
|
||||||
remarks: '',
|
|
||||||
code: '',
|
|
||||||
prdType: '01',
|
|
||||||
trainTypes: []
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
title() {
|
|
||||||
if (this.node && this.node.data) {
|
|
||||||
if (this.node.data.type === 'Skin') {
|
|
||||||
return this.$t('map.createProductCategories');
|
|
||||||
} else if (this.node.data.type === 'Prd' ||
|
|
||||||
this.node.data.type === 'Prd') {
|
|
||||||
return this.$t('map.editTraining');
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return this.$t('map.selectOperation');
|
|
||||||
},
|
|
||||||
isCreate() {
|
|
||||||
return this.node && this.node.data.type === 'Skin';
|
|
||||||
},
|
|
||||||
isUpdate() {
|
|
||||||
return this.node && this.node.data.type === 'Prd';
|
|
||||||
},
|
|
||||||
isDelete() {
|
|
||||||
return this.node && this.node.data.type === 'Prd';
|
|
||||||
},
|
|
||||||
isShowTrainTypes() {
|
|
||||||
return this.addModel.prdType != '03' && this.addModel.prdType != '04';
|
|
||||||
},
|
|
||||||
baseRules() {
|
|
||||||
return {
|
|
||||||
code: [
|
|
||||||
{ required: true, message: this.$t('rules.productCodeEnter'), trigger: 'change' }
|
|
||||||
],
|
|
||||||
name: [
|
|
||||||
{ required: true, message: this.$t('rules.productNameEnter'), trigger: 'change' }
|
|
||||||
],
|
|
||||||
remarks: [
|
|
||||||
{ required: true, message: this.$t('rules.productDescriptionEnter'), trigger: 'change' }
|
|
||||||
],
|
|
||||||
trainTypes: [
|
|
||||||
{ required: true, message: this.$t('rules.trainingTypeSelect'), trigger: 'change' }
|
|
||||||
]
|
|
||||||
};
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.$Dictionary.trainingType().then(list => {
|
|
||||||
this.trainTypesList = list;
|
|
||||||
});
|
|
||||||
this.$Dictionary.productPostType().then(list => {
|
|
||||||
this.chooseList = list;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
loadData(node) {
|
|
||||||
if (node) {
|
|
||||||
// 清除数据
|
|
||||||
this.node = node;
|
|
||||||
this.initTrainTypes = [];
|
|
||||||
this.$refs.form.resetFields();
|
|
||||||
this.loading = true;
|
|
||||||
if (node.data.type === 'Skin') {
|
|
||||||
this.codeDisabled = false;
|
|
||||||
this.addModel.mapName = node.data.name;
|
|
||||||
this.addModel.skinCode = node.data.id;
|
|
||||||
this.loading = false;
|
|
||||||
} else if (node.data.type === 'Prd') {
|
|
||||||
this.codeDisabled = true;
|
|
||||||
getProductDetail(node.data.id).then(response => {
|
|
||||||
this.addModel.mapName = node.parent.data.name;
|
|
||||||
this.addModel.mapId = node.parent.data.id;
|
|
||||||
this.addModel.name = response.data.name;
|
|
||||||
this.addModel.remarks = response.data.remarks;
|
|
||||||
this.addModel.prdType = response.data.prdType;
|
|
||||||
this.addModel.code = response.data.code;
|
|
||||||
this.addModel.skinCode = response.data.skinCode;
|
|
||||||
this.addModel.trainTypes = this.initTrainTypes = response.data.trainTypes;
|
|
||||||
this.addModel.id = response.data.id;
|
|
||||||
this.loading = false;
|
|
||||||
}).catch(() => {
|
|
||||||
this.loading = false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.addModel.prdType = '01';
|
|
||||||
this.loading = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 清除表单验证提示信息
|
|
||||||
this.$nextTick(function () {
|
|
||||||
this.$refs.form.clearValidate();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
create() {
|
|
||||||
this.$refs.form.validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
const data = {
|
|
||||||
skinCode: this.addModel.skinCode,
|
|
||||||
mapName: this.addModel.mapName,
|
|
||||||
name: this.addModel.name,
|
|
||||||
remarks: this.addModel.remarks,
|
|
||||||
prdType: this.addModel.prdType,
|
|
||||||
code: this.addModel.code,
|
|
||||||
trainTypes: this.isShowTrainTypes ? this.addModel.trainTypes : []
|
|
||||||
};
|
|
||||||
checkMapProductCodeExist({ code: this.addModel.code }).then(response => {
|
|
||||||
if (!response.data) {
|
|
||||||
createTrainingCategory(data).then(response => {
|
|
||||||
this.initTrainTypes = this.addModel.trainTypes;
|
|
||||||
this.$emit('refresh');
|
|
||||||
this.$message.success(this.$t('tip.productCreationSuccessfully'));
|
|
||||||
}).catch(() => {
|
|
||||||
this.$messageBox(this.$t('tip.productCreationFailed'));
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.$messageBox(this.$t('tip.productCodeExists'));
|
|
||||||
}
|
|
||||||
}).catch(() => {
|
|
||||||
this.$messageBox(this.$t('tip.productCodeExists'));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
update() {
|
|
||||||
this.$refs.form.validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
this.addModel.trainTypes = this.isShowTrainTypes ? this.addModel.trainTypes : [];
|
|
||||||
updateTrainingCategory(this.addModel).then(response => {
|
|
||||||
this.initTrainTypes = this.addModel.trainTypes;
|
|
||||||
this.$message.success(this.$t('tip.updateProductSuccessfully'));
|
|
||||||
this.$emit('refresh');
|
|
||||||
}).catch(() => {
|
|
||||||
this.$messageBox(this.$t('tip.updateProductFailed'));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
trainTypesChange(tag) {
|
|
||||||
if (this.initTrainTypes && this.initTrainTypes.length > 0) {
|
|
||||||
this.initTrainTypes.forEach(elem => {
|
|
||||||
if (this.addModel.trainTypes.indexOf(elem) < 0) {
|
|
||||||
this.addModel.trainTypes = this.initTrainTypes;
|
|
||||||
this.$messageBox(this.$t('tip.narrowScope'));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
deleteObj() {
|
|
||||||
this.$refs.form.validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
deleteTrainingCategory(this.addModel).then(response => {
|
|
||||||
this.$message.success(this.$t('tip.deleteProductSuccessfully'));
|
|
||||||
this.$refs.form.resetFields();
|
|
||||||
this.node = null;
|
|
||||||
this.$emit('refresh');
|
|
||||||
}).catch(error => {
|
|
||||||
if (error.code === 500009) {
|
|
||||||
this.$messageBox(this.$t('tip.cannotDeleteProduct'));
|
|
||||||
} else {
|
|
||||||
this.$messageBox(this.$t('tip.deleteProductFailed'));
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
||||||
@import "src/styles/mixin.scss";
|
|
||||||
|
|
||||||
.card-box {
|
|
||||||
padding-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.steps {
|
|
||||||
width: 980px;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding-top: 20px;
|
|
||||||
height: 100%;
|
|
||||||
|
|
||||||
/deep/ {
|
|
||||||
.el-step__icon.is-icon {
|
|
||||||
width: 95px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.forms {
|
|
||||||
width: 800px;
|
|
||||||
margin: 0 auto;
|
|
||||||
margin-top: 20px;
|
|
||||||
|
|
||||||
/deep/ {
|
|
||||||
.el-select {
|
|
||||||
float: left;
|
|
||||||
width: calc(600px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-textarea {
|
|
||||||
float: left;
|
|
||||||
width: calc(600px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-form-item__content>.el-input {
|
|
||||||
float: left;
|
|
||||||
width: calc(600px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-input-number {
|
|
||||||
float: left;
|
|
||||||
width: calc(250px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.draft {
|
|
||||||
width: 300px;
|
|
||||||
text-align: center;
|
|
||||||
margin: 20px auto;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -1,59 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="training-tree">
|
|
||||||
<training-tree-operate ref="trainingTree" :height="height" @loadData="loadData" />
|
|
||||||
</div>
|
|
||||||
<div class="training-draft" :style="{width: width +'px'}">
|
|
||||||
<edit-detail-operate ref="training" :height="height" @refresh="refresh" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import TrainingTreeOperate from './tree';
|
|
||||||
import EditDetailOperate from './edit';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'TrainingEditOperate',
|
|
||||||
components: {
|
|
||||||
EditDetailOperate,
|
|
||||||
TrainingTreeOperate
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
width() {
|
|
||||||
return this.$store.state.app.width - 420;
|
|
||||||
},
|
|
||||||
height() {
|
|
||||||
return this.$store.state.app.height -150;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
loadData(node) {
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.$refs.training.loadData(node);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
refresh() {
|
|
||||||
this.$nextTick(() => {
|
|
||||||
this.$refs.trainingTree.refresh();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
||||||
@import "src/styles/mixin.scss";
|
|
||||||
|
|
||||||
.training-tree {
|
|
||||||
float: left;
|
|
||||||
width: 420px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.training-draft {
|
|
||||||
float: left;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -1,119 +0,0 @@
|
|||||||
<template>
|
|
||||||
<el-card v-loading="loading" class="map-list-main">
|
|
||||||
<div slot="header" class="clearfix">
|
|
||||||
<span>{{ $t('map.productCategories') }}</span>
|
|
||||||
</div>
|
|
||||||
<el-input v-model="filterText" :placeholder="$t('tip.enterKeywordsFiltering')" clearable />
|
|
||||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: height +'px' }">
|
|
||||||
<el-tree
|
|
||||||
ref="trainingTree"
|
|
||||||
:data="treeData"
|
|
||||||
:filter-node-method="filterNode"
|
|
||||||
:lazy="false"
|
|
||||||
:props="defaultProps"
|
|
||||||
class="tree-height-max"
|
|
||||||
expand-on-click-node
|
|
||||||
highlight-current
|
|
||||||
@node-click="clickEvent"
|
|
||||||
>
|
|
||||||
<span slot-scope="{ node }">
|
|
||||||
<span v-if="node.data.type == 'skin'" class="el-icon-news" />
|
|
||||||
<span v-if="node.data.type == 'prd'" class="el-icon-tickets" />
|
|
||||||
<span v-if="node.data.type == 'trainingType'" class="el-icon-document" />
|
|
||||||
<span v-if="node.data.type == 'trainingType'" class="el-icon-edit" />
|
|
||||||
<span> {{ node.label }}</span>
|
|
||||||
</span>
|
|
||||||
</el-tree>
|
|
||||||
</el-scrollbar>
|
|
||||||
</el-card>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import { getProductTree } from '@/api/management/mapprd';
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'TreeOperate',
|
|
||||||
props: {
|
|
||||||
height: {
|
|
||||||
type: Number,
|
|
||||||
required: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
loading: true,
|
|
||||||
defaultProps: {
|
|
||||||
children: 'children',
|
|
||||||
label: 'name'
|
|
||||||
},
|
|
||||||
filterText: '',
|
|
||||||
treeData: [],
|
|
||||||
node: {},
|
|
||||||
point: {
|
|
||||||
x: 0,
|
|
||||||
y: 0
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
filterText(val) {
|
|
||||||
this.$refs.trainingTree.filter(val);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.refresh();
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
filterNode(value, data) {
|
|
||||||
if (!value) return true;
|
|
||||||
return data.name.indexOf(value) !== -1;
|
|
||||||
},
|
|
||||||
showContextMenu(e, obj, node, vueElem) {
|
|
||||||
e.preventDefault();
|
|
||||||
this.point = {
|
|
||||||
x: e.clientX,
|
|
||||||
y: e.clientY
|
|
||||||
};
|
|
||||||
if (obj) {
|
|
||||||
this.node = node;
|
|
||||||
this.$refs.menu.show();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
clickEvent(obj, node, data) {
|
|
||||||
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
|
|
||||||
this.$emit('loadData', node);
|
|
||||||
},
|
|
||||||
convertTreeData(list) {
|
|
||||||
const tree = [];
|
|
||||||
if (list && list.length) {
|
|
||||||
/* 去除列表的training节点*/
|
|
||||||
list.forEach(elem => {
|
|
||||||
elem.children = this.convertTreeData(elem.children);
|
|
||||||
if (elem.type !== 'TrainingType') {
|
|
||||||
tree.push(elem);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
return tree;
|
|
||||||
},
|
|
||||||
refresh() {
|
|
||||||
getProductTree().then(response => {
|
|
||||||
this.treeData = this.convertTreeData(response.data);
|
|
||||||
this.$nextTick(() => { this.loading = false; });
|
|
||||||
}).catch(() => {
|
|
||||||
this.$messageBox(this.$t('tip.refreshFailure'));
|
|
||||||
this.loading = false;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-tree {
|
|
||||||
overflow-x: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-tree-node.is-current>.el-tree-node__content {
|
|
||||||
background-color: #e4e3e3 !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
@ -12,122 +12,122 @@ import { launchFullscreen } from '@/utils/screen';
|
|||||||
import { UrlConfig } from '@/router/index';
|
import { UrlConfig } from '@/router/index';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'ManagementList',
|
name: 'ManagementList',
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
EffectiveTypeList: [],
|
EffectiveTypeList: [],
|
||||||
pagerConfig: {
|
pagerConfig: {
|
||||||
pageSize: 'pageSize',
|
pageSize: 'pageSize',
|
||||||
pageIndex: 'pageNum'
|
pageIndex: 'pageNum'
|
||||||
},
|
},
|
||||||
queryForm: {
|
queryForm: {
|
||||||
labelWidth: '120px',
|
labelWidth: '120px',
|
||||||
queryObject: {
|
queryObject: {
|
||||||
mapName: {
|
mapName: {
|
||||||
type: 'text',
|
type: 'text',
|
||||||
label: this.$t('replay.mapName')
|
label: this.$t('replay.mapName')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
queryList: {
|
queryList: {
|
||||||
query: getSimulationRelpayList,
|
query: getSimulationRelpayList,
|
||||||
selectCheckShow: false,
|
selectCheckShow: false,
|
||||||
indexShow: true,
|
indexShow: true,
|
||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
title: this.$t('replay.mapName'),
|
title: this.$t('replay.mapName'),
|
||||||
prop: 'mapName'
|
prop: 'mapName'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('replay.creatorId'),
|
title: this.$t('replay.creatorId'),
|
||||||
prop: 'creatorId'
|
prop: 'creatorId'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('replay.createTime'),
|
title: this.$t('replay.createTime'),
|
||||||
prop: 'createTime'
|
prop: 'createTime'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: this.$t('global.status'),
|
title: this.$t('global.status'),
|
||||||
prop: 'status',
|
prop: 'status',
|
||||||
type: 'tag',
|
type: 'tag',
|
||||||
columnValue: (row) => { return this.$convertField(row.status, this.EffectiveTypeList, ['value', 'label']); },
|
columnValue: (row) => { return this.$convertField(row.status, this.EffectiveTypeList, ['value', 'label']); },
|
||||||
tagType: (row) => {
|
tagType: (row) => {
|
||||||
switch (row.status) {
|
switch (row.status) {
|
||||||
case '1': return 'success';
|
case '1': return 'success';
|
||||||
default: return 'danger';
|
default: return 'danger';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: 'button',
|
||||||
title: this.$t('global.operate'),
|
title: this.$t('global.operate'),
|
||||||
width: '250',
|
width: '250',
|
||||||
buttons: [
|
buttons: [
|
||||||
{
|
{
|
||||||
name: this.$t('replay.replay'),
|
name: this.$t('replay.replay'),
|
||||||
handleClick: this.rePlay,
|
handleClick: this.rePlay,
|
||||||
type: '',
|
type: '',
|
||||||
showControl: (row) => { return row.status == '1'; }
|
showControl: (row) => { return row.status == '1'; }
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: this.$t('global.delete'),
|
name: this.$t('global.delete'),
|
||||||
handleClick: this.delete,
|
handleClick: this.delete,
|
||||||
type: 'danger',
|
type: 'danger',
|
||||||
showControl: (row) => { return this.role; }
|
showControl: (row) => { return this.role; }
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
||||||
currentModel: {}
|
currentModel: {}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
role() {
|
role() {
|
||||||
return this.$store.state.user.roles.includes('04') ||
|
return this.$store.state.user.roles.includes('04') ||
|
||||||
this.$store.state.user.roles.includes('05');
|
this.$store.state.user.roles.includes('05');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.loadInitData();
|
this.loadInitData();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
loadInitData() {
|
loadInitData() {
|
||||||
this.EffectiveTypeList = [];
|
this.EffectiveTypeList = [];
|
||||||
this.$Dictionary.effectiveType().then(list => {
|
this.$Dictionary.effectiveType().then(list => {
|
||||||
this.EffectiveTypeList = list.map(elem => { return { value: elem.code, label: elem.name }; });
|
this.EffectiveTypeList = list.map(elem => { return { value: elem.code, label: elem.name }; });
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
reloadTable() {
|
reloadTable() {
|
||||||
this.queryList.reload();
|
this.queryList.reload();
|
||||||
},
|
},
|
||||||
rePlay(index, data) {
|
rePlay(index, data) {
|
||||||
getPublishMapInfo(data.mapId).then(resp => {
|
getPublishMapInfo(data.mapId).then(resp => {
|
||||||
const model = resp.data;
|
const model = resp.data;
|
||||||
simulationRelpay(data.id).then(rest => {
|
simulationRelpay(data.id).then(rest => {
|
||||||
const query = { skinCode: model.skinCode, group: rest.data, replayId: data.id, createTime: data.createTime, destroyTime: data.destroyTime };
|
const query = { skinCode: model.skinCode, group: rest.data, replayId: data.id, createTime: data.createTime, destroyTime: data.destroyTime };
|
||||||
this.$router.push({ path: `${UrlConfig.display}/replay`, query: query });
|
this.$router.push({ path: `${UrlConfig.display}/replay`, query: query });
|
||||||
launchFullscreen();
|
launchFullscreen();
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
delete(index, data) {
|
delete(index, data) {
|
||||||
this.$confirm(this.$t('replay.wellDelReplay'), this.$t('global.tips'), {
|
this.$confirm(this.$t('replay.wellDelReplay'), this.$t('global.tips'), {
|
||||||
confirmButtonText: this.$t('global.confirm'),
|
confirmButtonText: this.$t('global.confirm'),
|
||||||
cancelButtonText: this.$t('global.cancel'),
|
cancelButtonText: this.$t('global.cancel'),
|
||||||
type: 'warning'
|
type: 'warning'
|
||||||
}).then(() => {
|
}).then(() => {
|
||||||
delSimulationRecord(data.id).then(response => {
|
delSimulationRecord(data.id).then(response => {
|
||||||
this.$message.success(this.$t('replay.deleteSuccess'));
|
this.$message.success(this.$t('replay.deleteSuccess'));
|
||||||
this.reloadTable();
|
this.reloadTable();
|
||||||
}).catch(() => {
|
}).catch(() => {
|
||||||
this.reloadTable();
|
this.reloadTable();
|
||||||
this.$messageBox(this.$t('error.deleteFailedv'));
|
this.$messageBox(this.$t('error.deleteFailedv'));
|
||||||
});
|
});
|
||||||
}).catch(() => { });
|
}).catch(() => { });
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
305
src/views/system/product/edit.vue
Normal file
305
src/views/system/product/edit.vue
Normal file
@ -0,0 +1,305 @@
|
|||||||
|
<template>
|
||||||
|
<div v-loading="loading" class="card-box">
|
||||||
|
<el-steps class="steps" :active="display">
|
||||||
|
<el-step :title="title" icon="el-icon-edit-outline" />
|
||||||
|
<el-step title="" icon="el-icon-upload" />
|
||||||
|
</el-steps>
|
||||||
|
<el-card class="forms" style="padding-top: 40px">
|
||||||
|
<el-form ref="form" :model="addModel" label-width="140px">
|
||||||
|
<el-form-item :label="$t('map.skinStyleColon')" prop="mapName">
|
||||||
|
<el-input v-model="addModel.mapName" :disabled="true" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item :label="$t('map.productType') + ':'" prop="prdType">
|
||||||
|
<el-radio-group v-model="addModel.prdType" :disabled="isUpdate">
|
||||||
|
<template v-for="item in chooseList">
|
||||||
|
<el-radio-button :key="item.code" :label="item.code">{{ item.name }}</el-radio-button>
|
||||||
|
</template>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item
|
||||||
|
:label="$t('map.productCode') + ':'"
|
||||||
|
prop="code"
|
||||||
|
:rules="node && node.data.type ==='skin' ? baseRules.code:{}"
|
||||||
|
>
|
||||||
|
<el-input v-model="addModel.code" :disabled="codeDisabled" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item :label="$t('map.productName') + ':'" prop="name" :rules="baseRules.name">
|
||||||
|
<el-input v-model="addModel.name" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item
|
||||||
|
v-if="isShowTrainTypes"
|
||||||
|
:label="$t('map.associateTrainingTypes') + ':'"
|
||||||
|
prop="trainTypes"
|
||||||
|
:rules="baseRules.trainTypes"
|
||||||
|
>
|
||||||
|
<el-select v-model="addModel.trainTypes" multiple :placeholder="$t('map.pleaseSelect')" @change="trainTypesChange">
|
||||||
|
<el-option
|
||||||
|
v-for="item in trainTypesList"
|
||||||
|
:key="item.code"
|
||||||
|
:label="item.name"
|
||||||
|
:value="item.code"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item :label="$t('map.productDescription') + ':'" prop="remarks" :rules="baseRules.remarks">
|
||||||
|
<el-input v-model="addModel.remarks" type="textarea" :rows="4" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</el-card>
|
||||||
|
<div class="draft">
|
||||||
|
<el-button-group>
|
||||||
|
<el-button v-if="isCreate" type="primary" @click="create">{{ $t('map.create') }}</el-button>
|
||||||
|
<el-button v-if="isUpdate" type="primary" @click="update">{{ $t('map.updata') }}</el-button>
|
||||||
|
<el-button v-if="isDelete" type="danger" @click="deleteObj">{{ $t('map.deleteObj') }}</el-button>
|
||||||
|
</el-button-group>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { createTrainingCategory, updateTrainingCategory, getProductDetail, deleteTrainingCategory, checkMapProductCodeExist } from '@/api/management/mapprd';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'ShowDetail',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
node: null,
|
||||||
|
display: 1,
|
||||||
|
codeDisabled: true,
|
||||||
|
rules: {},
|
||||||
|
trainTypesList: [],
|
||||||
|
initTrainTypes: [],
|
||||||
|
chooseList: [],
|
||||||
|
addModel: {
|
||||||
|
id: '',
|
||||||
|
mapId: '',
|
||||||
|
mapName: '',
|
||||||
|
skinCode: '',
|
||||||
|
name: '',
|
||||||
|
remarks: '',
|
||||||
|
code: '',
|
||||||
|
prdType: '01',
|
||||||
|
trainTypes: []
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
title() {
|
||||||
|
if (this.node && this.node.data) {
|
||||||
|
if (this.node.data.type === 'Skin') {
|
||||||
|
return this.$t('map.createProductCategories');
|
||||||
|
} else if (this.node.data.type === 'Prd' ||
|
||||||
|
this.node.data.type === 'Prd') {
|
||||||
|
return this.$t('map.editTraining');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return this.$t('map.selectOperation');
|
||||||
|
},
|
||||||
|
isCreate() {
|
||||||
|
return this.node && this.node.data.type === 'Skin';
|
||||||
|
},
|
||||||
|
isUpdate() {
|
||||||
|
return this.node && this.node.data.type === 'Prd';
|
||||||
|
},
|
||||||
|
isDelete() {
|
||||||
|
return this.node && this.node.data.type === 'Prd';
|
||||||
|
},
|
||||||
|
isShowTrainTypes() {
|
||||||
|
return this.addModel.prdType != '03' && this.addModel.prdType != '04';
|
||||||
|
},
|
||||||
|
baseRules() {
|
||||||
|
return {
|
||||||
|
code: [
|
||||||
|
{ required: true, message: this.$t('rules.productCodeEnter'), trigger: 'change' }
|
||||||
|
],
|
||||||
|
name: [
|
||||||
|
{ required: true, message: this.$t('rules.productNameEnter'), trigger: 'change' }
|
||||||
|
],
|
||||||
|
remarks: [
|
||||||
|
{ required: true, message: this.$t('rules.productDescriptionEnter'), trigger: 'change' }
|
||||||
|
],
|
||||||
|
trainTypes: [
|
||||||
|
{ required: true, message: this.$t('rules.trainingTypeSelect'), trigger: 'change' }
|
||||||
|
]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.$Dictionary.trainingType().then(list => {
|
||||||
|
this.trainTypesList = list;
|
||||||
|
});
|
||||||
|
this.$Dictionary.productPostType().then(list => {
|
||||||
|
this.chooseList = list;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
loadData(node) {
|
||||||
|
if (node) {
|
||||||
|
// 清除数据
|
||||||
|
this.node = node;
|
||||||
|
this.initTrainTypes = [];
|
||||||
|
this.$refs.form.resetFields();
|
||||||
|
this.loading = true;
|
||||||
|
if (node.data.type === 'Skin') {
|
||||||
|
this.codeDisabled = false;
|
||||||
|
this.addModel.mapName = node.data.name;
|
||||||
|
this.addModel.skinCode = node.data.id;
|
||||||
|
this.loading = false;
|
||||||
|
} else if (node.data.type === 'Prd') {
|
||||||
|
this.codeDisabled = true;
|
||||||
|
getProductDetail(node.data.id).then(response => {
|
||||||
|
this.addModel.mapName = node.parent.data.name;
|
||||||
|
this.addModel.mapId = node.parent.data.id;
|
||||||
|
this.addModel.name = response.data.name;
|
||||||
|
this.addModel.remarks = response.data.remarks;
|
||||||
|
this.addModel.prdType = response.data.prdType;
|
||||||
|
this.addModel.code = response.data.code;
|
||||||
|
this.addModel.skinCode = response.data.skinCode;
|
||||||
|
this.addModel.trainTypes = this.initTrainTypes = response.data.trainTypes;
|
||||||
|
this.addModel.id = response.data.id;
|
||||||
|
this.loading = false;
|
||||||
|
}).catch((error) => {
|
||||||
|
this.loading = false;
|
||||||
|
this.$message.error(error.message);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.addModel.prdType = '01';
|
||||||
|
this.loading = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 清除表单验证提示信息
|
||||||
|
this.$nextTick(function () {
|
||||||
|
this.$refs.form.clearValidate();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
create() {
|
||||||
|
this.$refs.form.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
const data = {
|
||||||
|
skinCode: this.addModel.skinCode,
|
||||||
|
mapName: this.addModel.mapName,
|
||||||
|
name: this.addModel.name,
|
||||||
|
remarks: this.addModel.remarks,
|
||||||
|
prdType: this.addModel.prdType,
|
||||||
|
code: this.addModel.code,
|
||||||
|
trainTypes: this.isShowTrainTypes ? this.addModel.trainTypes : []
|
||||||
|
};
|
||||||
|
checkMapProductCodeExist({ code: this.addModel.code }).then(response => {
|
||||||
|
if (!response.data) {
|
||||||
|
createTrainingCategory(data).then(response => {
|
||||||
|
this.initTrainTypes = this.addModel.trainTypes;
|
||||||
|
this.$emit('refresh');
|
||||||
|
this.$message.success(this.$t('tip.productCreationSuccessfully'));
|
||||||
|
}).catch((error) => {
|
||||||
|
this.$message.error(`${this.$t('tip.productCreationFailed')}, ${error.message}`);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.$message(this.$t('tip.productCodeExists'));
|
||||||
|
}
|
||||||
|
}).catch(() => {
|
||||||
|
this.$message(this.$t('tip.productCodeExists'));
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
update() {
|
||||||
|
this.$refs.form.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
this.addModel.trainTypes = this.isShowTrainTypes ? this.addModel.trainTypes : [];
|
||||||
|
updateTrainingCategory(this.addModel).then(response => {
|
||||||
|
this.initTrainTypes = this.addModel.trainTypes;
|
||||||
|
this.$message.success(this.$t('tip.updateProductSuccessfully'));
|
||||||
|
this.$emit('refresh');
|
||||||
|
}).catch((error) => {
|
||||||
|
this.$message.error(`${this.$t('tip.updateProductFailed')}, ${error.message}`);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
trainTypesChange(tag) {
|
||||||
|
if (this.initTrainTypes && this.initTrainTypes.length > 0) {
|
||||||
|
this.initTrainTypes.forEach(elem => {
|
||||||
|
if (this.addModel.trainTypes.indexOf(elem) < 0) {
|
||||||
|
this.addModel.trainTypes = this.initTrainTypes;
|
||||||
|
this.$messageBox(this.$t('tip.narrowScope'));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
deleteObj() {
|
||||||
|
this.$refs.form.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
deleteTrainingCategory(this.addModel).then(response => {
|
||||||
|
this.$message.success(this.$t('tip.deleteProductSuccessfully'));
|
||||||
|
this.$refs.form.resetFields();
|
||||||
|
this.node = null;
|
||||||
|
this.$emit('refresh');
|
||||||
|
}).catch(error => {
|
||||||
|
if (error.code === 500009) {
|
||||||
|
this.$message.error(this.$t('tip.cannotDeleteProduct'));
|
||||||
|
} else {
|
||||||
|
this.$message.error(this.$t('tip.deleteProductFailed'));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@import "src/styles/mixin.scss";
|
||||||
|
|
||||||
|
.card-box {
|
||||||
|
padding-top: 20px;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps {
|
||||||
|
width: 980px;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
/deep/ {
|
||||||
|
.el-step__icon.is-icon {
|
||||||
|
width: 95px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.forms {
|
||||||
|
width: 800px;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 20px;
|
||||||
|
|
||||||
|
/deep/ {
|
||||||
|
.el-select {
|
||||||
|
float: left;
|
||||||
|
width: calc(600px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-textarea {
|
||||||
|
float: left;
|
||||||
|
width: calc(600px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-form-item__content>.el-input {
|
||||||
|
float: left;
|
||||||
|
width: calc(600px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-input-number {
|
||||||
|
float: left;
|
||||||
|
width: calc(250px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.draft {
|
||||||
|
width: 300px;
|
||||||
|
text-align: center;
|
||||||
|
margin: 20px auto;
|
||||||
|
}
|
||||||
|
</style>
|
58
src/views/system/product/index.vue
Normal file
58
src/views/system/product/index.vue
Normal file
@ -0,0 +1,58 @@
|
|||||||
|
<template>
|
||||||
|
<div class="contnt_box">
|
||||||
|
<div class="training-tree">
|
||||||
|
<training-tree-operate ref="trainingTree" @loadData="loadData" />
|
||||||
|
</div>
|
||||||
|
<div class="training-draft">
|
||||||
|
<edit-detail-operate ref="training" @refresh="refresh" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import TrainingTreeOperate from './tree';
|
||||||
|
import EditDetailOperate from './edit';
|
||||||
|
|
||||||
|
// 产品编辑
|
||||||
|
export default {
|
||||||
|
name: 'TrainingEditOperate',
|
||||||
|
components: {
|
||||||
|
EditDetailOperate,
|
||||||
|
TrainingTreeOperate
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
loadData(node) {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.training.loadData(node);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
refresh() {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.trainingTree.refresh();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
@import "src/styles/mixin.scss";
|
||||||
|
|
||||||
|
.contnt_box{
|
||||||
|
height: 100%;
|
||||||
|
.training-tree {
|
||||||
|
float: left;
|
||||||
|
width: 420px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.training-draft {
|
||||||
|
float: left;
|
||||||
|
width: calc(100% - 420px);
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
130
src/views/system/product/tree.vue
Normal file
130
src/views/system/product/tree.vue
Normal file
@ -0,0 +1,130 @@
|
|||||||
|
<template>
|
||||||
|
<div v-loading="loading" class="joylink-card map-list-main">
|
||||||
|
<div class="clearfix">
|
||||||
|
<span>{{ $t('map.productCategories') }}</span>
|
||||||
|
</div>
|
||||||
|
<el-input v-model="filterText" :placeholder="$t('tip.enterKeywordsFiltering')" clearable />
|
||||||
|
<div style="height: calc(100% - 87px);">
|
||||||
|
<el-tree
|
||||||
|
ref="trainingTree"
|
||||||
|
:data="treeData"
|
||||||
|
:filter-node-method="filterNode"
|
||||||
|
:lazy="false"
|
||||||
|
:props="defaultProps"
|
||||||
|
class="tree-height-max"
|
||||||
|
expand-on-click-node
|
||||||
|
highlight-current
|
||||||
|
@node-click="clickEvent"
|
||||||
|
>
|
||||||
|
<span slot-scope="{ node }">
|
||||||
|
<span v-if="node.data.type == 'skin'" class="el-icon-news" />
|
||||||
|
<span v-if="node.data.type == 'prd'" class="el-icon-tickets" />
|
||||||
|
<span v-if="node.data.type == 'trainingType'" class="el-icon-document" />
|
||||||
|
<span v-if="node.data.type == 'trainingType'" class="el-icon-edit" />
|
||||||
|
<span> {{ node.label }}</span>
|
||||||
|
</span>
|
||||||
|
</el-tree>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { getProductTree } from '@/api/management/mapprd';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'TreeOperate',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: true,
|
||||||
|
defaultProps: {
|
||||||
|
children: 'children',
|
||||||
|
label: 'name'
|
||||||
|
},
|
||||||
|
filterText: '',
|
||||||
|
treeData: [],
|
||||||
|
node: {},
|
||||||
|
point: {
|
||||||
|
x: 0,
|
||||||
|
y: 0
|
||||||
|
}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
filterText(val) {
|
||||||
|
this.$refs.trainingTree.filter(val);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.refresh();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
filterNode(value, data) {
|
||||||
|
if (!value) return true;
|
||||||
|
return data.name.indexOf(value) !== -1;
|
||||||
|
},
|
||||||
|
showContextMenu(e, obj, node, vueElem) {
|
||||||
|
e.preventDefault();
|
||||||
|
this.point = {
|
||||||
|
x: e.clientX,
|
||||||
|
y: e.clientY
|
||||||
|
};
|
||||||
|
if (obj) {
|
||||||
|
this.node = node;
|
||||||
|
this.$refs.menu.show();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
clickEvent(obj, node, data) {
|
||||||
|
this.$store.dispatch('menuOperation/setPopMenu', { position: null, menu: null });
|
||||||
|
this.$emit('loadData', node);
|
||||||
|
},
|
||||||
|
convertTreeData(list) {
|
||||||
|
const tree = [];
|
||||||
|
if (list && list.length) {
|
||||||
|
/* 去除列表的training节点*/
|
||||||
|
list.forEach(elem => {
|
||||||
|
elem.children = this.convertTreeData(elem.children);
|
||||||
|
if (elem.type !== 'TrainingType') {
|
||||||
|
tree.push(elem);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return tree;
|
||||||
|
},
|
||||||
|
refresh() {
|
||||||
|
getProductTree().then(response => {
|
||||||
|
this.treeData = this.convertTreeData(response.data);
|
||||||
|
this.$nextTick(() => { this.loading = false; });
|
||||||
|
}).catch(() => {
|
||||||
|
this.$messageBox(this.$t('tip.refreshFailure'));
|
||||||
|
this.loading = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||||
|
.map-list-main{
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.clearfix{
|
||||||
|
padding: 0 20px;
|
||||||
|
border-bottom: 1px solid #EBEEF5;
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 47px;
|
||||||
|
line-height: 47px;
|
||||||
|
}
|
||||||
|
.tree-height-max{
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.el-tree {
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-tree-node.is-current>.el-tree-node__content {
|
||||||
|
background-color: #e4e3e3 !important;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue
Block a user