bonus
/
devicesmgt
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化大屏的打包配置

This commit is contained in:
BianLzhaoMin 2024-07-17 10:59:52 +08:00
parent 9ba6c13880
commit ccf8482af8
7 changed files with 140 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
sgzb-screen/config/index.js
View File

@ -36,7 +36,7 @@ var proxyUrl =
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static01',
assetsPublicPath: '/bigScrap',
assetsPublicPath: '/bigScrap/',
productionSourceMap: false,
devtool: '#source-map',
productionGzip: false,

2
sgzb-screen/config/prod.env.js
View File

@ -6,5 +6,5 @@ module.exports = {
NODE_ENV: '"production"',
//post用当前域名
// API_ROOT: '"http://' + testUrl + '/iot"'
// API_ROOT: '/',
// API_ROOT: '/sgzbgl-api/',
}

22
sgzb-screen/src/api/index.js
View File

@ -2,12 +2,18 @@
* axios全局配置
*/
import axios from 'axios';
axios.defaults.timeout = 30000
// axios.defaults.timeout = 30000
// 默认配置
axios.defaults.baseURL = process.env.API_ROOT;
// axios.defaults.baseURL = process.env.API_ROOT;
// axios.defaults.baseURL = '/sgzbgl-api/';
axios.interceptors.request.use(
const axiosService = axios.create({
baseURL: "http://192.168.8.163:21624/sgzbgl-api/",// you can use "process.env.VUE_APP_BASE_API" too
timeout: 30000
})
axiosService.interceptors.request.use(
config => {
let token = localStorage.getItem('token')
if (token) {
@ -22,7 +28,7 @@ axios.interceptors.request.use(
);
// 添加一个请求拦截器
axios.interceptors.response.use(
axiosService.interceptors.response.use(
response => {
if (response.data) {
if (response.data.code === 401) {
@ -45,19 +51,21 @@ axios.interceptors.response.use(
// 通用POST方法
export const POST = (url, params) => {
return axios.post(`${url}`, params).then(response => response);
return axiosService.post(`${url}`, params).then(response => response);
};
// 通用POST_JSON方法
export const POST_JSON = (url, json, params) => {
return axios.post(`${url}`, json, {
return axiosService.post(`${url}`, json, {
params: params
}).then(response => response);
};
// 通用GET方法
export const GET = (url, params) => {
return axios.get(`${url}`, {
return axiosService.get(`${url}`, {
params: params
}).then(response => response);
};

137
sgzb-screen/src/components/home/centerBottom.vue
View File

@ -12,54 +12,61 @@
</template>
<script>
import { getAcceptanceStorageApi } from "../../api/screen";
import { getAcceptanceStorageApi } from '../../api/screen'
import inputStoreAnalysisDialog from './inputStoreAnalysisDialog.vue'
import * as echarts from 'echarts';
import * as echarts from 'echarts'
export default {
name: 'accessRatePage',
components: {
inputStoreAnalysisDialog
inputStoreAnalysisDialog,
},
data() {
return {
dataObj: {},
maType: ''
maType: '',
}
},
mounted() {
this.$eventBus.$on('maType', (maType) => {
this.maType = maType
this.getAcceptanceStorageApiPage()
});
})
setInterval(() => {
this.getAcceptanceStorageApiPage()
}, 60 * 1000);
}, 60 * 1000)
},
destroyed() {
this.$eventBus.$off('maType');
this.$eventBus.$off('maType')
},
methods: {
getAcceptanceStorageApiPage() {
this.dataObj = {}
let params = {
maType: this.maType
maType: this.maType,
}
getAcceptanceStorageApi(params).then(res => {
getAcceptanceStorageApi(params).then((res) => {
if (res.code == 200) {
this.dataObj = res.data
this.getInitDataBar();
this.getInitDataBar()
}
})
},
getInitDataBar() {
const data = [70, 80, 60, 55, 43, 82, 66, 14];
const data2 = [26, 45, 56, 90, 23, 72, 46, 174];
const colorArr2 = ["rgba(11, 83, 128)", "rgba(2, 143, 224)", "rgba(11, 83, 128)"];
const colorArr = ["rgb(12, 109, 122)", "rgba(1, 241, 228)", "rgb(12, 109, 122)"];
const data = [70, 80, 60, 55, 43, 82, 66, 14]
const data2 = [26, 45, 56, 90, 23, 72, 46, 174]
const colorArr2 = [
'rgba(11, 83, 128)',
'rgba(2, 143, 224)',
'rgba(11, 83, 128)',
]
const colorArr = [
'rgb(12, 109, 122)',
'rgba(1, 241, 228)',
'rgb(12, 109, 122)',
]
var color = {
type: "linear",
type: 'linear',
x: 0,
x2: 1,
y: 0,
@ -82,9 +89,9 @@ export default {
color: colorArr[1],
},
],
};
}
var color2 = {
type: "linear",
type: 'linear',
x: 0,
x2: 1,
y: 0,
@ -107,20 +114,20 @@ export default {
color: colorArr2[1],
},
],
};
var barWidth = 30;
}
var barWidth = 30
var option = {
backgroundColor: 'transparent',
tooltip: {
trigger: 'axis',
formatter: function (params) {
var str = params[0].name + ":";
var str = params[0].name + ':'
params.filter(function (item) {
if (item.componentSubType == "bar") {
str += "<br/>" + item.seriesName + "：" + item.value;
if (item.componentSubType == 'bar') {
str += '<br/>' + item.seriesName + '：' + item.value
}
});
return str;
})
return str
},
},
legend: {
@ -129,7 +136,7 @@ export default {
itemHeight: 12,
itemGap: 10,
icon: 'circle',
x: "right",
x: 'right',
y: '4%',
data: ['验收数量', '入库数量'],
textStyle: {
@ -144,7 +151,7 @@ export default {
right: '4%',
bottom: '5%',
top: '15%',
containLabel: true
containLabel: true,
},
xAxis: {
type: 'category',
@ -155,7 +162,7 @@ export default {
lineStyle: {
color: '#c1c1c1',
width: 1, //这里是为了突出显示加上的
}
},
},
axisLabel: {
show: true,
@ -176,13 +183,13 @@ export default {
color: '#17273B',
width: 1,
type: 'dashd',
}
},
},
axisTick: {
show: false
show: false,
},
axisLine: {
show: false
show: false,
},
//坐标值标注
axisLabel: {
@ -190,36 +197,36 @@ export default {
color: '#c1c1c1',
fontSize: 14,
formatter: function (value) {
return value;
}
return value
},
},
},
series: [
{
z: 1,
name: '入库数量',
type: "bar",
type: 'bar',
barWidth: barWidth,
barGap: "0%",
barGap: '0%',
data: this.dataObj.valueList2,
itemStyle: {
normal: {
color: color,
}
},
},
},
//下
{
z: 2,
name: '入库数量',
type: "pictorialBar",
data: this.dataObj.valueList2.map(item => item + 90),
symbol: "diamond",
symbolOffset: ["-75%", "50%"],
type: 'pictorialBar',
data: this.dataObj.valueList2.map((item) => item + 90),
symbol: 'diamond',
symbolOffset: ['-75%', '50%'],
symbolSize: [barWidth, 10],
itemStyle: {
normal: {
color: color
color: color,
},
},
tooltip: {
@ -230,16 +237,16 @@ export default {
{
z: 3,
name: '入库数量',
type: "pictorialBar",
symbolPosition: "end",
type: 'pictorialBar',
symbolPosition: 'end',
data: this.dataObj.valueList2,
symbol: "diamond",
symbolOffset: ["-85%", "-60%"],
symbol: 'diamond',
symbolOffset: ['-85%', '-60%'],
symbolSize: [barWidth - 4, (10 * (barWidth - 4)) / barWidth],
itemStyle: {
normal: {
borderWidth: 1,
color: '#00FEFC'
color: '#00FEFC',
},
},
tooltip: {
@ -249,9 +256,9 @@ export default {
{
z: 1,
name: '验收数量',
type: "bar",
type: 'bar',
barWidth: barWidth,
barGap: "50%",
barGap: '50%',
data: this.dataObj.valueList,
itemStyle: {
normal: {
@ -261,23 +268,23 @@ export default {
show: false,
textStyle: {
color: 'rgb(2, 157, 246)',
fontSize: 8
}
fontSize: 8,
},
},
}
},
},
},
{
z: 2,
name: '验收数量',
type: "pictorialBar",
data: this.dataObj.valueList.map(item => item + 90),
symbol: "diamond",
symbolOffset: ["75%", "50%"],
type: 'pictorialBar',
data: this.dataObj.valueList.map((item) => item + 90),
symbol: 'diamond',
symbolOffset: ['75%', '50%'],
symbolSize: [barWidth, 10],
itemStyle: {
normal: {
color: color2
color: color2,
},
},
tooltip: {
@ -287,16 +294,16 @@ export default {
{
z: 3,
name: '验收数量',
type: "pictorialBar",
symbolPosition: "end",
type: 'pictorialBar',
symbolPosition: 'end',
data: this.dataObj.valueList,
symbol: "diamond",
symbolOffset: ["75%", "-50%"],
symbol: 'diamond',
symbolOffset: ['75%', '-50%'],
symbolSize: [barWidth - 4, (10 * (barWidth - 4)) / barWidth],
itemStyle: {
normal: {
borderWidth: 1,
color: colorArr2[2]
color: colorArr2[2],
},
},
tooltip: {
@ -305,11 +312,13 @@ export default {
},
],
}
let myCharts = echarts.init(document.querySelector('#accessRateEchartsCenterBar'));
let myCharts = echarts.init(
document.querySelector('#accessRateEchartsCenterBar')
)
myCharts.setOption(option)
myCharts.off('click')
myCharts.on('click', (params) => {
console.log('🚀 ~ myCharts.on ~ params:', params);
console.log('🚀 ~ myCharts.on ~ params:', params)
const data = {
open: true,
maType: this.maType,
@ -319,7 +328,7 @@ export default {
// this.$refs.inputStoreAnalysisDialog.setOpen(data)
})
},
}
},
}
</script>

10
sgzb-screen/src/router/index.js
View File

@ -70,16 +70,20 @@ router.beforeEach(async (to, from, next) => {
if (to.path === '/login/index') {
return next();
}
const token = localStorage.getItem('token');
if (to.query.token) {
localStorage.setItem('token', to.query.token)
}
const token = to.query.token || localStorage.getItem('token') || null;
if (!token) {
next('/login/index'); // 跳转到登录页
next('/bigScrap/login/index'); // 跳转到登录页
} else {
next(); // 放行
}
});
// if (to.matched.some(r => r.meta.requireLoginAuth)) {
// next();
// } else {

12
sgzb-screen/src/views/layout.vue
View File

@ -7,22 +7,18 @@
</template>
<script>
import ScaleBox from "@/components/scaleBox.vue";
import ScaleBox from '@/components/scaleBox.vue'
export default {
name: 'layout',
components: { ScaleBox },
data() {
return {
}
return {}
},
mounted() {
// console.log(this.$route)
localStorage.setItem('token', this.$route.query.token)
// localStorage.setItem('token', this.$route.query.token)
},
methods: {
}
methods: {},
}
</script>

68
sgzb-screen/src/views/login/index.vue
View File

@ -107,20 +107,25 @@
</div>
</template>
<script>
import { authLoginApi, getSendIphoneCodeApi, loginCodeApi } from "../../api/userLogin";
import {
authLoginApi,
getSendIphoneCodeApi,
loginCodeApi,
} from '../../api/userLogin'
export default {
name: 'Login',
data() {
const validatePhone = (rule, value, callback) => {
const reg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
const reg =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/
if (!value) {
callback(new Error('请输入手机号'));
callback(new Error('请输入手机号'))
} else if (!reg.test(value)) {
callback(new Error('请输入正确的手机号'));
callback(new Error('请输入正确的手机号'))
} else {
callback();
callback()
}
};
}
return {
isButtonState: false,
isCode: true,
@ -129,13 +134,13 @@ export default {
showPwd: false,
captcha: '',
form: {
userName: "",
passWord: "",
userName: '',
passWord: '',
phone: '',
phoneCode: ''
phoneCode: '',
},
UserLogin: true,
codeUrl: "",
codeUrl: '',
rules: {
userName: [
{ required: true, message: '账号不能为空', trigger: 'blur' },
@ -144,20 +149,25 @@ export default {
{ required: true, message: '密码不能为空', trigger: 'blur' },
],
phone: [
{ validator: validatePhone, message: '请输入正确的手机号', trigger: 'blur' },
{
validator: validatePhone,
message: '请输入正确的手机号',
trigger: 'blur',
},
{ required: true, message: '手机号码不能为空', trigger: 'blur' },
],
phoneCode: [
{ required: true, message: '验证码不能为空', trigger: 'blur' },
],
},
type: 1
type: 1,
}
},
mounted() {
console.log(this.$route)
if(localStorage.getItem('token')!=''){
this.$router.push('./Home/index')
if (localStorage.getItem('token') != '') {
// this.$router.push('./Home/index')
// location.href('/bigScrap/Home/index')
}
},
@ -172,7 +182,7 @@ export default {
username: this.form.userName,
password: this.form.passWord,
}
authLoginApi(params).then(res => {
authLoginApi(params).then((res) => {
if (res.code == 200) {
localStorage.setItem('token', res.data.access_token)
this.$router.push('./Home/index')
@ -183,9 +193,9 @@ export default {
})
} else {
this.isButtonState = false
return false;
return false
}
});
})
}
if (this.type == 2) {
this.isButtonState = true
@ -196,7 +206,7 @@ export default {
phone: this.form.phone,
code: this.form.phoneCode,
}
loginCodeApi(params).then(res => {
loginCodeApi(params).then((res) => {
if (res.code == 200) {
localStorage.setItem('token', res.data.access_token)
this.$router.push('./Home/index')
@ -207,11 +217,10 @@ export default {
})
} else {
this.isButtonState = false
return false;
return false
}
});
})
}
},
loginWayClick(type) {
if (type == 1) {
@ -219,26 +228,27 @@ export default {
this.UserLogin = true
this.loginWay = true
this.form = {}
this.$refs.form.resetFields();
this.$refs.form.resetFields()
} else {
this.type = 2
this.UserLogin = false
this.loginWay = false
this.form = {}
this.$refs.form.resetFields();
this.$refs.form.resetFields()
}
},
getCode() {
const regex = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; // 手机号正则表达式
const regex =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/ // 手机号正则表达式
let reg = regex.test(this.form.phone)
if (!reg) {
this.$refs.form.validateField("phone");
this.$refs.form.validateField('phone')
} else {
this.isCode = false
let params = {
phone: this.form.phone
phone: this.form.phone,
}
getSendIphoneCodeApi(params).then(res => {
getSendIphoneCodeApi(params).then((res) => {
if (res.code == 200) {
this.$message.success('短信发送成功！')
}
@ -273,8 +283,8 @@ export default {
alert('图片验证码不正确')
}
}
}
}
},
},
}
</script>
<style lang="scss" scoped>