desc: 修改代码
This commit is contained in:
zyy
parent
92b06df4b4
commit
1c373822ee
@ -30,34 +30,34 @@ import login from './login';
|
||||
import designPlatform from './designPlatform';
|
||||
|
||||
export default {
|
||||
...cnLocale,
|
||||
map,
|
||||
global,
|
||||
router,
|
||||
lesson,
|
||||
error,
|
||||
teach,
|
||||
rules,
|
||||
scriptRecord,
|
||||
tip,
|
||||
system,
|
||||
orderAuthor,
|
||||
publish,
|
||||
permission,
|
||||
replay,
|
||||
planMonitor,
|
||||
screenMonitor,
|
||||
demonstration,
|
||||
exam,
|
||||
dashboard,
|
||||
jlmap3d,
|
||||
display,
|
||||
joinTraining,
|
||||
trainRoom,
|
||||
menu,
|
||||
ibp,
|
||||
approval,
|
||||
systemGenerate,
|
||||
login,
|
||||
designPlatform
|
||||
...cnLocale,
|
||||
map,
|
||||
global,
|
||||
router,
|
||||
lesson,
|
||||
error,
|
||||
teach,
|
||||
rules,
|
||||
scriptRecord,
|
||||
tip,
|
||||
system,
|
||||
orderAuthor,
|
||||
publish,
|
||||
permission,
|
||||
replay,
|
||||
planMonitor,
|
||||
screenMonitor,
|
||||
demonstration,
|
||||
exam,
|
||||
dashboard,
|
||||
jlmap3d,
|
||||
display,
|
||||
joinTraining,
|
||||
trainRoom,
|
||||
menu,
|
||||
ibp,
|
||||
approval,
|
||||
systemGenerate,
|
||||
login,
|
||||
designPlatform
|
||||
};
|
||||
|
||||
@ -92,7 +92,6 @@ export default {
|
||||
}
|
||||
},
|
||||
created() {
|
||||
debugger;
|
||||
this.PlanConvert = this.$theme.loadPlanConvert(this.$route.query.skinCode);
|
||||
},
|
||||
mounted() {
|
||||
@ -209,8 +208,8 @@ export default {
|
||||
});
|
||||
},
|
||||
handelRevert(row) {
|
||||
this.$confirm(this.$t('tip.cancelRunPlanTips'), this.$t('tip.hint'), {
|
||||
confirmButtonText: this.$t('tip.confirm'),
|
||||
this.$confirm(this.$t('tip.cancelRunPlanTips'), this.$t('tip.hint'), {
|
||||
confirmButtonText: this.$t('tip.confirm'),
|
||||
cancelButtonText: this.$t('tip.cancel'),
|
||||
type:'warning'
|
||||
}).then(() => {
|
||||
|
||||
@ -1,252 +0,0 @@
|
||||
<template>
|
||||
<el-card>
|
||||
<div slot="header" style="text-align: center;">
|
||||
<span class=" title">{{ $t('global.line') + courseModel.name }}</span>
|
||||
</div>
|
||||
<div style="margin:50px; overflow-x: auto;" :style="{ height: height - 150 +'px' }">
|
||||
<p class="list-item">
|
||||
<span class="list-label">{{ $t('global.updateTime') }}</span>
|
||||
<span class="list-elem">{{ courseModel.updateTime }}</span>
|
||||
</p>
|
||||
<p v-if="!courseModel.pmsList.length" class="list-item">
|
||||
<span class="list-label">{{ $t('screenMonitor.productTrialDuration') }}</span>
|
||||
<span class="list-elem">{{ showTryTime }}</span>
|
||||
</p>
|
||||
<p class="list-item">
|
||||
<span class="list-label">{{ $t('global.permissionList') }}</span>
|
||||
</p>
|
||||
<limit-list ref="limitList" :course-model="courseModel" @initLoadPage="getScreenLists" />
|
||||
<p style="display: flex; justify-content: center;">
|
||||
<span class="list-label" />
|
||||
<el-button type="success" @click="buy">{{ $t('global.buy') }}</el-button>
|
||||
<el-button v-if="hasPermssion" type="primary" @click="distribute">{{ $t('global.distributePermission') }}</el-button>
|
||||
<el-button v-if="hasPermssion" type="primary" @click="transfer">{{ $t('global.transferQRCode') }}</el-button>
|
||||
<el-button type="primary" @click="start">{{ $t('screenMonitor.aTSScreenSimulation') }}</el-button>
|
||||
</p>
|
||||
</div>
|
||||
<set-time ref="setTime" @ConfirmSelectBeginTime="jump" />
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getPublishMapInfo } from '@/api/jmap/map';
|
||||
import { queryPermissionScreen } from '@/api/management/author';
|
||||
import { getGoodsTryUse } from '@/api/management/goods';
|
||||
import { PermissionType } from '@/scripts/ConstDic';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import LimitList from '@/views/components/limits/index';
|
||||
import SetTime from '@/views/display/demon/setTime';
|
||||
import { bitScreenNotify } from '@/api/simulation';
|
||||
|
||||
export default {
|
||||
name: 'ExamDetailList',
|
||||
components: {
|
||||
LimitList,
|
||||
SetTime
|
||||
},
|
||||
filters: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
courseModel: {
|
||||
mapId: '',
|
||||
name: '',
|
||||
skinCode: '',
|
||||
updateTime: '',
|
||||
pmsList: []
|
||||
},
|
||||
goodsId: '',
|
||||
tryTime: 0,
|
||||
showTryTime: '0',
|
||||
tryUser: 0,
|
||||
EffectiveTypeList: [],
|
||||
screenList: []
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
hasPermssion() {
|
||||
let isShow = false;
|
||||
this.courseModel.pmsList.forEach(item => {
|
||||
if (item.canDistribute) {
|
||||
isShow = true;
|
||||
}
|
||||
});
|
||||
return isShow;
|
||||
},
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route(newVal) {
|
||||
this.initLoadPage();
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.$Dictionary.effectiveType().then(list => {
|
||||
this.EffectiveTypeList = list;
|
||||
});
|
||||
await this.getScreenLists();
|
||||
this.initLoadPage();
|
||||
},
|
||||
methods: {
|
||||
async getScreenLists() {
|
||||
const res = await queryPermissionScreen();
|
||||
this.screenList = res.data;
|
||||
this.courseModel = {
|
||||
pmsList: this.screenList || []
|
||||
};
|
||||
},
|
||||
async initLoadPage() {
|
||||
const data = { id: this.$route.params.lessonId };
|
||||
if (parseInt(data.id)) {
|
||||
try {
|
||||
const res = await getPublishMapInfo(data.id);
|
||||
this.tryUser = 0;
|
||||
this.courseModel = {
|
||||
name: res.data.name,
|
||||
mapId: res.data.id,
|
||||
skinCode: res.data.skinCode,
|
||||
updateTime: res.data.updateTime,
|
||||
pmsList: this.screenList || [],
|
||||
permissionType: PermissionType.SCREEN
|
||||
};
|
||||
this.$store.dispatch('training/setPrdType', res.data.prdType);
|
||||
const paras = {
|
||||
permissionType: PermissionType.SCREEN
|
||||
};
|
||||
if (!this.courseModel.pmsList.length) {
|
||||
this.tryUser = 1;
|
||||
try {
|
||||
const resp = await getGoodsTryUse(paras);
|
||||
if (resp.data.tryTime <= 0) {
|
||||
this.tryTime = 0;
|
||||
this.setTryTime(0);
|
||||
} else {
|
||||
this.tryTime = resp.data.tryTime;
|
||||
this.setTryTime(resp.data.tryTime);
|
||||
this.goodsId = resp.data.goodsId;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
this.$messageBox(this.$t('error.acquisitionTimeFailed'));
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
this.$messageBox(this.$t('error.refreshFailed'));
|
||||
}
|
||||
}
|
||||
},
|
||||
buy() {
|
||||
this.$router.push({
|
||||
path: `${UrlConfig.dp.pay}/${this.$route.params.lessonId}`,
|
||||
query: { permissionType: PermissionType.SCREEN }
|
||||
});
|
||||
},
|
||||
transfer() {
|
||||
if (this.$refs) {
|
||||
this.$refs.limitList.transfer(this.courseModel);
|
||||
}
|
||||
},
|
||||
distribute() {
|
||||
if (this.$refs) {
|
||||
this.$refs.limitList.distribute(this.courseModel);
|
||||
}
|
||||
},
|
||||
selectBeginTime() {
|
||||
this.$refs.setTime.doShow();
|
||||
},
|
||||
jump(model) {
|
||||
const data = { mapId: this.courseModel.mapId };
|
||||
bitScreenNotify(data).then(resp => {
|
||||
const query = {
|
||||
skinCode: this.courseModel.skinCode,
|
||||
group: resp.data, prdType: '01',
|
||||
mapId: this.courseModel.mapId,
|
||||
try: this.tryUser,
|
||||
goodsId: this.goodsId,
|
||||
initTime: model.initTime
|
||||
};
|
||||
this.$router.push({ path: `${UrlConfig.display}/dp`, query: query });
|
||||
launchFullscreen();
|
||||
}).catch(error => {
|
||||
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
|
||||
});
|
||||
},
|
||||
start() {
|
||||
if (this.courseModel.pmsList.length) {
|
||||
this.selectBeginTime();
|
||||
} else {
|
||||
if (this.tryTime <= 0) {
|
||||
this.$confirm(this.$t('tip.noPermissionHint'), this.$t('global.tips'), {
|
||||
confirmButtonText: this.$t('global.confirm'),
|
||||
cancelButtonText: this.$t('global.cancel'),
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.buy();
|
||||
}).catch(() => { });
|
||||
} else {
|
||||
this.selectBeginTime();
|
||||
}
|
||||
}
|
||||
},
|
||||
setTryTime(val) {
|
||||
if (val <= 1) {
|
||||
this.showTryTime = `0`+ this.$t('global.minute');
|
||||
} else if (val > 1 && val <= 60) {
|
||||
this.showTryTime = '1'+ this.$t('global.minute');
|
||||
} else if (val > 60) {
|
||||
const time = parseInt(val / 60);
|
||||
this.showTryTime = time+ this.$t('global.minutes');
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
height: 3px;
|
||||
}
|
||||
</style>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
.title {
|
||||
font-weight: bold
|
||||
}
|
||||
|
||||
.time-item {
|
||||
font-size: 24px;
|
||||
color: black !important;
|
||||
}
|
||||
|
||||
.time-label {
|
||||
display: -moz-inline-box;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
margin-left: 14px;
|
||||
}
|
||||
|
||||
.time-elem {
|
||||
color: rgb(90, 89, 89) !important;
|
||||
}
|
||||
|
||||
.list-item {
|
||||
font-size: 16px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.list-label {
|
||||
display: -moz-inline-box;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
/* width: 160px; */
|
||||
}
|
||||
|
||||
.list-elem {
|
||||
color: #808080 !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,98 +0,0 @@
|
||||
<template>
|
||||
<el-card :style="{height: height+'px'}">
|
||||
<div class="home-box" :style="{height: height+'px'}">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" style="margin-top:5px;">
|
||||
<h1 class="title">
|
||||
{{ $t('screenMonitor.screenSystem') }}
|
||||
<img :src="logo" alt="" class="logo-img">
|
||||
</h1>
|
||||
<div class="card-box">
|
||||
<el-carousel :interval="4000" type="card" height="370px">
|
||||
<el-carousel-item v-for="(item, index) in listImg" :key="index">
|
||||
<img :src="item.src" alt="" height="100%" width="100%">
|
||||
</el-carousel-item>
|
||||
</el-carousel>
|
||||
</div>
|
||||
<div class="brief-box">{{ $t('screenMonitor.screenSystemDescription') }}</div>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import logo from '@/assets/logo.png';
|
||||
import home1 from '@/assets/home/home1.png';
|
||||
import home2 from '@/assets/home/home2.png';
|
||||
import home3 from '@/assets/home/demon1.jpg';
|
||||
import home4 from '@/assets/home/tring1.png';
|
||||
import home5 from '@/assets/home/tring4.jpg';
|
||||
import home6 from '@/assets/home/demon2.jpg';
|
||||
export default {
|
||||
name: 'Home',
|
||||
data() {
|
||||
return {
|
||||
listImg: [
|
||||
{ src: home1 },
|
||||
{ src: home2 },
|
||||
{ src: home3 },
|
||||
{ src: home4 },
|
||||
{ src: home5 },
|
||||
{ src: home6 }
|
||||
],
|
||||
logo: logo
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
@import "src/styles/mixin.scss";
|
||||
|
||||
/deep/ .el-carousel {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.home-box {
|
||||
padding: 15px 100px;
|
||||
float: left;
|
||||
width: 100%;
|
||||
font-family: 'Microsoft YaHei';
|
||||
|
||||
.title {
|
||||
font-size: 35px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
margin-top: 55px;
|
||||
border-bottom: 2px dashed #333;
|
||||
padding-bottom: 15px;
|
||||
margin-bottom: 70px;
|
||||
position: relative;
|
||||
|
||||
.logo-img {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 55px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-box {
|
||||
width: 100%;
|
||||
padding: 0 50px;
|
||||
}
|
||||
|
||||
.brief-box {
|
||||
font-size: 18px;
|
||||
text-indent: 2em;
|
||||
line-height: 32px;
|
||||
padding: 40px 20px 0;
|
||||
font-family: unset;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,71 +0,0 @@
|
||||
<template>
|
||||
<div class="app-wrapper">
|
||||
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
|
||||
<demon-list ref="demonList" :height="height" />
|
||||
</div>
|
||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
||||
<transition>
|
||||
<router-view />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import demonList from './list/demonList';
|
||||
import drapLeft from '@/views/components/drapLeft/index';
|
||||
import localStore from 'storejs';
|
||||
|
||||
export default {
|
||||
name: 'Exam',
|
||||
components: {
|
||||
demonList,
|
||||
drapLeft
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listShow: true,
|
||||
widthLeft: 450
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'lessonbar'
|
||||
]),
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'lessonbar.opened': function (val) {
|
||||
this.listShow = val;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.widthLeft = Number(localStore.get('LeftWidth'));
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.$refs && this.$refs.demonList && this.$refs.demonList.refresh();
|
||||
},
|
||||
drapWidth(width) {
|
||||
this.widthLeft = Number(width);
|
||||
}
|
||||
}
|
||||
};
|
||||
</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;
|
||||
}
|
||||
</style>
|
||||
@ -1,147 +0,0 @@
|
||||
<template>
|
||||
<el-card v-loading="loading" class="map-list-main">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>{{ $t('global.mapList') }}</span>
|
||||
</div>
|
||||
<filter-city ref="filerCity" filter-empty :query-function="queryFunction" @filterSelectChange="refresh" />
|
||||
<el-input v-model="filterText" :placeholder="this.$t('global.filteringKeywords')" clearable />
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: (height-125) +'px' }">
|
||||
<el-tree
|
||||
ref="tree"
|
||||
:data="treeList"
|
||||
node-key="id"
|
||||
highlight-current
|
||||
:default-expanded-keys="defaultShowKeys"
|
||||
:props="defaultProps"
|
||||
:span="22"
|
||||
@node-click="clickEvent"
|
||||
@node-contextmenu="showContextMenu"
|
||||
>
|
||||
<span slot-scope="{ node:nd, data }">
|
||||
<span
|
||||
class="el-icon-tickets"
|
||||
:style="{color: data.valid ? 'green':''}"
|
||||
> {{ nd.label }}</span>
|
||||
<span :style="{color: data.valid ? 'green':''}"> {{ nd.label }}</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</el-card>
|
||||
</template>
|
||||
<script>
|
||||
import FilterCity from '@/views/components/filterCity';
|
||||
import { listPublishMap } from '@/api/jmap/map';
|
||||
import { queryPermissionScreen } from '@/api/management/author';
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import { getSessionStorage, setSessionStorage, removeSessionStorage } from '@/utils/auth';
|
||||
|
||||
export default {
|
||||
name: 'ExamDetailList',
|
||||
components: {
|
||||
FilterCity
|
||||
},
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: true,
|
||||
queryFunction: listPublishMap,
|
||||
defaultShowKeys: [],
|
||||
filterText: '',
|
||||
treeData: [],
|
||||
treeList: [],
|
||||
selected: {},
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'name'
|
||||
},
|
||||
node: {
|
||||
},
|
||||
screenList: []
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
filterText(val) {
|
||||
this.treeList = this.treeData.filter((res) => {
|
||||
return res.name.includes(val);
|
||||
});
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getScreenLists();
|
||||
},
|
||||
beforeDestroy () {
|
||||
removeSessionStorage('screenMonitorList');
|
||||
},
|
||||
methods: {
|
||||
async getScreenLists() {
|
||||
const list = await queryPermissionScreen();
|
||||
this.screenList = list.data || [];
|
||||
},
|
||||
filterNode(value, data) {
|
||||
if (!value) return true;
|
||||
return data.name.indexOf(value) !== -1;
|
||||
},
|
||||
showContextMenu(e, obj, node, vueElem) {
|
||||
if (obj) {
|
||||
this.node = node;
|
||||
this.selected = obj;
|
||||
}
|
||||
},
|
||||
clickEvent(obj) {
|
||||
setSessionStorage('screenMonitorList', obj.id);
|
||||
this.$router.push({ path: `${UrlConfig.dp.detail}/${obj.id}` });
|
||||
},
|
||||
refresh(filterSelect) {
|
||||
this.loading = true;
|
||||
this.treeData = this.treeList = [];
|
||||
listPublishMap().then(res => {
|
||||
(res.data || []).forEach(ele => {
|
||||
if (ele.cityCode == filterSelect) {
|
||||
ele.valid = false;
|
||||
if (this.screenList.length) {
|
||||
ele.valid = true;
|
||||
}
|
||||
this.treeData.push(ele);
|
||||
}
|
||||
});
|
||||
|
||||
this.treeList = this.filterText
|
||||
? this.treeData.filter((res) => {
|
||||
return res.name.includes(this.filterText);
|
||||
})
|
||||
: this.treeData;
|
||||
|
||||
if (this.treeList.length == 0) {
|
||||
this.$router.push({ path: `${UrlConfig.dp.prefix}/home` });
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
const mapId = getSessionStorage('screenMonitorList') || (this.treeList[0] || { id: 0 }).id;
|
||||
this.$router.push({ path: `${UrlConfig.dp.detail}/${mapId}` });
|
||||
this.$refs.tree.setCurrentKey(mapId); // value 绑定的node-key
|
||||
});
|
||||
}
|
||||
|
||||
this.$nextTick(() => { this.loading = false; });
|
||||
}).catch(error => {
|
||||
console.log(error);
|
||||
this.loading = false;
|
||||
this.$messageBox(this.$t('error.refreshFailed'));
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.el-tree {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.el-tree-node.is-current>.el-tree-node__content {
|
||||
background-color: #e4e3e3 !important;
|
||||
}
|
||||
</style>
|
||||
241
vue.config.js
241
vue.config.js
@ -7,7 +7,7 @@ const defaultSettings = require('./src/settings.js');
|
||||
const CopyWebpackPlugin = require('copy-webpack-plugin');
|
||||
|
||||
function resolve(dir) {
|
||||
return path.join(__dirname, dir);
|
||||
return path.join(__dirname, dir);
|
||||
}
|
||||
|
||||
const name = defaultSettings.title; // page title
|
||||
@ -15,134 +15,135 @@ const port = 9527; // dev port
|
||||
|
||||
// All configuration item explanations can be find in https://cli.vuejs.org/config/
|
||||
module.exports = {
|
||||
/**
|
||||
/**
|
||||
* You will need to set publicPath if you plan to deploy your site under a sub path,
|
||||
* for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
|
||||
* then publicPath should be set to "/bar/".
|
||||
* In most cases please use '/' !!!
|
||||
* Detail: https://cli.vuejs.org/config/#publicpath
|
||||
*/
|
||||
publicPath: '/',
|
||||
outputDir: 'dist',
|
||||
assetsDir: 'static',
|
||||
lintOnSave: false,
|
||||
productionSourceMap: false,
|
||||
devServer: {
|
||||
port: port,
|
||||
open: true,
|
||||
overlay: {
|
||||
warnings: false,
|
||||
errors: true
|
||||
}
|
||||
// proxy: {
|
||||
// // change xxx-api/login => mock/login
|
||||
// // detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
// [process.env.VUE_APP_BASE_API]: {
|
||||
// target: `http://localhost:${port}/mock`,
|
||||
// changeOrigin: true,
|
||||
// pathRewrite: {
|
||||
// ['^' + process.env.VUE_APP_BASE_API]: ''
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// after: require('./mock/mock-server.js')
|
||||
},
|
||||
configureWebpack: {
|
||||
// provide the app's title in webpack's name field, so that
|
||||
// it can be accessed in index.html to inject the correct title.
|
||||
name: name,
|
||||
resolve: {
|
||||
extensions: ['.js', '.vue', '.json'],
|
||||
alias: {
|
||||
'@': resolve('src')
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, './static'),
|
||||
to: 'static',
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
},
|
||||
chainWebpack(config) {
|
||||
config.plugins.delete('preload'); // TODO: need test
|
||||
config.plugins.delete('prefetch'); // TODO: need test
|
||||
publicPath: '/',
|
||||
outputDir: 'dist',
|
||||
assetsDir: 'static',
|
||||
lintOnSave: false,
|
||||
productionSourceMap: false,
|
||||
cssSourceMap: true,
|
||||
devServer: {
|
||||
port: port,
|
||||
open: true,
|
||||
overlay: {
|
||||
warnings: false,
|
||||
errors: true
|
||||
}
|
||||
// proxy: {
|
||||
// // change xxx-api/login => mock/login
|
||||
// // detail: https://cli.vuejs.org/config/#devserver-proxy
|
||||
// [process.env.VUE_APP_BASE_API]: {
|
||||
// target: `http://localhost:${port}/mock`,
|
||||
// changeOrigin: true,
|
||||
// pathRewrite: {
|
||||
// ['^' + process.env.VUE_APP_BASE_API]: ''
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// after: require('./mock/mock-server.js')
|
||||
},
|
||||
configureWebpack: {
|
||||
// provide the app's title in webpack's name field, so that
|
||||
// it can be accessed in index.html to inject the correct title.
|
||||
name: name,
|
||||
resolve: {
|
||||
extensions: ['.js', '.vue', '.json'],
|
||||
alias: {
|
||||
'@': resolve('src')
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, './static'),
|
||||
to: 'static',
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
},
|
||||
chainWebpack(config) {
|
||||
config.plugins.delete('preload'); // TODO: need test
|
||||
config.plugins.delete('prefetch'); // TODO: need test
|
||||
|
||||
// set svg-sprite-loader
|
||||
config.module
|
||||
.rule('svg')
|
||||
.exclude.add(resolve('src/icons'))
|
||||
.end();
|
||||
config.module
|
||||
.rule('icons')
|
||||
.test(/\.svg$/)
|
||||
.include.add(resolve('src/icons'))
|
||||
.end()
|
||||
.use('svg-sprite-loader')
|
||||
.loader('svg-sprite-loader')
|
||||
.options({
|
||||
symbolId: 'icon-[name]'
|
||||
})
|
||||
.end();
|
||||
// set svg-sprite-loader
|
||||
config.module
|
||||
.rule('svg')
|
||||
.exclude.add(resolve('src/icons'))
|
||||
.end();
|
||||
config.module
|
||||
.rule('icons')
|
||||
.test(/\.svg$/)
|
||||
.include.add(resolve('src/icons'))
|
||||
.end()
|
||||
.use('svg-sprite-loader')
|
||||
.loader('svg-sprite-loader')
|
||||
.options({
|
||||
symbolId: 'icon-[name]'
|
||||
})
|
||||
.end();
|
||||
|
||||
// set preserveWhitespace
|
||||
config.module
|
||||
.rule('vue')
|
||||
.use('vue-loader')
|
||||
.loader('vue-loader')
|
||||
.tap(options => {
|
||||
options.compilerOptions.preserveWhitespace = true;
|
||||
return options;
|
||||
})
|
||||
.end();
|
||||
// set preserveWhitespace
|
||||
config.module
|
||||
.rule('vue')
|
||||
.use('vue-loader')
|
||||
.loader('vue-loader')
|
||||
.tap(options => {
|
||||
options.compilerOptions.preserveWhitespace = true;
|
||||
return options;
|
||||
})
|
||||
.end();
|
||||
|
||||
config
|
||||
// https://webpack.js.org/configuration/devtool/#development
|
||||
.when(process.env.NODE_ENV === 'development',
|
||||
config => config.devtool('cheap-source-map')
|
||||
);
|
||||
config
|
||||
// https://webpack.js.org/configuration/devtool/#development
|
||||
.when(process.env.NODE_ENV === 'development',
|
||||
config => config.devtool('cheap-source-map')
|
||||
);
|
||||
|
||||
config
|
||||
.when(process.env.NODE_ENV !== 'development',
|
||||
config => {
|
||||
config
|
||||
.plugin('ScriptExtHtmlWebpackPlugin')
|
||||
.after('html')
|
||||
.use('script-ext-html-webpack-plugin', [{
|
||||
// `runtime` must same as runtimeChunk name. default is `runtime`
|
||||
inline: /runtime\..*\.js$/
|
||||
}])
|
||||
.end();
|
||||
config
|
||||
.optimization.splitChunks({
|
||||
chunks: 'all',
|
||||
cacheGroups: {
|
||||
libs: {
|
||||
name: 'chunk-libs',
|
||||
test: /[\\/]node_modules[\\/]/,
|
||||
priority: 10,
|
||||
chunks: 'initial' // only package third parties that are initially dependent
|
||||
},
|
||||
elementUI: {
|
||||
name: 'chunk-elementUI', // split elementUI into a single package
|
||||
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
||||
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
|
||||
},
|
||||
commons: {
|
||||
name: 'chunk-commons',
|
||||
test: resolve('src/components'), // can customize your rules
|
||||
minChunks: 3, // minimum common number
|
||||
priority: 5,
|
||||
reuseExistingChunk: true
|
||||
}
|
||||
}
|
||||
});
|
||||
config.optimization.runtimeChunk('single');
|
||||
}
|
||||
);
|
||||
}
|
||||
config
|
||||
.when(process.env.NODE_ENV !== 'development',
|
||||
config => {
|
||||
config
|
||||
.plugin('ScriptExtHtmlWebpackPlugin')
|
||||
.after('html')
|
||||
.use('script-ext-html-webpack-plugin', [{
|
||||
// `runtime` must same as runtimeChunk name. default is `runtime`
|
||||
inline: /runtime\..*\.js$/
|
||||
}])
|
||||
.end();
|
||||
config
|
||||
.optimization.splitChunks({
|
||||
chunks: 'all',
|
||||
cacheGroups: {
|
||||
libs: {
|
||||
name: 'chunk-libs',
|
||||
test: /[\\/]node_modules[\\/]/,
|
||||
priority: 10,
|
||||
chunks: 'initial' // only package third parties that are initially dependent
|
||||
},
|
||||
elementUI: {
|
||||
name: 'chunk-elementUI', // split elementUI into a single package
|
||||
priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
|
||||
test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
|
||||
},
|
||||
commons: {
|
||||
name: 'chunk-commons',
|
||||
test: resolve('src/components'), // can customize your rules
|
||||
minChunks: 3, // minimum common number
|
||||
priority: 5,
|
||||
reuseExistingChunk: true
|
||||
}
|
||||
}
|
||||
});
|
||||
config.optimization.runtimeChunk('single');
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
Loading…
Reference in New Issue
Block a user