mes 平板端
10
.eslintrc.js
@ -1,3 +1,10 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2023-12-28 13:39:09
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
module.exports = {
|
module.exports = {
|
||||||
root: true,
|
root: true,
|
||||||
env: {
|
env: {
|
||||||
@ -12,6 +19,7 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
rules: {
|
rules: {
|
||||||
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
|
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||||
|
'vue/multi-word-component-names': 'off'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
615
package-lock.json
generated
@ -8,7 +8,10 @@
|
|||||||
"lint": "vue-cli-service lint"
|
"lint": "vue-cli-service lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"axios": "^1.6.5",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
|
"element-ui": "^2.15.14",
|
||||||
|
"vant": "^2.13.2",
|
||||||
"vue": "^2.6.14",
|
"vue": "^2.6.14",
|
||||||
"vue-router": "^3.5.1",
|
"vue-router": "^3.5.1",
|
||||||
"vuex": "^3.6.2"
|
"vuex": "^3.6.2"
|
||||||
@ -26,7 +29,7 @@
|
|||||||
"eslint-plugin-import": "^2.25.3",
|
"eslint-plugin-import": "^2.25.3",
|
||||||
"eslint-plugin-node": "^11.1.0",
|
"eslint-plugin-node": "^11.1.0",
|
||||||
"eslint-plugin-promise": "^5.1.0",
|
"eslint-plugin-promise": "^5.1.0",
|
||||||
"eslint-plugin-vue": "^8.0.3",
|
"eslint-plugin-vue": "^7.0.0",
|
||||||
"less": "^4.0.0",
|
"less": "^4.0.0",
|
||||||
"less-loader": "^8.0.0",
|
"less-loader": "^8.0.0",
|
||||||
"lint-staged": "^11.1.2",
|
"lint-staged": "^11.1.2",
|
||||||
|
20
src/App.vue
@ -1,13 +1,29 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2024-01-07 22:29:50
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div id="app">
|
<div id="app">
|
||||||
<nav>
|
<!-- <nav>
|
||||||
<router-link to="/">Home</router-link> |
|
<router-link to="/">Home</router-link> |
|
||||||
<router-link to="/about">About</router-link>
|
<router-link to="/about">About</router-link>
|
||||||
</nav>
|
</nav> -->
|
||||||
|
<!-- <HomeView v-if="!$route.meta.keepAlive" /> -->
|
||||||
<router-view/>
|
<router-view/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// import HomeView from '@/views/HomeView.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
// components: { HomeView }
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
<style lang="less">
|
<style lang="less">
|
||||||
#app {
|
#app {
|
||||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
font-family: Avenir, Helvetica, Arial, sans-serif;
|
||||||
|
37
src/api/login.js
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-11-20 11:05:00
|
||||||
|
* @LastEditTime: 2024-01-09 09:50:55
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
import { getRefreshToken } from '@/utils/auth'
|
||||||
|
|
||||||
|
// 用户登陆
|
||||||
|
export function loginUser (data) {
|
||||||
|
return request({
|
||||||
|
url: '/system/auth/login',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 使用租户名,获得租户编号
|
||||||
|
export function getTenantIdByName (name) {
|
||||||
|
return request({
|
||||||
|
url: '/system/tenant/get-id-by-name',
|
||||||
|
method: 'get',
|
||||||
|
params: {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 刷新访问令牌
|
||||||
|
export function refreshToken () {
|
||||||
|
return request({
|
||||||
|
url: '/system/auth/refresh-token?refreshToken=' + getRefreshToken(),
|
||||||
|
method: 'post'
|
||||||
|
})
|
||||||
|
}
|
71
src/api/quality.js
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-11-20 11:05:00
|
||||||
|
* @LastEditTime: 2024-01-10 11:20:45
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description: 质量和报废
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 质量管理
|
||||||
|
export function qualityManage (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/quality-inspection-record/qualityManage',
|
||||||
|
method: 'get',
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 报废管理
|
||||||
|
export function createScrap (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/quality-scrap-log/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得所有产线列表
|
||||||
|
export function lineList (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/core-production-line/listAll',
|
||||||
|
method: 'get',
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据产线获得工段
|
||||||
|
export function workshopSectionListByLine (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/core-workshop-section/listByParentId',
|
||||||
|
method: 'get',
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得所有工单列表
|
||||||
|
export function workOrderList (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/core-work-order/listbyfilter',
|
||||||
|
method: 'get',
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得所有报废原因列表
|
||||||
|
export function scrapDetList (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/quality-scrap-det/listAll',
|
||||||
|
method: 'get',
|
||||||
|
params: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建质量检查信息
|
||||||
|
export function createInspection (data) {
|
||||||
|
return request({
|
||||||
|
url: '/base/quality-inspection-record/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
BIN
src/assets/bg.png
Normal file
After Width: | Height: | Size: 60 KiB |
BIN
src/assets/home.png
Normal file
After Width: | Height: | Size: 6.2 KiB |
BIN
src/assets/home_bg.png
Normal file
After Width: | Height: | Size: 413 KiB |
BIN
src/assets/icon.png
Normal file
After Width: | Height: | Size: 673 B |
BIN
src/assets/login-bg.png
Normal file
After Width: | Height: | Size: 45 KiB |
BIN
src/assets/modal.png
Normal file
After Width: | Height: | Size: 84 KiB |
BIN
src/assets/mountain.png
Normal file
After Width: | Height: | Size: 29 KiB |
BIN
src/assets/quality-bg.png
Normal file
After Width: | Height: | Size: 250 KiB |
BIN
src/assets/quality.png
Normal file
After Width: | Height: | Size: 44 KiB |
BIN
src/assets/scrap.png
Normal file
After Width: | Height: | Size: 48 KiB |
571
src/assets/styles/login.scss
Normal file
@ -0,0 +1,571 @@
|
|||||||
|
/* ===== PC DESIGN ===== */
|
||||||
|
$W: 1080;
|
||||||
|
$H: 1920;
|
||||||
|
// $picW: 438;
|
||||||
|
// $picH: 560;
|
||||||
|
$picW: 1080;
|
||||||
|
$picH: 1118;
|
||||||
|
$formW: 420;
|
||||||
|
$tabW: $formW / 2;
|
||||||
|
// $rowH: 56;
|
||||||
|
$rowH: 56;
|
||||||
|
$buttonH: 50;
|
||||||
|
|
||||||
|
// container
|
||||||
|
$containerBgColor: #e6ebf2;
|
||||||
|
$containerBgImage: '../assets/bg.png';
|
||||||
|
// container-logo
|
||||||
|
$logoWidth: 417px;
|
||||||
|
$logoHeight: 64px;
|
||||||
|
// $logoImage: '../assets/logo/login-logo.png';
|
||||||
|
// $cnbmLogo: '../assets/logo/cnbm.png';
|
||||||
|
// container-content
|
||||||
|
$contentWidth: round($W / $H * 100) * 1vw;
|
||||||
|
$contentHeight: round($picH / $W * 100) / 100 * $contentWidth;
|
||||||
|
$contentBgColor: #ffffff;
|
||||||
|
// container-content-pic
|
||||||
|
$picWidth: round($picW / $H * 100) * 1vw;
|
||||||
|
$picHeight: inherit;
|
||||||
|
// $picImage: '../assets/images/pic.png';
|
||||||
|
$picImage: '../assets/login-bg.png';
|
||||||
|
// container-content-field
|
||||||
|
$fieldWidth: $contentWidth - $picWidth;
|
||||||
|
$fieldHeight: inherit;
|
||||||
|
// container-content-field-form
|
||||||
|
$formWidth: $formW * 1px;
|
||||||
|
$tabWidth: $tabW * 1px;
|
||||||
|
$rowHeight: $rowH * 1px;
|
||||||
|
$buttonHeight: $buttonH * 1px;
|
||||||
|
|
||||||
|
// 1080px 高度为基准的 1px
|
||||||
|
$base1px: 0.15vh; // 1px / 1080px;
|
||||||
|
|
||||||
|
// - - - - - 页面基础设置
|
||||||
|
.container {
|
||||||
|
.login-code {
|
||||||
|
width: 33%;
|
||||||
|
height: 38px;
|
||||||
|
float: right;
|
||||||
|
img {
|
||||||
|
cursor: pointer;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 100px;
|
||||||
|
height: auto;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 元素
|
||||||
|
width: inherit;
|
||||||
|
height: inherit;
|
||||||
|
min-width: 1080px;
|
||||||
|
min-height: 620px;
|
||||||
|
background-color: $containerBgColor;
|
||||||
|
// background-image: url($containerBgImage);
|
||||||
|
background-size: cover;
|
||||||
|
// 定位
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
// 文字
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: Microsoft YaHei;
|
||||||
|
font-weight: 400;
|
||||||
|
.logo {
|
||||||
|
// 元素
|
||||||
|
width: $logoWidth;
|
||||||
|
height: $logoHeight;
|
||||||
|
// background-image: url($logoImage);
|
||||||
|
// background-size: contain;
|
||||||
|
// 定位
|
||||||
|
position: absolute;
|
||||||
|
top: 50px;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -$logoWidth/2;
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
// 元素
|
||||||
|
// width: $contentWidth;
|
||||||
|
// height: $contentHeight;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
// box-shadow: 0px calc(16 * 0.12vh) 40px rgba(0, 0, 0, 0.07);
|
||||||
|
// border-radius: 20px;
|
||||||
|
// 定位
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.pic {
|
||||||
|
flex: 3;
|
||||||
|
width: 1px;
|
||||||
|
min-width: 800px;
|
||||||
|
// 元素
|
||||||
|
// width: $picWidth;
|
||||||
|
height: $picHeight;
|
||||||
|
// height: 10vh;
|
||||||
|
background-image: url($picImage);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-position: 0 0;
|
||||||
|
position: relative;
|
||||||
|
&::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
// background: #f003;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.field {
|
||||||
|
position: relative;
|
||||||
|
margin-top: 14vh;
|
||||||
|
flex: 2;
|
||||||
|
// width: 800px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.pc-title {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
clear: both;
|
||||||
|
position: relative;
|
||||||
|
top: calc(-32 * $base1px);
|
||||||
|
height: calc(128 * $base1px);
|
||||||
|
|
||||||
|
.title {
|
||||||
|
margin: 0;
|
||||||
|
margin-left: calc(18px * 0.12vh);
|
||||||
|
font-weight: 400;
|
||||||
|
user-select: none;
|
||||||
|
color: #000;
|
||||||
|
font-size: calc(28 * 0.12vh);
|
||||||
|
line-height: calc(40 * 0.12vh);
|
||||||
|
letter-spacing: calc(2 * 0.12vh);
|
||||||
|
|
||||||
|
.cnbm_logo {
|
||||||
|
height: calc(160 * 0.12vh);
|
||||||
|
width: calc(182 * 0.12vh);
|
||||||
|
position: relative;
|
||||||
|
top: calc(8 * 0.12vh);
|
||||||
|
right: calc(8 * 0.12vh);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sub-title {
|
||||||
|
margin: 0;
|
||||||
|
margin-left: calc(28 * 0.12vh);
|
||||||
|
font-weight: 400;
|
||||||
|
user-select: none;
|
||||||
|
color: #000;
|
||||||
|
font-size: calc(28 * 0.12vh);
|
||||||
|
line-height: calc(48 * 0.12vh);
|
||||||
|
letter-spacing: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-title,
|
||||||
|
.mobile-switch {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-cont {
|
||||||
|
// height: 560px;
|
||||||
|
flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
user-select: none;
|
||||||
|
// 元素
|
||||||
|
margin: calc(12 * 0.12vh) 0;
|
||||||
|
height: calc(16 * 0.12vh);
|
||||||
|
line-height: calc(16 * 0.12vh);
|
||||||
|
font-size: calc(12 * 0.12vh);
|
||||||
|
color: #8c8c8c;
|
||||||
|
|
||||||
|
a,
|
||||||
|
a:hover,
|
||||||
|
a:active {
|
||||||
|
color: inherit;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
margin-top: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
:deep(.el-tabs__content) {
|
||||||
|
padding: 20px 0 0;
|
||||||
|
}
|
||||||
|
:deep(.el-tabs__item) {
|
||||||
|
user-select: none;
|
||||||
|
// 元素
|
||||||
|
width: $tabWidth;
|
||||||
|
// height: $rowHeight;
|
||||||
|
height: calc(54 * 0.12vh);
|
||||||
|
padding: 0;
|
||||||
|
// 文字
|
||||||
|
line-height: $rowHeight;
|
||||||
|
color: #666666;
|
||||||
|
font-size: calc(14 * 0.12vh);
|
||||||
|
font-weight: 400;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
:deep(.el-tabs__item.is-active) {
|
||||||
|
font-weight: 500;
|
||||||
|
color: #2f53eb;
|
||||||
|
}
|
||||||
|
:deep(.el-tabs__active-bar) {
|
||||||
|
height: 3px;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
// - - - input
|
||||||
|
:deep(.el-input__inner) {
|
||||||
|
// 元素
|
||||||
|
width: 100%;
|
||||||
|
// height: $rowHeight;
|
||||||
|
height: calc(72 * 0.12vh);
|
||||||
|
background: #f5f5f5;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 28px;
|
||||||
|
// 文字
|
||||||
|
text-align: center;
|
||||||
|
line-height: 19px;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
.code:deep(.el-input__inner) {
|
||||||
|
padding: 0 24px;
|
||||||
|
// 文字
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
:deep(.el-input__inner::-webkit-input-placeholder) {
|
||||||
|
/* WebKit browsers */
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8c8c8c;
|
||||||
|
}
|
||||||
|
:deep(.el-input__inner:-moz-placeholder) {
|
||||||
|
/* Mozilla Firefox 4 to 18 */
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8c8c8c;
|
||||||
|
}
|
||||||
|
:deep(.el-input__inner::-moz-placeholder) {
|
||||||
|
/* Mozilla Firefox 19+ */
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8c8c8c;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
:deep(.el-input__inner:-ms-input-placeholder) {
|
||||||
|
/* Internet Explorer 10+ */
|
||||||
|
font-weight: 400;
|
||||||
|
color: #8c8c8c !important;
|
||||||
|
}
|
||||||
|
:deep(.el-form-item) {
|
||||||
|
position: relative;
|
||||||
|
.button-code {
|
||||||
|
// 元素
|
||||||
|
height: $rowHeight;
|
||||||
|
box-sizing: border-box;
|
||||||
|
// 定位
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 20px;
|
||||||
|
z-index: 1;
|
||||||
|
// 文字
|
||||||
|
line-height: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #2f53eb;
|
||||||
|
span {
|
||||||
|
padding-left: 15px;
|
||||||
|
border-left: 2px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
:deep(.el-form-item__error) {
|
||||||
|
padding-left: 24px;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
width: 100%;
|
||||||
|
height: $buttonHeight;
|
||||||
|
background: rgba(24, 144, 255, 0.2);
|
||||||
|
border: 0;
|
||||||
|
border-radius: 24px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
// 文字
|
||||||
|
line-height: 26px;
|
||||||
|
font-size: calc(18 * 0.12vh);
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.button-active {
|
||||||
|
background: #2f53eb;
|
||||||
|
box-shadow: 0px 2px 8px rgba(0, 80, 184, 0.2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-form {
|
||||||
|
* {
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
// - - - input
|
||||||
|
:deep(.el-input__inner) {
|
||||||
|
// 元素
|
||||||
|
width: 420px;
|
||||||
|
height: calc(52 * 0.12vh);
|
||||||
|
// height: 66px;
|
||||||
|
color: #262626;
|
||||||
|
font-size: calc(14 * 0.12vh);
|
||||||
|
}
|
||||||
|
:deep(.el-checkbox__label) {
|
||||||
|
font-size: calc(14 * 0.12vh);
|
||||||
|
line-height: calc(12 * 0.12vh);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// - - - - - PC 最小尺寸设置
|
||||||
|
@media screen and (min-width: 1920px) {
|
||||||
|
.container {
|
||||||
|
.content {
|
||||||
|
.field {
|
||||||
|
flex: initial;
|
||||||
|
// width: 800px;
|
||||||
|
width: 40vw;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-height: 1024px) {
|
||||||
|
.container {
|
||||||
|
.content {
|
||||||
|
.field {
|
||||||
|
margin-top: 16vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-height: 1024px) {
|
||||||
|
.container {
|
||||||
|
.content {
|
||||||
|
.field {
|
||||||
|
margin-top: 8vh;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (min-width: 599px) and (max-width: 1366px) {
|
||||||
|
.container {
|
||||||
|
// min-width: 599px;
|
||||||
|
min-width: 42vw;
|
||||||
|
|
||||||
|
.content {
|
||||||
|
// width: 710px;
|
||||||
|
// height: 397px;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.pic {
|
||||||
|
// width: 314px;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.field {
|
||||||
|
// margin-top: 6vh;
|
||||||
|
// width: calc(710px - 314px);
|
||||||
|
// left: 314px;
|
||||||
|
// justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.pc-title {
|
||||||
|
h3 {
|
||||||
|
font-size: 2.4rem !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
// width: 320px;
|
||||||
|
:deep(.el-input__inner) {
|
||||||
|
width: 320px;
|
||||||
|
height: 56px;
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// @media screen and (max-height: 1080px) {
|
||||||
|
// .container {
|
||||||
|
// .field {
|
||||||
|
// transform: scale(0.74);
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
/* ===== MOBILE DESIGN ===== */
|
||||||
|
$mobileW: 375;
|
||||||
|
$mobileH: 812;
|
||||||
|
$mobileContentW: 327;
|
||||||
|
$mobileContentH: 376;
|
||||||
|
$mobileFormW: 280;
|
||||||
|
$mobileRowH: 48;
|
||||||
|
$mobileButtonH: 48;
|
||||||
|
|
||||||
|
// container
|
||||||
|
$mobileContainerBgImage: '../assets/images/bg-mobile.png';
|
||||||
|
// container-content
|
||||||
|
$mobileContentWidth: round($mobileContentW / $mobileW * 100) * 1vw;
|
||||||
|
$mobileContentHeight: round($mobileContentH / $mobileW * 100) / 100 *
|
||||||
|
$mobileContentWidth;
|
||||||
|
// container-content-field-form
|
||||||
|
$mobileFormWidth: round($mobileFormW / $mobileW * 100) * 1vw;
|
||||||
|
$mobileRowHeight: $mobileRowH * 1px;
|
||||||
|
$mobileButtonHeight: $mobileButtonH * 1px;
|
||||||
|
$iconBgImage: '../assets/images/icon.png';
|
||||||
|
|
||||||
|
// - - - - - 移动端设置
|
||||||
|
@media screen and (max-width: 599px) {
|
||||||
|
.container {
|
||||||
|
// 元素
|
||||||
|
background-image: url($mobileContainerBgImage);
|
||||||
|
min-width: 280px;
|
||||||
|
min-height: 568px;
|
||||||
|
// 文字
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
.logo {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pc-title {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
// 元素
|
||||||
|
width: $mobileContentWidth;
|
||||||
|
height: $mobileContentHeight;
|
||||||
|
min-width: 250px;
|
||||||
|
min-height: 340px;
|
||||||
|
// 定位
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
.pic {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.field {
|
||||||
|
padding: 0;
|
||||||
|
// 元素
|
||||||
|
width: inherit;
|
||||||
|
min-height: inherit;
|
||||||
|
// 定位
|
||||||
|
left: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.mobile-title {
|
||||||
|
// 元素
|
||||||
|
margin: 0;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
margin: 0;
|
||||||
|
width: $mobileFormWidth;
|
||||||
|
// - - - tab
|
||||||
|
:deep(.el-tabs__header) {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
:deep(.el-tabs__content) {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
// - - - input
|
||||||
|
:deep(.el-input__inner) {
|
||||||
|
height: $mobileRowHeight;
|
||||||
|
line-height: 24px;
|
||||||
|
// 文字
|
||||||
|
text-align: center;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
:deep(.el-form-item) {
|
||||||
|
.button-code {
|
||||||
|
// 元素
|
||||||
|
height: $mobileRowHeight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.button {
|
||||||
|
height: $mobileButtonHeight;
|
||||||
|
line-height: 24px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.login-form {
|
||||||
|
:deep(.el-input__inner) {
|
||||||
|
height: $mobileRowHeight;
|
||||||
|
line-height: 24px;
|
||||||
|
// 文字
|
||||||
|
text-align: center;
|
||||||
|
color: #262626;
|
||||||
|
}
|
||||||
|
|
||||||
|
:deep(#button-form-item) {
|
||||||
|
margin: 0 !important;
|
||||||
|
button {
|
||||||
|
// 元素
|
||||||
|
height: $mobileRowHeight;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mobile-switch {
|
||||||
|
display: block;
|
||||||
|
line-height: 20px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #595959;
|
||||||
|
margin: 0;
|
||||||
|
.icon {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
display: inline-block;
|
||||||
|
background-image: url($iconBgImage);
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mobile-switch:hover {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
// 元素
|
||||||
|
font-size: calc(12 * 0.12vh);
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 17px;
|
||||||
|
color: #333333;
|
||||||
|
opacity: 0.6;
|
||||||
|
// 定位
|
||||||
|
// position: absolute;
|
||||||
|
bottom: -calc(32 * 0.12vh);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
BIN
src/assets/transparent.png
Normal file
After Width: | Height: | Size: 65 KiB |
BIN
src/assets/xcac.png
Normal file
After Width: | Height: | Size: 5.2 KiB |
16
src/main.js
@ -1,9 +1,25 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2024-01-09 17:50:38
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import router from './router'
|
import router from './router'
|
||||||
import store from './store'
|
import store from './store'
|
||||||
|
import Vant from 'vant'
|
||||||
|
import 'vant/lib/index.css'
|
||||||
|
import axios from 'axios'
|
||||||
|
import ElementUI from 'element-ui'
|
||||||
|
import 'element-ui/lib/theme-chalk/index.css'
|
||||||
|
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
|
Vue.prototype.$http = axios
|
||||||
|
|
||||||
|
Vue.use(Vant)
|
||||||
|
Vue.use(ElementUI)
|
||||||
|
|
||||||
new Vue({
|
new Vue({
|
||||||
router,
|
router,
|
||||||
|
@ -1,12 +1,28 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2024-01-09 13:58:18
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import VueRouter from 'vue-router'
|
import VueRouter from 'vue-router'
|
||||||
import HomeView from '../views/HomeView.vue'
|
import HomeView from '../views/HomeView.vue'
|
||||||
|
import LoginView from '../views/Login.vue'
|
||||||
|
|
||||||
Vue.use(VueRouter)
|
Vue.use(VueRouter)
|
||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
|
name: 'login',
|
||||||
|
component: LoginView,
|
||||||
|
meta: {
|
||||||
|
keepAlive: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/home',
|
||||||
name: 'home',
|
name: 'home',
|
||||||
component: HomeView
|
component: HomeView
|
||||||
},
|
},
|
||||||
@ -17,6 +33,16 @@ const routes = [
|
|||||||
// this generates a separate chunk (about.[hash].js) for this route
|
// this generates a separate chunk (about.[hash].js) for this route
|
||||||
// which is lazy-loaded when the route is visited.
|
// which is lazy-loaded when the route is visited.
|
||||||
component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
|
component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/quality',
|
||||||
|
name: 'quality',
|
||||||
|
component: () => import('../views/Quality.vue')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '/scrap',
|
||||||
|
name: 'scrap',
|
||||||
|
component: () => import('../views/Scrap.vue')
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|
||||||
|
36
src/utils/auth.js
Normal file
@ -0,0 +1,36 @@
|
|||||||
|
|
||||||
|
// ========== 租户相关 ==========
|
||||||
|
|
||||||
|
const TenantIdKey = 'TENANT_ID'
|
||||||
|
// const TenantNameKey = 'TENANT_NAME'
|
||||||
|
|
||||||
|
export function setTenantId (username) {
|
||||||
|
localStorage.setItem(TenantIdKey, username)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getTenantId () {
|
||||||
|
return localStorage.getItem(TenantIdKey)
|
||||||
|
}
|
||||||
|
|
||||||
|
const AccessTokenKey = 'ACCESS_TOKEN'
|
||||||
|
const RefreshTokenKey = 'REFRESH_TOKEN'
|
||||||
|
|
||||||
|
// ========== Token 相关 ==========
|
||||||
|
|
||||||
|
export function getAccessToken () {
|
||||||
|
return localStorage.getItem(AccessTokenKey)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getRefreshToken () {
|
||||||
|
return localStorage.getItem(RefreshTokenKey)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function setToken (token) {
|
||||||
|
localStorage.setItem(AccessTokenKey, token.accessToken)
|
||||||
|
localStorage.setItem(RefreshTokenKey, token.refreshToken)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function removeToken () {
|
||||||
|
localStorage.removeItem(AccessTokenKey)
|
||||||
|
localStorage.removeItem(RefreshTokenKey)
|
||||||
|
}
|
108
src/utils/request.js
Normal file
@ -0,0 +1,108 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-11-20 11:02:29
|
||||||
|
* @LastEditTime: 2024-01-10 17:31:37
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import axios from 'axios'
|
||||||
|
import { getTenantId, getAccessToken, getRefreshToken, setToken } from '@/utils/auth'
|
||||||
|
import { refreshToken } from '@/api/login'
|
||||||
|
|
||||||
|
axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
|
||||||
|
|
||||||
|
const service = axios.create({
|
||||||
|
// baseURL: 'http://192.168.0.33:48082/admin-api',
|
||||||
|
baseURL: 'http://192.168.0.33:48082/admin-api',
|
||||||
|
timeout: 30000,
|
||||||
|
withCredentials: false
|
||||||
|
})
|
||||||
|
|
||||||
|
// 是否显示重新登录
|
||||||
|
export const isRelogin = { show: false }
|
||||||
|
// 是否正在刷新中
|
||||||
|
let isRefreshToken = false
|
||||||
|
// 请求队列
|
||||||
|
let requestList = []
|
||||||
|
|
||||||
|
// request拦截器
|
||||||
|
service.interceptors.request.use(config => {
|
||||||
|
// 设置租户
|
||||||
|
const tenantId = getTenantId()
|
||||||
|
config.headers['tenant-id'] = tenantId
|
||||||
|
// 是否需要设置 token
|
||||||
|
const isToken = (config.headers || {}).isToken === false
|
||||||
|
if (getAccessToken() && !isToken) {
|
||||||
|
config.headers.Authorization = 'Bearer ' + getAccessToken() // 让每个请求携带自定义token 请根据实际情况自行修改
|
||||||
|
}
|
||||||
|
return config
|
||||||
|
})
|
||||||
|
|
||||||
|
// 响应拦截器
|
||||||
|
service.interceptors.response.use(async res => {
|
||||||
|
// return Promise.reject(error)
|
||||||
|
// 访问令牌过期
|
||||||
|
if (res.data.code === 401) {
|
||||||
|
if (!isRefreshToken) {
|
||||||
|
isRefreshToken = true
|
||||||
|
// 1. 如果获取不到刷新令牌,则只能执行登出操作
|
||||||
|
if (!getRefreshToken()) {
|
||||||
|
return handleAuthorized()
|
||||||
|
}
|
||||||
|
// 2. 进行刷新访问令牌
|
||||||
|
try {
|
||||||
|
const refreshTokenRes = await refreshToken()
|
||||||
|
// 2.1 刷新成功,则回放队列的请求 + 当前请求
|
||||||
|
if (refreshTokenRes.data.code === 0) {
|
||||||
|
setToken(refreshTokenRes.data.data)
|
||||||
|
requestList.forEach(cb => cb())
|
||||||
|
return service(res.config)
|
||||||
|
} else {
|
||||||
|
return handleAuthorized()
|
||||||
|
}
|
||||||
|
} catch (e) { // 为什么需要 catch 异常呢?刷新失败时,请求因为 Promise.reject 触发异常。
|
||||||
|
// 2.2 刷新失败,只回放队列的请求
|
||||||
|
requestList.forEach(cb => cb())
|
||||||
|
// 提示是否要登出。即不回放当前请求!不然会形成递归
|
||||||
|
return handleAuthorized()
|
||||||
|
} finally {
|
||||||
|
requestList = []
|
||||||
|
isRefreshToken = false
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 添加到队列,等待刷新获取到新的令牌
|
||||||
|
return new Promise(resolve => {
|
||||||
|
requestList.push(() => {
|
||||||
|
res.config.headers.Authorization = 'Bearer ' + getAccessToken() // 让每个请求携带自定义token 请根据实际情况自行修改
|
||||||
|
resolve(service(res.config))
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
// if (res.dat)
|
||||||
|
})
|
||||||
|
|
||||||
|
function handleAuthorized () {
|
||||||
|
if (!isRelogin.show) {
|
||||||
|
isRelogin.show = true
|
||||||
|
this.$message.confirm('登录状态已过期,您可以继续留在该页面,或者重新登录', '系统提示', {
|
||||||
|
confirmButtonText: '重新登录',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning'
|
||||||
|
}
|
||||||
|
).then(() => {
|
||||||
|
isRelogin.show = false
|
||||||
|
this.$router.push({ path: '/' })
|
||||||
|
// store.dispatch('LogOut').then(() => {
|
||||||
|
// location.href = getPath('/index');
|
||||||
|
// })
|
||||||
|
}).catch(() => {
|
||||||
|
isRelogin.show = false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
return Promise.reject(new Error('无效的会话,或者会话已过期,请重新登录。'))
|
||||||
|
}
|
||||||
|
|
||||||
|
export default service
|
@ -1,18 +1,82 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2024-01-09 14:00:12
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description: 首页
|
||||||
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div class="home">
|
<div class="home">
|
||||||
<img alt="Vue logo" src="../assets/logo.png">
|
<div class="centerDiv">
|
||||||
<HelloWorld msg="Welcome to Your Vue.js App"/>
|
<div class="img1" @click="toQuality">
|
||||||
|
<p class="title">质量收集器</p>
|
||||||
|
</div>
|
||||||
|
<div class="img" @click="toScrap">
|
||||||
|
<p class="title">报废管理</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// @ is an alias to /src
|
|
||||||
import HelloWorld from '@/components/HelloWorld.vue'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'HomeView',
|
name: 'HomeView',
|
||||||
components: {
|
data () {
|
||||||
HelloWorld
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
toQuality () {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'quality'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
toScrap () {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'scrap'
|
||||||
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.title {
|
||||||
|
/* width: 175px;
|
||||||
|
height: 45px; */
|
||||||
|
font-size: 32px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #000000;
|
||||||
|
line-height: 45px;
|
||||||
|
letter-spacing: 3px;
|
||||||
|
margin-top: 395px;
|
||||||
|
}
|
||||||
|
.img {
|
||||||
|
width: 428px;
|
||||||
|
height: 607px;
|
||||||
|
background-image: url('./../assets/scrap.png');
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
.img1 {
|
||||||
|
width: 428px;
|
||||||
|
height: 607px;
|
||||||
|
background-image: url('./../assets/quality.png');
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
.centerDiv {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
height: 100vh;
|
||||||
|
gap: 18px;
|
||||||
|
}
|
||||||
|
.home {
|
||||||
|
background-image: url('./../assets/home_bg.png');
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
background-size: cover;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
182
src/views/Login.vue
Normal file
@ -0,0 +1,182 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-28 11:21:53
|
||||||
|
* @LastEditTime: 2024-01-10 16:58:49
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description: 登陆
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="login">
|
||||||
|
<van-row type="flex" justify="space-around">
|
||||||
|
<van-col span="12">
|
||||||
|
<div class="left">
|
||||||
|
<div class="title">
|
||||||
|
<span>Wel</span>
|
||||||
|
<span style="color: white">come</span>
|
||||||
|
<p
|
||||||
|
style="
|
||||||
|
margin: 0;
|
||||||
|
font-size: 16px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
color: #26b9de;
|
||||||
|
opacity: 75%;
|
||||||
|
">
|
||||||
|
<span
|
||||||
|
style="
|
||||||
|
display: inline-block;
|
||||||
|
height: 12px;
|
||||||
|
width: 12px;
|
||||||
|
margin-left: 8px;
|
||||||
|
margin-right: 2px;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: #26b9de;
|
||||||
|
"></span>
|
||||||
|
向世界先进水平挑战,为人类社会文明做贡献
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<img class="modalImg" src="./../assets/modal.png" alt="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-col>
|
||||||
|
<van-col span="12">
|
||||||
|
<div class="right">
|
||||||
|
<div>
|
||||||
|
<img class="xcacImg" src="./../assets/xcac.png" alt="">
|
||||||
|
<p class="xc">许昌安彩新能源科技有限公司</p>
|
||||||
|
</div>
|
||||||
|
<div class="form">
|
||||||
|
<van-form @submit="onSubmit">
|
||||||
|
<van-field
|
||||||
|
v-model="username"
|
||||||
|
name="username"
|
||||||
|
placeholder="用户名 / 手机号"
|
||||||
|
style="margin-bottom: 16px"
|
||||||
|
:rules="[{ required: true, message: '请填写用户名' }]"
|
||||||
|
/>
|
||||||
|
<van-field
|
||||||
|
v-model="password"
|
||||||
|
type="password"
|
||||||
|
name="password"
|
||||||
|
placeholder="密码"
|
||||||
|
:rules="[{ required: true, message: '请填写密码' }]"
|
||||||
|
/>
|
||||||
|
<div style="margin-top: 36px; border-radius: 3px">
|
||||||
|
<van-button block type="info" native-type="submit">提交</van-button>
|
||||||
|
</div>
|
||||||
|
</van-form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<div class="mountain">
|
||||||
|
<p style="margin-top: 80px; color: #3196E7">{{'版权所有:中建材智能自动化有限公司版本' + '\u3000' +'版本:1.0'}}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { loginUser, getTenantIdByName } from '@/api/login'
|
||||||
|
import { setTenantId, setToken } from '@/utils/auth'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'Login',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
username: 'admin',
|
||||||
|
password: 'admin123',
|
||||||
|
tenantName: '技术中心'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created () {
|
||||||
|
// 租户
|
||||||
|
getTenantIdByName(this.tenantName).then((res) => {
|
||||||
|
// 设置租户
|
||||||
|
const tenantId = res.data.data
|
||||||
|
if (tenantId && tenantId >= 0) {
|
||||||
|
setTenantId(tenantId)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onSubmit (values) {
|
||||||
|
loginUser(values).then(res => {
|
||||||
|
console.log(res.data)
|
||||||
|
if (res.data.code === 0) {
|
||||||
|
setToken(res.data.data)
|
||||||
|
this.$router.push({
|
||||||
|
path: 'home'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.form {
|
||||||
|
width: 332px;
|
||||||
|
margin: 45px auto;
|
||||||
|
}
|
||||||
|
.xc {
|
||||||
|
/* width: 342px;
|
||||||
|
height: 32px; */
|
||||||
|
font-size: 24px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
line-height: 32px;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
margin: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.xcacImg {
|
||||||
|
height: 46px;
|
||||||
|
width: 130px;
|
||||||
|
margin: 80px 148px 0;
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
background-image: url('./../assets/transparent.png');
|
||||||
|
height: 534px;
|
||||||
|
width: 458px;
|
||||||
|
margin-top: 121px;
|
||||||
|
margin-left: 40px;
|
||||||
|
}
|
||||||
|
.modalImg {
|
||||||
|
margin-top: 55px;
|
||||||
|
margin-left: 55px;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
/* width: 297px; */
|
||||||
|
/* height: 59px; */
|
||||||
|
padding-top: 122px;
|
||||||
|
padding-left: 115px;
|
||||||
|
text-align: left;
|
||||||
|
font-size: 66px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #1BD1FF;
|
||||||
|
line-height: 58px;
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
.mountain {
|
||||||
|
background-image: url('./../assets/mountain.png');
|
||||||
|
height: 131px;
|
||||||
|
width: 100vw;
|
||||||
|
background-size: 100%;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.login {
|
||||||
|
background-image: url('./../assets/login-bg.png');
|
||||||
|
height: 100vh;
|
||||||
|
background-size: 100%;
|
||||||
|
position: relative;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
</style>
|
222
src/views/Quality.vue
Normal file
@ -0,0 +1,222 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2024-01-09 13:48:42
|
||||||
|
* @LastEditTime: 2024-01-10 17:56:00
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="quality">
|
||||||
|
<van-row type="flex" justify="space-between">
|
||||||
|
<van-col span="5" style="text-align: left">
|
||||||
|
<h2>质量管理器</h2>
|
||||||
|
</van-col>
|
||||||
|
<van-col span="4" style="text-align: right">
|
||||||
|
<img class="homeIcon" @click="toHome" src="./../assets/home.png" alt="">
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<van-row gutter="20" style="margin-top: -20px;">
|
||||||
|
<van-col span="12">
|
||||||
|
<van-dropdown-menu >
|
||||||
|
<van-dropdown-item v-model="listQuery.productionLineId" :options="lineArray" @change="getSection()" />
|
||||||
|
</van-dropdown-menu>
|
||||||
|
</van-col>
|
||||||
|
<van-col span="12">
|
||||||
|
<van-dropdown-menu>
|
||||||
|
<van-dropdown-item v-model="listQuery.sectionId" :options="sectionArray" @change="getQuality()" />
|
||||||
|
</van-dropdown-menu>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<div class="count">
|
||||||
|
本班次合计数量:{{ count }}
|
||||||
|
</div>
|
||||||
|
<div class="content" v-for="(item, index) in typeList" :key="index">
|
||||||
|
<van-row type="flex" align="center" style="margin-left: -20px">
|
||||||
|
<van-col span="1">
|
||||||
|
<img style="width: 20px; height: 20px;" src="./../assets/icon.png" alt="">
|
||||||
|
</van-col>
|
||||||
|
<van-col span="8">
|
||||||
|
<p style="text-align: left; color: #276BFF">{{ item[0].typeName }}</p>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
<van-row type="flex">
|
||||||
|
<van-col span="6" v-for="it in item" :key="it.id">
|
||||||
|
<div :class=" it.active ? 'flexActive' : 'flexItem'">
|
||||||
|
<!-- <div> -->
|
||||||
|
<div class="contain">
|
||||||
|
<div class="leftDiv">{{ it.count }}</div>
|
||||||
|
</div>
|
||||||
|
<!-- </div> -->
|
||||||
|
<!-- <div> -->
|
||||||
|
<div class="rightDiv" @click="addRecord(it)">{{ it.detContent }}</div>
|
||||||
|
<!-- </div> -->
|
||||||
|
</div>
|
||||||
|
</van-col>
|
||||||
|
</van-row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { lineList, workshopSectionListByLine, qualityManage, createInspection } from '@/api/quality'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'Quality',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
lineArray: [],
|
||||||
|
sectionArray: [],
|
||||||
|
listQuery: {
|
||||||
|
productionLineId: '',
|
||||||
|
sectionId: ''
|
||||||
|
},
|
||||||
|
count: 0,
|
||||||
|
typeList: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.getLine()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addRecord (value) {
|
||||||
|
const now = new Date() // 创建一个表示当前时间的Date对象
|
||||||
|
const formattedTime = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')} ${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}:${now.getSeconds().toString().padStart(2, '0')}`
|
||||||
|
// console.log(formattedTime)
|
||||||
|
createInspection({
|
||||||
|
...this.listQuery,
|
||||||
|
inspectionDetId: value.detId,
|
||||||
|
checkTime: formattedTime
|
||||||
|
}).then(res => {
|
||||||
|
if (res.data.code === 0) {
|
||||||
|
this.$set(value, 'active', true)
|
||||||
|
value.count++
|
||||||
|
this.count++
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
toHome () {
|
||||||
|
this.$router.push({
|
||||||
|
path: 'home'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getQuality () {
|
||||||
|
qualityManage(this.listQuery).then(res => {
|
||||||
|
if (JSON.stringify(res.data.data) !== '{}') {
|
||||||
|
this.typeList = Object.values(res.data.data)
|
||||||
|
this.count = this.typeList[0][0].sunCount
|
||||||
|
} else {
|
||||||
|
this.typeList = []
|
||||||
|
this.count = 0
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getLine () {
|
||||||
|
lineList().then(res => {
|
||||||
|
this.lineArray = res.data.data.map(item => {
|
||||||
|
return {
|
||||||
|
text: item.name,
|
||||||
|
value: item.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getSection () {
|
||||||
|
workshopSectionListByLine({ id: this.listQuery.productionLineId }).then(res => {
|
||||||
|
this.sectionArray = res.data.data.map(item => {
|
||||||
|
return {
|
||||||
|
text: item.name,
|
||||||
|
value: item.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.flexItem {
|
||||||
|
display: flex;
|
||||||
|
margin-right: 20px;
|
||||||
|
width: 226px;
|
||||||
|
line-height: 72px;
|
||||||
|
box-shadow: 5px 6px 8px 0px rgba(206,212,226,0.72), inset 6px 0px 6px 0px #FFFFFF;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
.flexActive {
|
||||||
|
display: flex;
|
||||||
|
margin-right: 20px;
|
||||||
|
width: 226px;
|
||||||
|
line-height: 72px;
|
||||||
|
box-shadow: 5px 6px 8px 0px rgba(206,212,226,0.72), inset 6px 0px 6px 0px #FFFFFF;
|
||||||
|
background-color: #276BFF;
|
||||||
|
}
|
||||||
|
.rightDiv {
|
||||||
|
border-radius: 7px;
|
||||||
|
height: 72px;
|
||||||
|
line-height: 72px;
|
||||||
|
width: 140px;
|
||||||
|
/* background-color: #276BFF; */
|
||||||
|
}
|
||||||
|
.contain {
|
||||||
|
border-radius: 7px 36px 36px 7px;
|
||||||
|
height: 72px;
|
||||||
|
width: 80px;
|
||||||
|
line-height: 72px;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
/* margin: 5px 0 5px 0; */
|
||||||
|
}
|
||||||
|
.leftDiv {
|
||||||
|
border-radius: 7px 36px 36px 7px;
|
||||||
|
background-color: #276BFF;
|
||||||
|
height: 72px;
|
||||||
|
width: 77px;
|
||||||
|
line-height: 72px;
|
||||||
|
/* margin: 5px 0 5px 0; */
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
width: 100%;
|
||||||
|
/* height: 40px; */
|
||||||
|
/* display: flex; */
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
opacity: 0.7;
|
||||||
|
backdrop-filter: blur(50px);
|
||||||
|
line-height: 40px;
|
||||||
|
font-size: 18px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #000000;
|
||||||
|
margin-top: 7px;
|
||||||
|
padding: 0 20px 20px 20px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.count {
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
opacity: 0.7;
|
||||||
|
backdrop-filter: blur(50px);
|
||||||
|
line-height: 40px;
|
||||||
|
font-size: 18px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #000000;
|
||||||
|
margin-top: 7px;
|
||||||
|
}
|
||||||
|
.homeIcon {
|
||||||
|
width: 84px;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
.quality {
|
||||||
|
background-image: url('./../assets/quality-bg.png');
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
padding: 20px 20px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
</style>
|
134
src/views/Scrap.vue
Normal file
@ -0,0 +1,134 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2024-01-09 13:49:03
|
||||||
|
* @LastEditTime: 2024-01-09 20:39:57
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="scrap">
|
||||||
|
<div style="float: right" type="primary" size="small" plain @click="goback()">
|
||||||
|
<img class="homeIcon" src="./../assets/home.png" alt="">
|
||||||
|
</div>
|
||||||
|
<h2>报废管理</h2>
|
||||||
|
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
|
||||||
|
<el-form-item label="工单" prop="workOrderId">
|
||||||
|
<el-select v-model="ruleForm.workOrderId" filterable clearable placeholder="请选择工单" style="width: 100%; display: block">
|
||||||
|
<el-option v-for="(item, index) in workOrderList" :key="index" :label="item.name" :value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="报废数量" prop="num">
|
||||||
|
<el-input-Number v-model="ruleForm.num" style="width: 100%; display: block"></el-input-Number>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="报废原因" prop="detName">
|
||||||
|
<el-checkbox-group v-model="ruleForm.detName" style="width: 100%; display: block; text-align: left">
|
||||||
|
<el-checkbox v-for="(item, index) in scrapList" :key="index" :label="item.content" :name="item.id"></el-checkbox>
|
||||||
|
</el-checkbox-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="产线" prop="lineId">
|
||||||
|
<el-select v-model="ruleForm.lineId" filterable clearable placeholder="请选择产线" style="width: 100%; display: block">
|
||||||
|
<el-option v-for="(item, index) in lineArray" :key="index" :label="item.name" :value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="时间" prop="logTime">
|
||||||
|
<el-date-picker type="datetime" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss" v-model="ruleForm.logTime" style="width: 100%;"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button @click="resetForm('ruleForm')">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { workOrderList, scrapDetList, lineList, createScrap } from '@/api/quality'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
ruleForm: {
|
||||||
|
workOrderId: '',
|
||||||
|
num: 0,
|
||||||
|
detId: '',
|
||||||
|
detName: [],
|
||||||
|
lineId: undefined,
|
||||||
|
logTime: new Date()
|
||||||
|
},
|
||||||
|
workOrderList: [],
|
||||||
|
lineArray: [],
|
||||||
|
scrapList: [],
|
||||||
|
rules: {
|
||||||
|
workOrderId: [
|
||||||
|
{ required: true, message: '请选择工单', trigger: 'change' }
|
||||||
|
],
|
||||||
|
num: [
|
||||||
|
{ required: true, message: '请输入报废数量', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
detName: [
|
||||||
|
{ required: true, message: '请选择报废原因', trigger: 'blur' }
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.getDict()
|
||||||
|
this.ruleForm = {
|
||||||
|
workOrderId: '',
|
||||||
|
num: 0,
|
||||||
|
detId: '',
|
||||||
|
detName: [],
|
||||||
|
lineId: undefined,
|
||||||
|
logTime: new Date()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goback () {
|
||||||
|
this.$router.go(-1)
|
||||||
|
},
|
||||||
|
async getDict () {
|
||||||
|
const workRes = await workOrderList()
|
||||||
|
this.workOrderList = workRes.data.data
|
||||||
|
await lineList().then(res => {
|
||||||
|
this.lineArray = res.data.data.map(item => {
|
||||||
|
return {
|
||||||
|
name: item.name,
|
||||||
|
id: item.id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
const scrapRes = await scrapDetList()
|
||||||
|
this.scrapList = scrapRes.data.data
|
||||||
|
},
|
||||||
|
submitForm (formName) {
|
||||||
|
this.$refs[formName].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
this.ruleForm.detId = this.ruleForm.detName.join(',')
|
||||||
|
createScrap(this.ruleForm).then(res => {
|
||||||
|
console.log(res.data)
|
||||||
|
if (res.data.code === 0) {
|
||||||
|
this.$message({
|
||||||
|
message: '提交成功!',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
console.log('error submit!!')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
resetForm (formName) {
|
||||||
|
this.$refs[formName].resetFields()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.scrap {
|
||||||
|
padding: 30px;
|
||||||
|
/* font-size: 20px; */
|
||||||
|
}
|
||||||
|
</style>
|
53
src/views/components/HomePage.vue
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-29 10:01:55
|
||||||
|
* @LastEditTime: 2024-01-07 22:26:39
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description: 首页
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
首页
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'HomePage',
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style scoped lang="less">
|
||||||
|
.workDiv {
|
||||||
|
background-color: #F2F2F2;
|
||||||
|
font-size: 12px;
|
||||||
|
width: 90%;
|
||||||
|
padding: 5px 0 10px 10px;
|
||||||
|
}
|
||||||
|
.swipeDiv {
|
||||||
|
padding: 10px;
|
||||||
|
margin-bottom:20px;
|
||||||
|
text-align: left;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
.my-swipe .van-swipe-item {
|
||||||
|
// color: #fff;
|
||||||
|
// font-size: 20px;
|
||||||
|
// line-height: 150px;
|
||||||
|
margin: 0 10px;
|
||||||
|
text-align: left;
|
||||||
|
// background-color: #39a9ed;
|
||||||
|
}
|
||||||
|
.hello {
|
||||||
|
background-color: #F7F7F7;
|
||||||
|
height: 100%;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
</style>
|
@ -1,4 +1,25 @@
|
|||||||
|
/*
|
||||||
|
* @Author: Do not edit
|
||||||
|
* @Date: 2023-12-27 16:41:40
|
||||||
|
* @LastEditTime: 2024-01-09 10:20:47
|
||||||
|
* @LastEditors: DY
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
const { defineConfig } = require('@vue/cli-service')
|
const { defineConfig } = require('@vue/cli-service')
|
||||||
module.exports = defineConfig({
|
module.exports = defineConfig({
|
||||||
transpileDependencies: true
|
transpileDependencies: true,
|
||||||
|
|
||||||
|
// 配置代理服务器
|
||||||
|
devServer: {
|
||||||
|
// proxy: {
|
||||||
|
// '/api': {
|
||||||
|
// target: 'http://192.168.0.33:48082',
|
||||||
|
// ws: true,
|
||||||
|
// changeOrigin: true,
|
||||||
|
// pathRewrite: {
|
||||||
|
// '^/portapi': ''
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|