问题修复

duhanyu
许宏杰 1 year ago
parent 538b1494fb
commit 42bd4f08f7

@ -5,7 +5,8 @@ VUE_APP_TITLE = 若依管理系统
ENV = 'development'
# 若依管理系统/开发环境
VUE_APP_BASE_API = '/dev-api'
VUE_APP_BASE_API = 'http://localhost:9027'
# VUE_APP_BASE_API = 'https://vue.ruoyi.vip/prod-api'
# 路由懒加载
VUE_CLI_BABEL_TRANSPILE_MODULES = true

@ -49,6 +49,7 @@
"js-cookie": "3.0.1",
"jsencrypt": "3.0.0-rc.1",
"nprogress": "0.2.0",
"postcss-px2rem": "^0.3.0",
"quill": "1.3.7",
"screenfull": "5.0.2",
"sortablejs": "1.10.2",

@ -0,0 +1,44 @@
import request from '@/utils/request'
// 查询数据来源统计tc_sjlytj 列表
export function listDataSourceTj(query) {
return request({
url: '/tcZz/networkSecurity/DataSourceTj/list',
method: 'get',
params: query
})
}
// 查询数据来源统计tc_sjlytj 详细
export function getDataSourceTj(id) {
return request({
url: '/tcZz/networkSecurity/DataSourceTj/' + id,
method: 'get'
})
}
// 新增数据来源统计tc_sjlytj
export function addDataSourceTj(data) {
return request({
url: '/tcZz/networkSecurity/DataSourceTj',
method: 'post',
data: data
})
}
// 修改数据来源统计tc_sjlytj
export function updateDataSourceTj(data) {
return request({
url: '/tcZz/networkSecurity/DataSourceTj',
method: 'put',
data: data
})
}
// 删除数据来源统计tc_sjlytj
export function delDataSourceTj(id) {
return request({
url: '/tcZz/networkSecurity/DataSourceTj/' + id,
method: 'delete'
})
}

@ -0,0 +1,183 @@
@import "./element-variables.scss";
.container-main {
height: calc(100vh - 84px);
overflow: hidden;
padding: 0 10px;
//
.search-hearder {
padding: 12px 2px 8px 2px;
height: auto;
.el-form-item {
margin-bottom: 6px;
margin-right: 10px;
// lable
.el-form-item__label {
padding: 6px 12px 6px 10px;
font-weight: 400;
color: #333;
line-height: 20px;
}
// content
.el-form-item__content {
width: 180px;
//
.el-input {
.el-input__inner {
border-radius: 0px;
}
}
}
}
}
//
.layui-table-tool {
width: 100%;
min-height: 40px;
line-height: 30px;
padding: 6px 15px;
border-width: 0 0 1px;
border: 1px solid #e6e6e6;
border-bottom: 0;
background-color: #f2f2f2;
}
//
.el-table .el-table__header-wrapper th {
font-size: 12px;
font-weight: 400;
// height: 35px;
color: #666;
background-color: #f2f2f2;
}
.el-table--medium .el-table__cell {
padding: 3px 0;
// height: 35px;
font-size: 12px;
color: #666;
}
.el-table .fixed-width .el-button--mini {
font-size: 12px;
padding: 6px 6px;
width: inherit;
}
//
}
//
.dialog-box {
.el-dialog__header {
padding: 0;
.dialog-title {
height: 50px;
line-height: 50px;
font-size: 14px;
color: white;
background-color: $--color-primary;
padding-left: 20px;
letter-spacing: 1px;
}
.el-dialog__headerbtn .el-dialog__close {
color: white;
}
}
.el-select,.el-date-editor{
width: 100%;
}
}
.dialog-from {
.el-form-item {
margin-bottom: 20px;
margin-right: 10px;
// lable
.el-form-item__label {
padding: 6px 12px 6px 10px;
font-weight: 400;
color: #333;
line-height: 20px;
}
// content
.el-form-item__content {
//
.el-input {
.el-input__inner {
border-radius: 0px;
}
}
}
}
}
//
.el-message-box {
width: 300px;
.el-message-box__header {
border-bottom: 1px solid #f0f0f0;
}
}
//
.Descriptions-box {
border: 1px solid #ddd;
border-right: 0;
border-bottom: 0;
.row-item {
width: 100%;
display: flex;
& > div {
padding: 10px 8px;
overflow: hidden;
font-size: 12px;
color: #333;
}
.row-lable {
width: 200px;
background-color: #f5f5f5;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
font-weight: bold;
}
.row-value {
flex: 1;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
}
}
}
//
.el-button--mini {
padding: 7px 16px;
border-radius: 0;
}
.el-button {
border-radius: 0;
}
.dialog-footer {
display: flex;
justify-content: center;
}
.pagination-container {
// position: relative;
margin-bottom: 0px !important;
margin-top: 7px !important;
padding: 0 !important;
}
//
.desLable {
width: 180px !important;
}
.image-title {
margin: 10px 0;
font-size: 13px;
font-weight: bold;
color: #333;
}
.image-view {
border: 1px solid #e6ebf5;
}
.dialog-box {
.pagination-container {
height: 10px;
}
}

