代码完善

This commit is contained in:
BianLzhaoMin 2025-03-06 16:57:53 +08:00
parent dfe81e5031
commit 8313c16f57
9 changed files with 2861 additions and 2725 deletions

View File

@ -0,0 +1,6 @@
import request from '@/utils/request'
// 工程检修在用预警 -- 列表接口
export const getUseMaintenanceWarningApi = data => {
return request.get('/material/useMaintenanceWarning/list', { params: data })
}

View File

@ -216,7 +216,7 @@ export default {
console.log('row.configValues', row.configValue)
if (row.configValue) {
return row.flowStatus != 2 && row.configValue.includes(this.userId)
return (row.flowStatus == 1 || row.flowStatus == 0) && row.configValue.includes(this.userId)
}
}
}

View File

@ -161,13 +161,12 @@ export default {
//
async onHandleAuditing(type) {
//
const currentAuditing = this.auditingList.filter(e => e.nodeId === this.currentNodeId) //
const currentIndex = this.auditingList.findIndex(e => e.nodeId === this.currentNodeId) //
const currentAuditing = this.auditingList.filter(e => e.configValues.includes(this.userId)) //
const currentIndex = this.auditingList.findIndex(e => e.configValues.includes(this.userId)) //
const { recordId, id, typeId, isAccept } = currentAuditing[0]
// if (isAccept !== 0) {
// if (isAccept != 0) {
// this.$modal.msgError('')
// return
// }
@ -182,6 +181,7 @@ export default {
}
const res = await submitAuditingApi(this.auditingParams)
console.log(res, '提交结果')
if (res.code === 200) {
this.$modal.msgSuccess('审核成功')
@ -190,6 +190,37 @@ export default {
this.$tab.closeOpenPage(obj)
}, 500)
}
// //
// const currentAuditing = this.auditingList.filter(e => e.nodeId === this.currentNodeId) //
// const currentIndex = this.auditingList.findIndex(e => e.nodeId === this.currentNodeId) //
// const { recordId, id, typeId, isAccept } = currentAuditing[0]
// // if (isAccept !== 0) {
// // this.$modal.msgError('')
// // return
// // }
// Object.assign(this.auditingParams, {
// typeId,
// recordId,
// nodeId: id
// })
// this.auditingParams.isAccept = type
// if (currentIndex !== this.auditingList.length - 1) {
// this.auditingParams.nextNodeId = this.auditingList[currentIndex + 1].id
// }
// const res = await submitAuditingApi(this.auditingParams)
// if (res.code === 200) {
// this.$modal.msgSuccess('')
// setTimeout(() => {
// const obj = { path: '/business-examine/receive-apply' }
// this.$tab.closeOpenPage(obj)
// }, 500)
// }
},
//

View File

@ -190,7 +190,7 @@ export default {
//
auditingShow(row) {
if (row.configValue) {
return row.status != 1 && row.configValue.includes(this.userId)
return (row.taskStatus == 1 || row.taskStatus == 0) && row.configValue.includes(this.userId)
}
}
}

View File