@ -1,16 +1,18 @@
@import './variables.scss';
@import './mixin.scss';
@import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';
@import './btn.scss';
@import "./variables.scss";
@import "./mixin.scss";
@import "./transition.scss";
@import "./element-ui.scss";
@import "./sidebar.scss";
@import "./btn.scss";
@import "./diythem.scss";
body {
height: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
Microsoft YaHei, Arial, sans-serif;
}
label {
@ -104,7 +106,8 @@ aside {
display: block;
line-height: 32px;
font-size: 16px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
color: #2c3e50;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@ -130,11 +133,11 @@ aside {
}
.pagination-container {
margin-top: 30px;
// margin-top: 30px;
}
.text-center {
text-align: center
text-align: center;
}
.sub-navbar {
@ -145,7 +148,13 @@ aside {
text-align: right;
padding-right: 20px;
transition: 600ms ease position;
background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
background: linear-gradient(
90deg,
rgba(32, 182, 249, 1) 0%,
rgba(32, 182, 249, 1) 0%,
rgba(33, 120, 241, 1) 100%,
rgba(33, 120, 241, 1) 100%
);
.subtitle {
font-size: 20px;

@ -53,7 +53,18 @@
margin-left: 20px;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: inherit;
font-weight: 500;
line-height: 1.1;
@ -76,7 +87,8 @@
}
.el-table {
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #f8f8f9;
@ -98,23 +110,23 @@
color: #6379bb;
border-bottom: 1px solid #ddd;
margin: 8px 10px 25px 10px;
padding-bottom:5px
padding-bottom: 5px;
}
/** 表格布局 **/
.pagination-container {
position: relative;
height: 25px;
margin-bottom: 10px;
margin-top: 15px;
padding: 10px 20px !important;
// height: 25px;
// margin-bottom: 10px;
// margin-top: 15px;
// padding: 10px 20px !important;
}
/* tree border */
.tree-border {
margin-top: 5px;
border: 1px solid #e5e6e7;
background: #FFFFFF none;
background: #ffffff none;
border-radius: 4px;
}
@ -139,12 +151,14 @@
}
/** 表格更多操作下拉样式 */
.el-table .el-dropdown-link,.el-table .el-dropdown-selfdefine {
.el-table .el-dropdown-link,
.el-table .el-dropdown-selfdefine {
cursor: pointer;
margin-left: 5px;
}
.el-table .el-dropdown, .el-icon-arrow-down {
.el-table .el-dropdown,
.el-icon-arrow-down {
font-size: 12px;
}
@ -195,22 +209,22 @@
/* button color */
.el-button--cyan.is-active,
.el-button--cyan:active {
background: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
background: #20b2aa;
border-color: #20b2aa;
color: #ffffff;
}
.el-button--cyan:focus,
.el-button--cyan:hover {
background: #48D1CC;
border-color: #48D1CC;
color: #FFFFFF;
background: #48d1cc;
border-color: #48d1cc;
color: #ffffff;
}
.el-button--cyan {
background-color: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
background-color: #20b2aa;
border-color: #20b2aa;
color: #ffffff;
}
/* text color */
@ -266,7 +280,7 @@
/* 拖拽列样式 */
.sortable-ghost {
opacity: .8;
opacity: 0.8;
color: #fff !important;
background: #42b983 !important;
}

@ -1,67 +1,88 @@
import Vue from 'vue'
import Vue from "vue";
import Cookies from 'js-cookie'
import Cookies from "js-cookie";
import Element from 'element-ui'
import './assets/styles/element-variables.scss'
import Element from "element-ui";
import "./assets/styles/element-variables.scss";
import '@/assets/styles/index.scss' // global css
import '@/assets/styles/ruoyi.scss' // ruoyi css
import App from './App'
import store from './store'
import router from './router'
import directive from './directive' // directive
import plugins from './plugins' // plugins
import { download } from '@/utils/request'
import "@/assets/styles/index.scss"; // global css
import "@/assets/styles/ruoyi.scss"; // ruoyi css
import './assets/icons' // icon
import './permission' // permission control
Element.Dialog.props.closeOnClickModal.default = false; //模态框单击空白处不允许关闭
// 带有斑马纹
// Element.Table.props.stripe = {
// default: true,
// type: Boolean,
// };
// 带有边框
Element.Table.props.border = {
default: true,
type: Boolean,
};
import "@/utils/rem.js"; //计算rem基准
import App from "./App";
import store from "./store";
import router from "./router";
import directive from "./directive"; // directive
import plugins from "./plugins"; // plugins
import { download } from "@/utils/request";
import "./assets/icons"; // icon
import "./permission"; // permission control
import { getDicts } from "@/api/system/dict/data";
import { getConfigKey } from "@/api/system/config";
import { parseTime, resetForm, addDateRange, selectDictLabel, selectDictLabels, handleTree } from "@/utils/ruoyi";
import {
parseTime,
resetForm,
addDateRange,
selectDictLabel,
selectDictLabels,
handleTree,
} from "@/utils/ruoyi";
// 分页组件
import Pagination from "@/components/Pagination";
// 自定义表格工具组件
import RightToolbar from "@/components/RightToolbar"
import RightToolbar from "@/components/RightToolbar";
// 富文本组件
import Editor from "@/components/Editor"
import Editor from "@/components/Editor";
// 文件上传组件
import FileUpload from "@/components/FileUpload"
import FileUpload from "@/components/FileUpload";
// 图片上传组件
import ImageUpload from "@/components/ImageUpload"
import ImageUpload from "@/components/ImageUpload";
// 图片预览组件
import ImagePreview from "@/components/ImagePreview"
import ImagePreview from "@/components/ImagePreview";
// 字典标签组件
import DictTag from '@/components/DictTag'
import DictTag from "@/components/DictTag";
// 头部标签组件
import VueMeta from 'vue-meta'
import VueMeta from "vue-meta";
// 字典数据组件
import DictData from '@/components/DictData'
import DictData from "@/components/DictData";
// 全局方法挂载
Vue.prototype.getDicts = getDicts
Vue.prototype.getConfigKey = getConfigKey
Vue.prototype.parseTime = parseTime
Vue.prototype.resetForm = resetForm
Vue.prototype.addDateRange = addDateRange
Vue.prototype.selectDictLabel = selectDictLabel
Vue.prototype.selectDictLabels = selectDictLabels
Vue.prototype.download = download
Vue.prototype.handleTree = handleTree
Vue.prototype.getDicts = getDicts;
Vue.prototype.getConfigKey = getConfigKey;
Vue.prototype.parseTime = parseTime;
Vue.prototype.resetForm = resetForm;
Vue.prototype.addDateRange = addDateRange;
Vue.prototype.selectDictLabel = selectDictLabel;
Vue.prototype.selectDictLabels = selectDictLabels;
Vue.prototype.download = download;
Vue.prototype.handleTree = handleTree;
// 全局组件挂载
Vue.component('DictTag', DictTag)
Vue.component('Pagination', Pagination)
Vue.component('RightToolbar', RightToolbar)
Vue.component('Editor', Editor)
Vue.component('FileUpload', FileUpload)
Vue.component('ImageUpload', ImageUpload)
Vue.component('ImagePreview', ImagePreview)
Vue.component("DictTag", DictTag);
Vue.component("Pagination", Pagination);
Vue.component("RightToolbar", RightToolbar);
Vue.component("Editor", Editor);
Vue.component("FileUpload", FileUpload);
Vue.component("ImageUpload", ImageUpload);
Vue.component("ImagePreview", ImagePreview);
Vue.use(directive)
Vue.use(plugins)
Vue.use(VueMeta)
DictData.install()
Vue.use(directive);
Vue.use(plugins);
Vue.use(VueMeta);
DictData.install();
/**
* If you don't want to use mock-server
@ -73,14 +94,14 @@ DictData.install()
*/
Vue.use(Element, {
size: Cookies.get('size') || 'medium' // set element-ui default size
})
size: Cookies.get("size") || "medium", // set element-ui default size
});
Vue.config.productionTip = false
Vue.config.productionTip = false;
new Vue({
el: '#app',
el: "#app",
router,
store,
render: h => h(App)
})
render: (h) => h(App),
});

@ -0,0 +1,17 @@
// rem等比适配配置文件
// 基准大小
const baseSize = 16;
// 设置 rem 函数
function setRem() {
// 当前页面宽度相对于 1920宽的缩放比例可根据自己需要修改。
const scale = document.documentElement.clientWidth / 1920;
// 设置页面根节点字体大小“Math.min(scale, 2)” 指最高放大比例为2可根据实际业务需求调整
document.documentElement.style.fontSize =
baseSize * Math.min(scale, 2) + "px";
}
// 初始化
setRem();
// 改变浏览器窗口大小时重新设置 rem
window.onresize = function () {
setRem();
};

@ -0,0 +1,411 @@
<template>
<div class="container-main" ref="main">
<div class="search-hearder" ref="topSearch">
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="auto"
>
<el-form-item label="云端监测(G)" prop="lable1">
<el-input
v-model="queryParams.lable1"
placeholder="请输入云端监测(G)"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="云端监测(G)总量" prop="lable1Sum">
<el-input
v-model="queryParams.lable1Sum"
placeholder="请输入云端监测(G)总量"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
</div>
<div class="layui-table-tool" ref="tableTool">
<el-button
type="primary"
size="mini"
@click="handleAdd()"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:add']"
>新增</el-button
>
<el-button
type="success"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:edit']"
>修改</el-button
>
<el-button
type="danger"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:remove']"
>删除</el-button
>
<el-button
type="warning"
size="mini"
:loading="exportLoading"
@click="handleExport"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:export']"
>导出</el-button
>
</div>
<el-table
v-loading="loading"
:data="DataSourceTjList"
:height="tableHeigth"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="${comment}" align="center" prop="id" />
<el-table-column label="云端监测(G)" align="center" prop="lable1" />
<el-table-column
label="云端监测(G)总量"
align="center"
prop="lable1Sum"
/>
<el-table-column label="APT(M)" align="center" prop="lable2" />
<el-table-column label="APT(M) 总量" align="center" prop="lable2Sum" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
width="200"
fixed="right"
>
<template slot-scope="scope">
<el-button
size="mini"
@click="handleInfo(scope.row)"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:list']"
>
查看
</el-button>
<el-button
type="success"
size="mini"
@click="handleUpdate(scope.row)"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:edit']"
>修改</el-button
>
<el-button
size="mini"
type="danger"
@click="handleDelete(scope.row)"
v-hasPermi="['tcZz/networkSecurity:DataSourceTj:remove']"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改数据来源统计tc_sjlytj 对话框 -->
<el-dialog
:visible.sync="open"
width="500px"
append-to-body
custom-class="dialog-box"
>
<div slot="title" class="dialog-title">{{ title }}</div>
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="auto"
class="dialog-from"
>
<el-form-item label="云端监测(G)" prop="lable1">
<el-input v-model="form.lable1" placeholder="请输入云端监测(G)" />
</el-form-item>
<el-form-item label="云端监测(G)总量" prop="lable1Sum">
<el-input
v-model="form.lable1Sum"
placeholder="请输入云端监测(G)总量"
/>
</el-form-item>
<el-form-item label="APT(M)" prop="lable2">
<el-input v-model="form.lable2" placeholder="请输入APT(M)" />
</el-form-item>
<el-form-item label="APT(M) 总量" prop="lable2Sum">
<el-input v-model="form.lable2Sum" placeholder="请输入APT(M) 总量" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
<!--查看数据来源统计tc_sjlytj 详情页-->
<el-dialog
:visible.sync="infoOpen"
width="90%"
append-to-body
:close-on-click-modal="false"
:destroy-on-close="true"
custom-class="dialog-box"
>
<div slot="title" class="dialog-title">{{ infoTitle }}</div>
<el-descriptions
title="数据来源统计tc_sjlytj "
:column="2"
border
labelClassName="desLable"
>
<el-descriptions-item label="云端监测(G)">{{
form.lable1
}}</el-descriptions-item>
<el-descriptions-item label="云端监测(G)总量">{{
form.lable1Sum
}}</el-descriptions-item>
<el-descriptions-item label="APT(M)">{{
form.lable2
}}</el-descriptions-item>
<el-descriptions-item label="APT(M) 总量">{{
form.lable2Sum
}}</el-descriptions-item>
</el-descriptions>
</el-dialog>
</div>
</template>
<script>
import {
listDataSourceTj,
getDataSourceTj,
delDataSourceTj,
addDataSourceTj,
updateDataSourceTj,
exportDataSourceTj,
} from "@/api/tcZz/networkSecurity/DataSourceTj";
export default {
name: "DataSourceTj",
//
data() {
return {
tableHeigth: 0,
//
infoOpen: false,
//
infoTitle: "",
//
loading: true,
//
exportLoading: false,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
//
total: 0,
// tc_sjlytj
DataSourceTjList: [],
//
title: "",
//
open: false,
//
queryParams: {
pageNum: 1,
pageSize: 20,
lable1: null,
lable1Sum: null,
},
//
form: {},
//
rules: {},
};
},
created() {
// //
this.$nextTick(() => {
this.tableHeigth =
this.$refs.main.offsetHeight -
(this.$refs.topSearch.offsetHeight +
this.$refs.tableTool.offsetHeight) -
46;
this.getList();
});
},
methods: {
/** 查询数据来源统计tc_sjlytj 列表 */
getList() {
this.loading = true;
listDataSourceTj(this.queryParams).then((response) => {
this.DataSourceTjList = response.rows;
this.total = response.total;
this.loading = false;
});
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {
id: null,
lable1: null,
lable1Sum: null,
lable2: null,
lable2Sum: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/**查看按钮操作 */
handleInfo(row) {
this.reset();
const id = row.id || this.ids;
getDataSourceTj(id).then((response) => {
this.form = response.data;
this.infoOpen = true;
this.infoTitle = "查看数据来源统计tc_sjlytj 详情";
});
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加数据来源统计tc_sjlytj ";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getDataSourceTj(id).then((response) => {
this.form = response.data;
this.open = true;
this.title = "修改数据来源统计tc_sjlytj ";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateDataSourceTj(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addDataSourceTj(this.form).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$confirm('是否确认删除编号为"' + ids + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(function () {
return delDataSourceTj(ids);
})
.then(() => {
this.getList();
this.msgSuccess("删除成功");
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm("是否确认导出所有数据来源统计tc_sjlytj 数据项?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.download(
"/tcZz/networkSecurity/DataSourceTj/export",
{
...this.queryParams,
},
"数据来源统计tc_sjlytj _" + new Date().getTime() + ".xlsx"
);
this.exportLoading = false;
})
.catch(() => {});
},
},
};
</script>

@ -1,15 +1,21 @@
'use strict'
const path = require('path')
"use strict";
const path = require("path");
function resolve(dir) {
return path.join(__dirname, dir)
return path.join(__dirname, dir);
}
const CompressionPlugin = require('compression-webpack-plugin')
const px2rem = require("postcss-px2rem"); //将项目中的px转成rem,以达到屏幕适配
// 配置基本大小
const postcss = px2rem({
// 基准大小 baseSize需要和rem.js中相同
remUnit: 16,
});
const CompressionPlugin = require("compression-webpack-plugin");
const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题
const name = process.env.VUE_APP_TITLE || "若依管理系统"; // 网页标题
const port = process.env.port || process.env.npm_config_port || 80 // 端口
const port = process.env.port || process.env.npm_config_port || 80; // 端口
// vue.config.js 配置说明
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
@ -20,16 +26,16 @@ module.exports = {
// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.ruoyi.vip/admin/,则设置 baseUrl 为 /admin/。
publicPath: process.env.NODE_ENV === "production" ? "/" : "/",
// 在npm run build 或 yarn build 时 生成文件的目录名称要和baseUrl的生产环境路径一致默认dist
outputDir: 'dist',
outputDir: "dist",
// 用于放置生成的静态资源 (js、css、img、fonts) 的;(项目打包之后,静态资源会放在这个文件夹下)
assetsDir: 'static',
assetsDir: "static",
// 是否开启eslint保存检测有效值ture | false | 'error'
lintOnSave: process.env.NODE_ENV === 'development',
lintOnSave: process.env.NODE_ENV === "development",
// 如果你不需要生产环境的 source map可以将其设置为 false 以加速生产环境构建。
productionSourceMap: false,
// webpack-dev-server 相关配置
devServer: {
host: '0.0.0.0',
host: "0.0.0.0",
port: port,
open: true,
proxy: {
@ -38,97 +44,100 @@ module.exports = {
target: `http://localhost:8080`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
}
}
["^" + process.env.VUE_APP_BASE_API]: "",
},
},
},
disableHostCheck: true
disableHostCheck: true,
},
css: {
loaderOptions: {
sass: {
sassOptions: { outputStyle: "expanded" }
}
}
sassOptions: { outputStyle: "expanded" },
},
// px to rem
postcss: {
plugins: [postcss],
},
},
},
configureWebpack: {
name: name,
resolve: {
alias: {
'@': resolve('src')
}
"@": resolve("src"),
},
},
plugins: [
// http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
new CompressionPlugin({
cache: false, // 不启用文件缓存
test: /\.(js|css|html)?$/i, // 压缩文件格式
filename: '[path].gz[query]', // 压缩后的文件名
algorithm: 'gzip', // 使用gzip压缩
minRatio: 0.8 // 压缩率小于1才会压缩
})
filename: "[path].gz[query]", // 压缩后的文件名
algorithm: "gzip", // 使用gzip压缩
minRatio: 0.8, // 压缩率小于1才会压缩
}),
],
},
chainWebpack(config) {
config.plugins.delete('preload') // TODO: need test
config.plugins.delete('prefetch') // TODO: need test
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('svg')
.exclude.add(resolve('src/assets/icons'))
.end()
config.module
.rule('icons')
.rule("icons")
.test(/\.svg$/)
.include.add(resolve('src/assets/icons'))
.include.add(resolve("src/assets/icons"))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.use("svg-sprite-loader")
.loader("svg-sprite-loader")
.options({
symbolId: 'icon-[name]'
symbolId: "icon-[name]",
})
.end()
.end();
config.when(process.env.NODE_ENV !== 'development', config => {
config.when(process.env.NODE_ENV !== "development", (config) => {
config
.plugin('ScriptExtHtmlWebpackPlugin')
.after('html')
.use('script-ext-html-webpack-plugin', [{
.plugin("ScriptExtHtmlWebpackPlugin")
.after("html")
.use("script-ext-html-webpack-plugin", [
{
// `runtime` must same as runtimeChunk name. default is `runtime`
inline: /runtime\..*\.js$/
}])
.end()
inline: /runtime\..*\.js$/,
},
])
.end();
config.optimization.splitChunks({
chunks: 'all',
chunks: "all",
cacheGroups: {
libs: {
name: 'chunk-libs',
name: "chunk-libs",
test: /[\\/]node_modules[\\/]/,
priority: 10,
chunks: 'initial' // only package third parties that are initially dependent
chunks: "initial", // only package third parties that are initially dependent
},
elementUI: {
name: 'chunk-elementUI', // split elementUI into a single package
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
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
name: "chunk-commons",
test: resolve("src/components"), // can customize your rules
minChunks: 3, // minimum common number
priority: 5,
reuseExistingChunk: true
}
}
})
reuseExistingChunk: true,
},
},
});
config.optimization.runtimeChunk('single'),
config.optimization.runtimeChunk("single"),
{
from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
to: './' //到根目录下
}
})
}
}
from: path.resolve(__dirname, "./public/robots.txt"), //防爬虫文件
to: "./", //到根目录下
};
});
},
};

Loading…
Cancel
Save