@ -1,111 +1,135 @@
<template>
<div class="business-details-container">
<el-row>
<el-col :span="18">
<div class="left-container">
<div class="pages-title">减免申请详情</div>
<TitleTip :title="`基本信息`" />
<div class="business-details-container">
<el-row>
<el-col :span="18">
<div class="left-container">
<div class="pages-title">减免申请详情</div>
<TitleTip :title="`基本信息`" />
<el-form size="small" style="padding: 20px" disabled label-width="120px" :model="detailsInfo">
<el-row>
<el-col :span="12">
<el-form-item label="减免开始日期">
<el-input v-model="detailsInfo.reduceStartTime" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="减免结束日期">
<el-input v-model="detailsInfo.reduceEndTime" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="减免原因">
<el-input type="textarea" v-model="detailsInfo.remark" :autosize="{ minRows: 2, maxRows: 4 }" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<TitleTip :title="`明细信息`" />
<el-form size="small" style="padding: 20px" disabled label-width="120px" :model="detailsInfo">
<el-row>
<el-col :span="12">
<el-form-item label="减免开始日期">
<el-input v-model="detailsInfo.reduceStartTime" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="减免结束日期">
<el-input v-model="detailsInfo.reduceEndTime" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="减免原因">
<el-input
type="textarea"
v-model="detailsInfo.remark"
:autosize="{ minRows: 2, maxRows: 4 }"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<TitleTip :title="`明细信息`" />
<el-table style="margin: 20px 0" :data="detailsList">
<el-table-column prop="num" label="减免数量" align="center" show-overflow-tooltip />
<el-table-column prop="maName" label="机具名称" align="center" show-overflow-tooltip />
<el-table-column prop="maModel" label="规格型号" align="center" show-overflow-tooltip />
<el-table-column prop="reduceNum" label="领料数量" align="center" show-overflow-tooltip />
<el-table-column prop="startTime" label="领料日期" align="center" show-overflow-tooltip />
<el-table-column prop="endTime" label="退料日期" align="center" show-overflow-tooltip />
<el-table-column prop="reduceStartTime" label="减免开始时间" align="center" show-overflow-tooltip />
<el-table-column prop="reduceEndTime" label="减免结束时间" align="center" show-overflow-tooltip />
<el-table-column prop="leasePrice" label="租赁单价(元/天)" align="center" show-overflow-tooltip />
<el-table-column prop="reduceDays" label="减免天数" align="center" show-overflow-tooltip />
<el-table-column prop="reduceLeaseMoney" label="减免费用(元)" align="center" show-overflow-tooltip />
</el-table>
<div class="total-amount">
<span>合计:</span>
<span>{{ totalAmount.toFixed(2) }} / </span>
</div>
<TitleTip :title="`附件信息`" />
<el-table style="margin: 20px 0" :data="detailsList">
<el-table-column prop="num" label="减免数量" align="center" show-overflow-tooltip />
<el-table-column prop="maName" label="机具名称" align="center" show-overflow-tooltip />
<el-table-column prop="maModel" label="规格型号" align="center" show-overflow-tooltip />
<el-table-column prop="reduceNum" label="领料数量" align="center" show-overflow-tooltip />
<el-table-column prop="startTime" label="领料日期" align="center" show-overflow-tooltip />
<el-table-column prop="endTime" label="退料日期" align="center" show-overflow-tooltip />
<el-table-column
prop="reduceStartTime"
label="减免开始时间"
align="center"
show-overflow-tooltip
/>
<el-table-column
prop="reduceEndTime"
label="减免结束时间"
align="center"
show-overflow-tooltip
/>
<el-table-column
prop="leasePrice"
label="租赁单价(元/天)"
align="center"
show-overflow-tooltip
/>
<el-table-column prop="reduceDays" label="减免天数" align="center" show-overflow-tooltip />
<el-table-column
prop="reduceLeaseMoney"
label="减免费用(元)"
align="center"
show-overflow-tooltip
/>
</el-table>
<div class="total-amount">
<span>合计:</span>
<span>{{ totalAmount.toFixed(2) }} / </span>
</div>
<TitleTip :title="`附件信息`" />
<div class="file-box">
<div v-for="img in fileList" :key="img.id">
<el-image style="width: 100%; height: 100%" :src="img.url" fit="cover"></el-image>
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="right-container">
<div class="right-title">
<div></div>
<div></div>
<div>流程记录</div>
</div>
<div class="file-box">
<div v-for="img in fileList" :key="img.id">
<el-image style="width: 100%; height: 100%" :src="img.url" fit="cover"></el-image>
</div>
</div>
</div>
</el-col>
<el-col :span="6">
<div class="right-container">
<div class="right-title">
<div></div>
<div></div>
<div>流程记录</div>
</div>
<div class="process-record">
<el-steps :active="active" :space="120" direction="vertical">
<el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
<template slot="description">
<div class="custom-description">
<!-- {{ step.description }} -->
审核结果:
<el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
<el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
<el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
</div>
<div class="process-record">
<el-steps :active="active" :space="120" direction="vertical">
<el-step v-for="step in auditingList" :key="step.id" :title="step.nodeName">
<template slot="description">
<div class="custom-description">
<!-- {{ step.description }} -->
审核结果:
<el-tag size="mini" type="primary" v-if="step.isAccept === 0">待审批</el-tag>
<el-tag size="mini" type="success" v-if="step.isAccept === 1">已通过</el-tag>
<el-tag size="mini" type="danger" v-if="step.isAccept === 2">已驳回</el-tag>
</div>
<div class="node-info" v-if="step.createTime">
审核时间:
{{ step.createTime }}
</div>
<div class="node-info" v-if="step.createTime">
审核时间:
{{ step.createTime }}
</div>
<div class="node-info" v-if="step.remark">
审核意见:
{{ step.remark }}
</div>
</template>
</el-step>
</el-steps>
</div>
<div class="node-info" v-if="step.remark">
审核意见:
{{ step.remark }}
</div>
</template>
</el-step>
</el-steps>
</div>
<div class="auditing-container" v-if="pagesType === 1">
<el-input
type="textarea"
v-model="auditingParams.remark"
placeholder="请输入审核意见"
:autosize="{ minRows: 2, maxRows: 6 }"
/>
<div class="auditing-container" v-if="pagesType === 1">
<el-input
type="textarea"
v-model="auditingParams.remark"
placeholder="请输入审核意见"
:autosize="{ minRows: 2, maxRows: 6 }"
/>
<el-row class="btn-container">
<el-button type="success" size="mini" @click="onHandleAuditing(1)">通过</el-button>
<el-button type="danger" size="mini" @click="onHandleAuditing(2)">驳回</el-button>
</el-row>
</div>
</div>
</el-col>
</el-row>
</div>
<el-row class="btn-container">
<el-button type="success" size="mini" @click="onHandleAuditing(1)">通过</el-button>
<el-button type="danger" size="mini" @click="onHandleAuditing(2)">驳回</el-button>
</el-row>
</div>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
@ -113,221 +137,218 @@ import TitleTip from './components/title-tip.vue'
import { submitAuditingApi, getAuditingDetailsApi } from '@/api/reduction-apply/index.js'
import { getDiscountViewList } from '@/api/cost/cost'
export default {
components: {
TitleTip
},
data() {
return {
detailsInfo: {},
content: `<span style="color:red">测试996</span>`,
steps: [
{ title: '步骤 1', description: '描述信息 1', color: 'red' },
{ title: '步骤 2', description: '描述信息 2', color: 'blue' },
{ title: '步骤 3', description: '描述信息 3', color: 'green' }
],
active: 1,
detailsList: [],
auditingList: [],
fileList: [],
totalAmount: 0,
auditingParams: {
nodeId: '', // id
nextNodeId: '', // ID
isAccept: '', // 1. 2.
remark: '', //
typeId: '', // typeId
taskId: '' // taskId
},
pagesType: 1,
userId: ''
}
},
created() {
//
if (this.$route.query) {
const { id, taskId, type } = this.$route.query
this.pagesType = type
this.auditingParams.taskId = taskId
this.getLeaseTaskDetailFun(id, taskId)
}
this.userId = sessionStorage.getItem('userId')
},
methods: {
//
async onHandleAuditing(type) {
//
const currentAuditing = this.auditingList.filter(e => e.configValues.includes(this.userId)) //
const currentIndex = this.auditingList.findIndex(e => e.configValues.includes(this.userId)) //
const { recordId, id, typeId, isAccept } = currentAuditing[0]
if (isAccept != 0) {
this.$modal.msgError('当前已审核,不可重复审核')
return
}
Object.assign(this.auditingParams, {
typeId,
recordId,
nodeId: id
})
this.auditingParams.isAccept = type
if (currentIndex !== this.auditingList.length - 1) {
this.auditingParams.nextNodeId = this.auditingList[currentIndex + 1].id
}
const res = await submitAuditingApi(this.auditingParams)
console.log(res, '提交结果')
if (res.code === 200) {
this.$modal.msgSuccess('审核成功')
setTimeout(() => {
const obj = { path: '/business-examine/reduction-apply' }
this.$tab.closeOpenPage(obj)
}, 500)
}
console.log(this.auditingParams, ' this.auditingParams组装好的参数')
components: {
TitleTip
},
//
async getLeaseTaskDetailFun(id, taskId) {
const { data: res } = await getDiscountViewList(id)
data() {
return {
detailsInfo: {},
active: 1,
detailsList: [],
auditingList: [],
fileList: [],
totalAmount: 0,
auditingParams: {
nodeId: '', // id
remark: '', //
typeId: '', // typeId
taskId: '', // taskId
isAccept: '', // 1. 2.
recordId: '',
nextNodeId: '' // ID
},
pagesType: 1,
userId: '',
currentNodeId: ''
}
},
created() {
//
if (this.$route.query) {
const { id, taskId, type, nodeId } = this.$route.query
this.auditingParams.taskId = taskId
this.pagesType = type
this.currentNodeId = nodeId
this.getLeaseTaskDetailFun(id, taskId)
}
this.detailsInfo = res
this.detailsList = res.detailList
this.fileList = res.bmFileInfos
this.userId = sessionStorage.getItem('userId')
},
methods: {
//
async onHandleAuditing(type) {
//
const currentAuditing = this.auditingList.filter(e => e.configValues.includes(this.userId)) //
const currentIndex = this.auditingList.findIndex(e => e.configValues.includes(this.userId)) //
this.detailsList.forEach(e => {
this.totalAmount += e.reduceLeaseMoney * 1
})
const { recordId, id, typeId, isAccept } = currentAuditing[0]
const { rows: result } = await getAuditingDetailsApi({ taskId })
this.auditingList = result
console.log('result审核记录详情', result)
// if (isAccept != 0) {
// this.$modal.msgError('')
// return
// }
Object.assign(this.auditingParams, {
typeId,
recordId,
nodeId: id
})
this.auditingParams.isAccept = type
if (currentIndex !== this.auditingList.length - 1) {
this.auditingParams.nextNodeId = this.auditingList[currentIndex + 1].id
}
const res = await submitAuditingApi(this.auditingParams)
console.log(res, '提交结果')
if (res.code === 200) {
this.$modal.msgSuccess('审核成功')
setTimeout(() => {
const obj = { path: '/business-examine/reduction-apply' }
this.$tab.closeOpenPage(obj)
}, 500)
}
console.log(this.auditingParams, ' this.auditingParams组装好的参数')
},
//
async getLeaseTaskDetailFun(id, taskId) {
const { data: res } = await getDiscountViewList(id)
this.detailsInfo = res
this.detailsList = res.detailList
this.fileList = res.bmFileInfos
this.detailsList.forEach(e => {
this.totalAmount += e.reduceLeaseMoney * 1
})
const { rows: result } = await getAuditingDetailsApi({ taskId })
this.auditingList = result
console.log('result审核记录详情', result)
}
}
}
}
</script>
<style scoped lang="scss">
.business-details-container {
padding: 20px;
padding: 20px;
}
.pages-title {
padding: 10px 0 30px 0;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
color: #19a4a0;
padding: 10px 0 30px 0;
font-size: 20px;
font-weight: bold;
letter-spacing: 2px;
text-align: center;
color: #19a4a0;
}
.file-box {
padding: 10px;
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
div {
width: calc((100% - 110px) / 12);
height: 60px;
margin-right: 10px;
margin-top: 10px;
text-align: center;
line-height: 60px;
background-color: #19a4a0;
}
padding: 10px;
display: flex;
flex-wrap: wrap;
box-sizing: border-box;
div {
width: calc((100% - 110px) / 12);
height: 60px;
margin-right: 10px;
margin-top: 10px;
text-align: center;
line-height: 60px;
background-color: #19a4a0;
}
& div:nth-child(12n) {
margin-right: 0;
}
& div:nth-child(12n) {
margin-right: 0;
}
}
.right-container {
padding: 0 20px;
padding: 0 20px;
}
.right-title {
display: flex;
align-items: center;
font-size: 14px;
& div:first-child {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #19a4a0;
z-index: 9;
}
& div:nth-child(2) {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #b2e1e0;
transform: translateX(-50%);
}
display: flex;
align-items: center;
font-size: 14px;
& div:first-child {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #19a4a0;
z-index: 9;
}
& div:nth-child(2) {
width: 16px;
height: 16px;
border-radius: 50%;
background-color: #b2e1e0;
transform: translateX(-50%);
}
}
.process-record {
margin-top: 20px;
// height: 60vh;
margin-top: 20px;
// height: 60vh;
}
.btn-container {
margin-top: 10px;
display: flex;
justify-content: space-around;
margin-top: 10px;
display: flex;
justify-content: space-around;
}
::v-deep .el-step__icon.is-text {
background-color: #19a4a0;
color: #19a4a0;
border: none;
width: 16px;
height: 16px;
background-color: #19a4a0;
color: #19a4a0;
border: none;
width: 16px;
height: 16px;
}
::v-deep .el-step.is-vertical .el-step__line {
width: 2px;
top: 26px;
bottom: 8px;
left: 7px;
width: 2px;
top: 26px;
bottom: 8px;
left: 7px;
}
::v-deep .el-step__title.is-finish {
font-weight: bold;
color: #303133;
font-size: 16px;
font-weight: bold;
color: #303133;
font-size: 16px;
}
::v-deep .el-step__title.is-wait {
font-weight: bold;
color: #303133;
font-size: 16px;
font-weight: bold;
color: #303133;
font-size: 16px;
}
.total-amount {
margin-bottom: 10px;
display: flex;
justify-content: flex-end;
font-size: 14px;
align-items: center;
margin-bottom: 10px;
display: flex;
justify-content: flex-end;
font-size: 14px;
align-items: center;
& span:last-child {
margin: 0 6px;
color: red;
font-weight: bold;
}
& span:last-child {
margin: 0 6px;
color: red;
font-weight: bold;
}
}
.custom-description {
padding: 8px 0 8px 20px;
color: #666;
padding: 8px 0 8px 20px;
color: #666;
}
.node-info {
// padding: 2px 0;
padding-left: 20px;
color: #666;
letter-spacing: 1px;
// padding: 2px 0;
padding-left: 20px;
color: #666;
letter-spacing: 1px;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -4,25 +4,27 @@
<el-form v-show="showSearch" :model="queryParams" ref="queryForm" size="small" inline>
<el-form-item label="时间范围" prop="timeRange">
<el-date-picker
v-model="queryParams.timeRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
clearable
value-format="yyyy-MM-dd"
type="daterange"
format="yyyy-MM-dd"
style="width: 240px"
range-separator="至"
value-format="yyyy-MM-dd"
end-placeholder="结束日期"
start-placeholder="开始日期"
v-model="queryParams.timeRange"
/>
</el-form-item>
<el-form-item label="关键字" prop="keyWord">
<el-input
v-model="queryParams.keyWord"
placeholder="请输入关键字"
clearable
style="width: 240px"
placeholder="请输入关键字"
v-model="queryParams.keyWord"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="状态" prop="taskStatus">
<!-- <el-form-item label="状态" prop="taskStatus">
<el-select v-model="queryParams.taskStatus" placeholder="请选择状态" clearable>
<el-option
v-for="item in statusOptions"
@ -31,7 +33,7 @@
:value="item.value"
/>
</el-select>
</el-form-item>
</el-form-item> -->
<!-- 表单按钮 -->
<el-form-item>
@ -42,7 +44,9 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">通知</el-button>
<el-button type="primary" plain icon="el-icon-chat-dot-round" size="mini" @click="onHandleNotice">
通知
</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">
@ -86,6 +90,7 @@
<script>
import printJS from 'print-js'
import { getLeaseTaskList, deleteLeaseTask, getLeaseTask, getCodePDF } from '@/api/business/index'
import { getUseMaintenanceWarningApi } from '@/api/warning-analysis/engineering-in-use.js'
export default {
data() {
@ -95,21 +100,20 @@ export default {
pageNum: 1,
pageSize: 10,
keyWord: '', //
taskStatus: '', //
timeRange: [] //
},
total: 0, //
//
tableColumns: [
{ label: '下次检修时间', prop: 'createTime' },
{ label: '机具类型', prop: 'createBy' },
{ label: '规格型号', prop: 'leaseUnit' },
{ label: '设备编码', prop: 'leaseProject' },
{ label: '单位名称', prop: 'maTypeNames' },
{ label: '下次检修时间', prop: 'nextCheckTime' },
{ label: '机具类型', prop: 'typeName' },
{ label: '规格型号', prop: 'typeModelName' },
{ label: '设备编码', prop: 'maCode' },
{ label: '单位名称', prop: 'unitName' },
{ label: '工程名称', prop: 'agreementCode' },
{ label: '协议号', prop: 'code' },
{ label: '超期时长', prop: 'leasePerson' }
{ label: '协议号', prop: 'agreementCode' },
{ label: '超期时长', prop: 'overDays' }
],
//
tableList: [],
@ -153,10 +157,10 @@ export default {
startTime: this.queryParams.timeRange[0] || '',
endTime: this.queryParams.timeRange[1] || ''
}
const res = await getLeaseTaskList(params)
const res = await getUseMaintenanceWarningApi(params)
console.log('🚀 ~ 获取列表 ~ res:', res)
this.tableList = res.data.rows
this.total = res.data.total || 0
this.tableList = res.rows
this.total = res.total
} catch (error) {
console.log('🚀 ~ 获取列表 ~ error:', error)
this.tableList = []
@ -202,11 +206,10 @@ export default {
//
handleExport() {
try {
let fileName = `数据_${new Date().getTime()}.xLsx`
let url = ''
let fileName = `工程在用检修预警数据_${new Date().getTime()}.xLsx`
let url = '/material/useMaintenanceWarning/export'
const params = { ...this.queryParams }
console.log('🚀 ~ 导出 ~ params:', params)
// this.derive(url, params, fileName)
this.download(url, params, fileName)
} catch (error) {
console.log('导出数据失败', error)
}
@ -257,6 +260,10 @@ export default {
return time.replace(/-/g, '年').replace(/-/g, '月') + '日'
}
return ''
},
//
onHandleNotice() {
console.log('通知--')
}
}
}

View File

@ -2,7 +2,7 @@
const path = require('path')
function resolve(dir) {
return path.join(__dirname, dir)
return path.join(__dirname, dir)
}
const CompressionPlugin = require('compression-webpack-plugin')
@ -15,131 +15,131 @@ const port = process.env.port || process.env.npm_config_port || 80 // 端口
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
// 这里只列一部分,具体配置参考文档
module.exports = {
// 部署生产环境和开发环境下的URL。
// 默认情况下Vue CLI 会假设你的应用是被部署在一个域名的根路径上
// 例如 https://www.bonus.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.bonus.vip/admin/,则设置 baseUrl 为 /admin/。
publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
// 在npm run build 或 yarn build 时 生成文件的目录名称要和baseUrl的生产环境路径一致默认dist
outputDir: 'dist',
// 用于放置生成的静态资源 (js、css、img、fonts) 的;(项目打包之后,静态资源会放在这个文件夹下)
assetsDir: 'static',
// 是否开启eslint保存检测有效值ture | false | 'error'
lintOnSave: process.env.NODE_ENV === 'development',
// 如果你不需要生产环境的 source map可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
// webpack-dev-server 相关配置
devServer: {
host: '0.0.0.0',
port: port,
open: true,
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
// target: `http://36.33.26.201:19988/prod-api`,
// target: `http://192.168.0.15:18080`,//马
// target: `http://192.168.0.244:18580`,//测试
// target: `http://192.168.2.223:18080`,//山
// target: `http://192.168.2.23:18080`,//洪
// target: `http://192.168.0.234:18080`, //阮
// target: `http://192.168.137.1:18080`,//
// target: `http://192.168.0.15:18080`,// 韩傲宇
target: `http://192.168.0.60:18080`, // 赵福海
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
},
'/api': {
target: 'http://192.168.0.21:17861',
//设置允许跨域——此处我经过测试发现可有可无
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
// 部署生产环境和开发环境下的URL。
// 默认情况下Vue CLI 会假设你的应用是被部署在一个域名的根路径上
// 例如 https://www.bonus.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.bonus.vip/admin/,则设置 baseUrl 为 /admin/。
publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
// 在npm run build 或 yarn build 时 生成文件的目录名称要和baseUrl的生产环境路径一致默认dist
outputDir: 'dist',
// 用于放置生成的静态资源 (js、css、img、fonts) 的;(项目打包之后,静态资源会放在这个文件夹下)
assetsDir: 'static',
// 是否开启eslint保存检测有效值ture | false | 'error'
lintOnSave: process.env.NODE_ENV === 'development',
// 如果你不需要生产环境的 source map可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
// webpack-dev-server 相关配置
devServer: {
host: '0.0.0.0',
port: port,
open: true,
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
// target: `http://36.33.26.201:19988/prod-api`,
// target: `http://192.168.0.15:18080`,//马
// target: `http://192.168.0.244:18580`,//测试
// target: `http://192.168.2.223:18080`,//山
// target: `http://192.168.2.23:18080`,//洪
// target: `http://192.168.0.234:18080`, //阮
// target: `http://192.168.137.1:18080`,//
target: `http://192.168.0.15:18080`, // 韩傲宇
// target: `http://192.168.0.60:18080`, // 赵福海
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
},
'/api': {
target: 'http://192.168.0.21:17861',
//设置允许跨域——此处我经过测试发现可有可无
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
},
disableHostCheck: true
},
disableHostCheck: true
},
css: {
loaderOptions: {
sass: {
sassOptions: { outputStyle: 'expanded' }
}
css: {
loaderOptions: {
sass: {
sassOptions: { outputStyle: 'expanded' }
}
}
},
configureWebpack: {
name: name,
resolve: {
alias: {
'@': resolve('src')
}
},
plugins: [
// http://doc.bonus.vip/bonus-vue/other/faq.html#使用gzip解压缩静态文件
new CompressionPlugin({
cache: false, // 不启用文件缓存
test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式
filename: '[path][base].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 0.8, // 压缩比例,小于 80% 的文件不会被压缩
deleteOriginalAssets: false // 压缩后删除原文件
})
]
},
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/assets/icons')).end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/assets/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
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
test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
},
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')
})
}
},
configureWebpack: {
name: name,
resolve: {
alias: {
'@': resolve('src')
}
},
plugins: [
// http://doc.bonus.vip/bonus-vue/other/faq.html#使用gzip解压缩静态文件
new CompressionPlugin({
cache: false, // 不启用文件缓存
test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式
filename: '[path][base].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 0.8, // 压缩比例,小于 80% 的文件不会被压缩
deleteOriginalAssets: false // 压缩后删除原文件
})
]
},
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/assets/icons')).end()
config.module
.rule('icons')
.test(/\.svg$/)
.include.add(resolve('src/assets/icons'))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.options({
symbolId: 'icon-[name]'
})
.end()
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
test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
priority: 20 // the weight needs to be larger than libs and app or it will be packaged into libs or app
},
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')
})
}
}