初始化
This commit is contained in:
24kycj
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<div style="background:#f0f2f5;margin-top: -20px;">
|
||||
<div class="wscn-http404">
|
||||
<div class="pic-404">
|
||||
<img class="pic-404__parent" :src="img_404" alt="404">
|
||||
<img class="pic-404__child left" :src="img_404_cloud" alt="404">
|
||||
<img class="pic-404__child mid" :src="img_404_cloud" alt="404">
|
||||
<img class="pic-404__child right" :src="img_404_cloud" alt="404">
|
||||
</div>
|
||||
<div class="bullshit">
|
||||
<div class="bullshit__oops">OOPS!</div>
|
||||
<div class="bullshit__info">版权所有<a class="link-type" href="https://wallstreetcn.com" target='_blank'>华尔街见闻</a></div>
|
||||
<div class="bullshit__headline">{{ message }}</div>
|
||||
<div class="bullshit__info">请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告</div>
|
||||
<a href="/" class="bullshit__return-home">返回首页</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import img_404 from '@/assets/404_images/404.png'
|
||||
import img_404_cloud from '@/assets/404_images/404_cloud.png'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
img_404,
|
||||
img_404_cloud
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
message() {
|
||||
return '特朗普说这个页面你不能进......'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.wscn-http404 {
|
||||
position: relative;
|
||||
width: 1200px;
|
||||
margin: 20px auto 60px;
|
||||
padding: 0 100px;
|
||||
overflow: hidden;
|
||||
.pic-404 {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 600px;
|
||||
padding: 150px 0;
|
||||
overflow: hidden;
|
||||
&__parent {
|
||||
width: 100%;
|
||||
}
|
||||
&__child {
|
||||
position: absolute;
|
||||
&.left {
|
||||
width: 80px;
|
||||
top: 17px;
|
||||
left: 220px;
|
||||
opacity: 0;
|
||||
animation-name: cloudLeft;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
&.mid {
|
||||
width: 46px;
|
||||
top: 10px;
|
||||
left: 420px;
|
||||
opacity: 0;
|
||||
animation-name: cloudMid;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1.2s;
|
||||
}
|
||||
&.right {
|
||||
width: 62px;
|
||||
top: 100px;
|
||||
left: 500px;
|
||||
opacity: 0;
|
||||
animation-name: cloudRight;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
@keyframes cloudLeft {
|
||||
0% {
|
||||
top: 17px;
|
||||
left: 220px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 33px;
|
||||
left: 188px;
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
top: 81px;
|
||||
left: 92px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 97px;
|
||||
left: 60px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes cloudMid {
|
||||
0% {
|
||||
top: 10px;
|
||||
left: 420px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 40px;
|
||||
left: 360px;
|
||||
opacity: 1;
|
||||
}
|
||||
70% {
|
||||
top: 130px;
|
||||
left: 180px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 160px;
|
||||
left: 120px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes cloudRight {
|
||||
0% {
|
||||
top: 100px;
|
||||
left: 500px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 120px;
|
||||
left: 460px;
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
top: 180px;
|
||||
left: 340px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 200px;
|
||||
left: 300px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bullshit {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 300px;
|
||||
padding: 150px 0;
|
||||
overflow: hidden;
|
||||
&__oops {
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
line-height: 40px;
|
||||
color: #1482f0;
|
||||
opacity: 0;
|
||||
margin-bottom: 20px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__headline {
|
||||
font-size: 20px;
|
||||
line-height: 24px;
|
||||
color: #1482f0;
|
||||
opacity: 0;
|
||||
margin-bottom: 10px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.1s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__info {
|
||||
font-size: 13px;
|
||||
line-height: 21px;
|
||||
color: grey;
|
||||
opacity: 0;
|
||||
margin-bottom: 30px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.2s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__return-home {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 110px;
|
||||
height: 36px;
|
||||
background: #1482f0;
|
||||
border-radius: 100px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
opacity: 0;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.3s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
@keyframes slideUp {
|
||||
0% {
|
||||
transform: translateY(60px);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,662 @@
|
||||
<template>
|
||||
<div class="dashboard-container">
|
||||
<img class="login_bg" src="@/assets/images/index.png" />
|
||||
<div style="height: 100%; position: relative; display: none;">
|
||||
<div
|
||||
v-if="beginStep && parseInt(currentStep) >= 0 && parseInt(currentStep) < 8"
|
||||
class="bg_box"
|
||||
style="position: absolute; top: 0; left: 0; z-index: 10; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5)"
|
||||
></div>
|
||||
<div style="height: 100%; width: 100%; display: flex">
|
||||
<div :span="3" style="height: 100%; width: 164px">
|
||||
<div class="grid-content bg-purple left">
|
||||
<div class="title">
|
||||
{{ $t('index.wordSpace') }}
|
||||
</div>
|
||||
<!-- @click="() => (printData = index)" -->
|
||||
<div class="card" v-for="item of infoData" :key="item.PrinterID" style="background-color: #f5f5f5; text-align: left">
|
||||
<span style="font-size: 18px; margin-left: 40px">{{ getPrintName(item.PrinterID, true) }}</span>
|
||||
<span style="font-size: 9px">{{ item.PrinterType == '-1' ? $t('index.workspacenodata') : item.PrinterType }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div :span="18" style="height: 100%; width: calc(100% - 328px)">
|
||||
<div class="grid-content bg-purple-light mid" id="rte" style="position: relative">
|
||||
<div class="title" style="position: relative; height: 45px; display: flex; justify-content: space-between">
|
||||
<el-popover v-if="guideStep" :placement="guideStep[0].placement" width="250" trigger="manual" v-model="guideStep[0].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step1`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ parseInt(currentStep) == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="reference" :class="{ guide_body: beginStep && currentStep == 0 }" class="switch" style="position: relative; left: 0; top: 3px">
|
||||
<el-switch active-color="#13ce66" inactive-color="#ff4949" @change="handleOpenSwitch" :value="state"> </el-switch>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-popover v-if="guideStep" :placement="guideStep[1].placement" width="250" trigger="manual" v-model="guideStep[1].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step2`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="reference" :class="{ guide_body: beginStep && currentStep == 1 }" class="information" style="font-size: 15px; display: flex; gap: 25px; position: relative; top: 5px">
|
||||
<div style="display: inline-block">
|
||||
<div style="text-decoration: underline">
|
||||
{{ $t('main.doneCopyNum') }}
|
||||
</div>
|
||||
<div>{{ doneCopyNum }}</div>
|
||||
</div>
|
||||
<div style="display: inline-block">
|
||||
<div style="text-decoration: underline">
|
||||
{{ $t('main.cancelCopyNum') }}
|
||||
</div>
|
||||
<div>{{ cancelCopyNum }}</div>
|
||||
</div>
|
||||
<div style="display: inline-block">
|
||||
<div style="text-decoration: underline">
|
||||
{{ $t('main.failNum') }}
|
||||
</div>
|
||||
<div>{{ failNum }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-popover v-if="guideStep" :placement="guideStep[2].placement" width="250" trigger="manual" v-model="guideStep[2].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step3`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; align-items: center" class="add" slot="reference" :class="{ guide_body: beginStep && currentStep == 2 }">
|
||||
<span style="font-size: 18px; line-height: 45px">{{ $t('main.submitTask') }}</span>
|
||||
<el-popover v-if="guideStep" :placement="guideStep[7].placement" width="250" trigger="manual" v-model="guideStep[7].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step8`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-right: 10px" slot="reference" :class="{ guide_body: beginStep && currentStep == 7 }">
|
||||
<el-button type="primary" @click="newWork" :disabled="infoData.length == 0 && state == false">
|
||||
{{ $t('index.newWork') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</el-popover>
|
||||
|
||||
<el-button type="primary" @click="newNetWork" v-if="false">
|
||||
{{ $t('index.newWork') }}
|
||||
</el-button>
|
||||
<el-button type="primary" @click="openWork()" v-if="true" :disabled="infoData.length == 0 && state == false">
|
||||
{{ $t('admin.openWork') }}
|
||||
</el-button>
|
||||
<!--
|
||||
<el-select v-model="selectLan">
|
||||
<el-option
|
||||
v-for="item in languages"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
</el-option> </el-select
|
||||
>
|
||||
<el-button icon="el-icon-video-play" @click="start_job">启动任务</el-button>
|
||||
<el-button icon="el-icon-video-pause" @click="suspend_job">暂停任务</el-button>
|
||||
<el-button icon="el-icon-circle-close">停止任务</el-button>-->
|
||||
</div>
|
||||
</el-popover>
|
||||
<div class="user">
|
||||
<span style="margin-right: 20px">{{ $t('admin.hello') }} {{ user }}</span>
|
||||
<router-link to="/admin" v-if="isAdmin">{{ $t('main.adminMange') }}</router-link>
|
||||
<router-link to="/">{{ $t('main.out') }}</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<el-popover v-if="guideStep" :placement="guideStep[4].placement" width="250" trigger="manual" v-model="guideStep[4].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step5`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="brief" slot="reference" :class="{ guide_body: beginStep && currentStep == 4 }">
|
||||
<el-row :gutter="20" style="height: 100%">
|
||||
<el-col :span="12" style="height: 100%">
|
||||
<div class="grid-content bg-purple b_left" style="padding-top: 1px !important; display: flex; align-items: center">
|
||||
<!-- <div class="b_title">{{ $t("main.systemInformation") }}</div> -->
|
||||
<div style="display: flex; flex-direction: column; justify-content: center; align-items: center">
|
||||
<img v-if="os.CardsoonModel" :src="os.CardsoonModel.indexOf(`TH80N`) != -1 ? N80N : N800N" width="150" height="95" />
|
||||
<span style="font-weight: bold; font-size: 18px">{{ $t('main.systemInformation') }}</span>
|
||||
</div>
|
||||
<div style="margin-left: 20px">
|
||||
<div class="item">{{ $t('main.deviceType') }}{{ os.CardsoonModel }}</div>
|
||||
<div class="item">{{ $t('main.serialNumber') }}{{ os.SystemSn }}</div>
|
||||
<div class="item">{{ $t('main.hostName') }}{{ os.hostname }}</div>
|
||||
<div class="item">{{ $t('main.hostIp') }}{{ os.ip }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12" style="height: 100%">
|
||||
<div class="grid-content bg-purple b_mid" style="padding-top: 1px !important; display: flex; align-items: center">
|
||||
<div style="display: flex; flex-direction: column; justify-content: center; align-items: center">
|
||||
<span style="font-weight: bold; font-size: 18px">{{ $t('main.hardwareConfiguration') }}</span>
|
||||
</div>
|
||||
<div style="margin-left: 20px">
|
||||
<!-- <div class="item">
|
||||
{{ $t("main.hardwareConfiguration") }}
|
||||
</div> -->
|
||||
<div class="item">{{ $t('main.Cpu') }}{{ os.cpu }}</div>
|
||||
<div class="item">{{ $t('main.Memory') }}{{ os.ram }}</div>
|
||||
<div class="item">{{ $t('main.hardDrive') }}{{ os.HD }}</div>
|
||||
<div class="item">
|
||||
{{ $t('main.cacheSpace') }}：{{ os.remainCacheSpace }} /
|
||||
{{ os.totalCacheSpace }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-popover>
|
||||
<!-- <div
|
||||
class="brief"
|
||||
v-if="infoData.length != 0 && false"
|
||||
style="margin-top: 20px; height: 200px"
|
||||
>
|
||||
<el-row :gutter="10" style="height: 100%">
|
||||
<el-col :span="6" style="height: 100%">
|
||||
<div
|
||||
class="grid-content bg-purple b_left"
|
||||
style="padding-top: 1px !important"
|
||||
>
|
||||
<div class="b_title">
|
||||
{{ $t("index.systemState") }}
|
||||
</div>
|
||||
<div style="margin-top: 30px">
|
||||
<div class="item">
|
||||
{{ $t("index.wordSpaceOnline")
|
||||
}}{{
|
||||
printerStatus[infoData[printData].PrinterID]
|
||||
? $t(
|
||||
`index.${
|
||||
printerStatus[infoData[printData].PrinterID]
|
||||
}`
|
||||
)
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
<div class="item">
|
||||
{{ $t("index.equipModel")
|
||||
}}{{ infoData[printData].ModeName.replace("Fagoo", "") }}
|
||||
</div>
|
||||
<div class="item">
|
||||
{{ $t("index.series") }}{{ infoData[printData].SerialNo }}
|
||||
</div>
|
||||
<div class="item">
|
||||
{{ $t("index.machineVers")
|
||||
}}{{ infoData[printData].FirewareVersion }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="5" style="height: 100%">
|
||||
<div
|
||||
class="grid-content bg-purple b_left"
|
||||
style="padding-top: 1px !important; border-right: 0"
|
||||
>
|
||||
<div class="b_title"></div>
|
||||
<div style="margin-top: 30px">
|
||||
<div class="item">
|
||||
{{ $t("index.numbers") }}{{ infoData[printData].CardNum }}
|
||||
</div>
|
||||
<div class="item">
|
||||
{{ $t("index.dice")
|
||||
}}{{
|
||||
infoData[printData].DualSide == 1
|
||||
? this.$t("index.twoDice")
|
||||
: this.infoData[printData] != null
|
||||
? this.$t("index.sigleDice")
|
||||
: ""
|
||||
}}
|
||||
</div>
|
||||
<div class="item">
|
||||
{{ $t("index.ribbonType")
|
||||
}}{{ infoData[printData].RibbonType }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="5" style="height: 100%">
|
||||
<div
|
||||
class="grid-content bg-purple b_mid"
|
||||
style="
|
||||
padding-top: 1px !important;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<el-progress
|
||||
type="circle"
|
||||
:format="ribbonFormat"
|
||||
:key="printData"
|
||||
width="75"
|
||||
:percentage="
|
||||
infoData[printData].RibbonAmount == undefined ||
|
||||
infoData[printData].RibbonAmount == '0'
|
||||
? 0
|
||||
: (
|
||||
(infoData[printData].RibbonAmount /
|
||||
getRibbonAmount) *
|
||||
100
|
||||
).toFixed(0)
|
||||
"
|
||||
:color="'#67C23A'"
|
||||
></el-progress>
|
||||
|
||||
<div style="margin-left: 20px">
|
||||
<div>{{ $t("index.ribbonNumber") }}</div>
|
||||
<div>
|
||||
{{ infoData[printData].RibbonAmount }}/{{
|
||||
getRibbonAmount
|
||||
}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" style="height: 100%">
|
||||
<div
|
||||
class="grid-content bg-purple b_mid"
|
||||
style="
|
||||
padding-top: 1px !important;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<el-progress
|
||||
type="circle"
|
||||
:key="printData"
|
||||
:format="remaCapaFormat"
|
||||
width="75"
|
||||
:percentage="
|
||||
infoData[printData].PrinterRemaCapa == undefined ||
|
||||
infoData[printData].PrinterRemaCapa == '0'
|
||||
? 0
|
||||
: (
|
||||
(infoData[printData].PrinterRemaCapa /
|
||||
getPrinterRemaCapaAmount) *
|
||||
100
|
||||
).toFixed(0)
|
||||
"
|
||||
:color="'#67C23A'"
|
||||
></el-progress>
|
||||
<div style="margin-left: 20px">
|
||||
<div>
|
||||
{{ $t("index.inCardState") }}
|
||||
</div>
|
||||
<div>
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
size="mini"
|
||||
@click="() => printerTypeChange('auto')"
|
||||
>{{ $t("index.autoRefresh") }}</el-button
|
||||
>
|
||||
<el-dropdown @command="handleTypeCommand">
|
||||
<el-button type="primary" size="mini"
|
||||
>{{ $t("index.refreshMore")
|
||||
}}<i class="el-icon-arrow-down el-icon--right"></i
|
||||
></el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item
|
||||
v-for="item in _PrinterTypeList"
|
||||
:command="item.value"
|
||||
>{{ item.label }}</el-dropdown-item
|
||||
>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</el-button-group>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div> -->
|
||||
<el-popover v-if="guideStep" :placement="guideStep[5].placement" width="250" trigger="manual" v-model="guideStep[5].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step6`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="reference" :class="{ guide_body: beginStep && currentStep == 5 }" class="machines work" style="height: 130px; margin-top: 10px">
|
||||
<el-table :data="infoData" max-height="180" size="mini" style="width: 100%" :empty-text="$t('index.nodata')" row-class-name="rowclass">
|
||||
<el-table-column prop="gzz" :label="$t('main.tableMachine')" min-width="100">
|
||||
<template slot-scope="scope">
|
||||
{{ getPrintName(scope.row.PrinterID, true) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" :label="$t('main.tableState')" min-width="80">
|
||||
<template slot-scope="scope">{{ $t('main.tableOnline') }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="SerialNo" :label="$t('main.tableSerialNo')" min-width="80"> </el-table-column>
|
||||
<el-table-column prop="RibbonType" :label="$t('main.tableRibbonType')" min-width="80"> </el-table-column>
|
||||
<el-table-column prop="RibbonAmount" :label="$t('main.tableRibbonAmount')" min-width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-progress
|
||||
:color="customColors"
|
||||
:width="45"
|
||||
define-back-color="#ebeef5"
|
||||
:format="() => scope.row.RibbonAmount"
|
||||
:stroke-width="3"
|
||||
:percentage="
|
||||
scope.row.RibbonAmount == undefined || scope.row.RibbonAmount == '0'
|
||||
? 0
|
||||
: parseFloat(((scope.row.RibbonAmount / getRibbonAmount(scope.row.ModeName, scope.row.RibbonType)) * 100).toFixed(0))
|
||||
"
|
||||
></el-progress>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="PrinterType" :label="$t('main.tablePrinterType')" min-width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-dropdown trigger="click" @command="(e) => handleMachineCommand(e, scope.row.PrinterID)">
|
||||
<span class="el-dropdown-link" style="color: #000; font-size: 12px"> {{ scope.row.PrinterType }}<i class="el-icon-arrow-down el-icon--right"></i> </span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="auto">
|
||||
<span style="color: #000; font-size: 12px">{{ $t('main.autoSetting') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="null">
|
||||
<span style="color: #000; font-size: 12px">{{ $t('main.cancelSetting') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item v-for="item in _PrinterTypeList" :key="item.value" :command="item.value">
|
||||
<span style="color: #000; font-size: 12px">{{ item.label }}</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="PrinterRemaCapa" :label="$t('main.tablePrinterRemaCapa')" min-width="100">
|
||||
<template slot-scope="scope">
|
||||
<el-progress
|
||||
:color="customColors"
|
||||
:width="45"
|
||||
define-back-color="#ebeef5"
|
||||
:format="() => (scope.row.PrinterRemaCapa > 0 ? scope.row.PrinterRemaCapa : 0)"
|
||||
:stroke-width="3"
|
||||
:percentage="
|
||||
scope.row.PrinterRemaCapa == undefined || scope.row.PrinterRemaCapa == '0'
|
||||
? 0
|
||||
: parseFloat((((scope.row.PrinterRemaCapa > 0 ? scope.row.PrinterRemaCapa : 0) / getPrinterRemaCapaAmount(scope.row.ModeName)) * 100).toFixed(0))
|
||||
"
|
||||
></el-progress>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-popover v-if="guideStep" :placement="guideStep[6].placement" width="250" trigger="manual" v-model="guideStep[6].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step7`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div slot="reference" :class="{ guide_body: beginStep && currentStep == 6 }">
|
||||
<el-tabs v-model="activeName" style="background-color: #fff; padding-bottom: 20px; max-height: 240px; margin-top: 10px 20px">
|
||||
<el-tab-pane :label="$t(`index.workList`)" name="first">
|
||||
<div class="work">
|
||||
<el-table :data="tasks" max-height="180" style="width: 100%" size="mini" :empty-text="$t('index.nodata')" row-class-name="rowclass">
|
||||
<el-table-column label="#" min-width="38">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index + 1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="jId" :label="$t('index.wordID')" min-width="130"> </el-table-column>
|
||||
<el-table-column prop="DataSource" :label="$t('index.wordOrigin')" min-width="85"> </el-table-column>
|
||||
<el-table-column :label="$t('index.wordSpace')" min-width="60">
|
||||
<template slot-scope="scope">
|
||||
{{ getPrintName(scope.row.PrinterID, true) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('main.USBType')" min-width="90">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.PrinterType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column min-width="80" prop="TaskCapacity" :label="$t('main.TaskCapacity')"> </el-table-column>
|
||||
<el-table-column v-if="false" prop="DataDir" :label="$t('main.taskFile')"> </el-table-column>
|
||||
<el-table-column prop="CreateTime" :label="$t('index.createTime')" min-width="120"> </el-table-column>
|
||||
<el-table-column
|
||||
v-if="false"
|
||||
prop="usb_version"
|
||||
:label="$t('main.USBVersion')"
|
||||
:filters="[
|
||||
{ text: '2.0', value: 2 },
|
||||
{ text: '3.0', value: 3 }
|
||||
]"
|
||||
:filter-method="filterHandler"
|
||||
>
|
||||
</el-table-column>
|
||||
<el-table-column prop="FinishTime" :label="$t('index.finishedTime')" min-width="120"> </el-table-column>
|
||||
<el-table-column prop="JobCompletion" min-width="60" :label="$t('index.finishedNumber')"> </el-table-column>
|
||||
<el-table-column :label="$t('index.state')" prop="JobStatus" width="110">
|
||||
<template slot-scope="scope">
|
||||
<el-dropdown trigger="click" @command="(e) => handleTaskCommand(e, scope.row.JobID)" :disabled="scope.row.JobStatus != 'Fail'">
|
||||
<span class="el-dropdown-link" style="color: #000; font-size: 12px">
|
||||
{{ jobState(scope.row.JobStatus) }}
|
||||
<i class="el-icon-arrow-down el-icon--right" v-if="scope.row.JobStatus == 'Fail'"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item command="refresh">
|
||||
<span style="color: #000; font-size: 12px">{{ $t('main.commandRefresh') }}</span>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item command="delete">
|
||||
<span style="color: #000; font-size: 12px">{{ $t('main.commandDelete') }}</span>
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-progress
|
||||
:color="customColors"
|
||||
:width="45"
|
||||
define-back-color="#ebeef5"
|
||||
:stroke-width="3"
|
||||
:percentage="parseFloat(scope.row.TaskPercentage.replace(`%`, ``))"
|
||||
v-if="scope.row.JobStatus == `Copying`"
|
||||
></el-progress>
|
||||
<!-- <el-button
|
||||
style="margin-left: 5px; height: 30px; width: 30px"
|
||||
icon="el-icon-refresh"
|
||||
circle
|
||||
v-if="scope.row.JobStatus == 'Fail'"
|
||||
@click="restart_job(scope.$index)"
|
||||
type="primary"
|
||||
size="mini"
|
||||
>
|
||||
</el-button>
|
||||
<el-button
|
||||
style="margin-left: 5px; height: 30px; width: 30px"
|
||||
icon="el-icon-delete"
|
||||
circle
|
||||
v-if="scope.row.JobStatus == 'Fail'"
|
||||
@click="remove_job(scope.$index)"
|
||||
type="danger"
|
||||
size="mini"
|
||||
>
|
||||
</el-button>
|
||||
<el-button
|
||||
style="margin-left: 5px; height: 30px; width: 30px"
|
||||
icon="el-icon-video-pause"
|
||||
circle
|
||||
v-else-if="scope.row.JobStatus == 'Printing'"
|
||||
@click="suspend_job(scope.$index)"
|
||||
type="primary"
|
||||
size="mini"
|
||||
>
|
||||
</el-button>
|
||||
<el-button
|
||||
style="margin-left: 5px; height: 30px; width: 30px"
|
||||
icon="el-icon-video-play"
|
||||
circle
|
||||
v-else-if="scope.row.JobStatus == '暂停'"
|
||||
@click="start_job(scope.$index)"
|
||||
type="primary"
|
||||
>
|
||||
</el-button> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!--<el-table-column prop="process" label="进度">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="info"
|
||||
label="信息">
|
||||
</el-table-column>-->
|
||||
</el-table>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="$t(`index.curLog`)" name="second">
|
||||
<div class="work">
|
||||
<div class="w_title">
|
||||
<div class="w_right">
|
||||
<el-button type="text" icon="el-icon-document-copy" v-if="isAdmin" @click="getWLogData()">
|
||||
{{ $t('index.openHistoryLog') }}
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="c_log" v-html="log"></div></div
|
||||
></el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</el-popover>
|
||||
<s-footer></s-footer>
|
||||
</div>
|
||||
</div>
|
||||
<div :span="3" style="height: 100%; width: 164px">
|
||||
<div class="grid-content bg-purple right" style="overflow: hidden">
|
||||
<el-popover v-if="guideStep" :placement="guideStep[3].placement" width="250" trigger="manual" v-model="guideStep[3].show">
|
||||
<div class="guide_box">
|
||||
<div class="guide_title">
|
||||
{{ $t('guide.title') }}<span>（{{ parseInt(currentStep) + 1 }}/{{ guideStep.length }}）</span>
|
||||
</div>
|
||||
<div class="guide_desc">{{ $t(`guide.step4`) }}</div>
|
||||
<div class="guide_btns">
|
||||
<el-button @click="exitGuide" class="guide_btn1" size="mini" type="text">{{ $t('guide.skip') }}</el-button>
|
||||
<el-button v-if="parseInt(currentStep) > 0" @click="prevStep" class="guide_btn1" size="mini">{{ $t('guide.prev') }}</el-button>
|
||||
<el-button @click="nextStep" class="guide_btn2" size="mini" type="primary">{{ currentStep == guideStep.length - 1 ? $t('guide.complete') : $t('guide.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title" slot="reference" :class="{ guide_body: beginStep && currentStep == 3 }">
|
||||
{{ $t('index.notice') }}
|
||||
<!--<div class="log" v-for="(item, index) of infoData.sysLogs">
|
||||
{{ item }}
|
||||
</div>-->
|
||||
</div>
|
||||
</el-popover>
|
||||
|
||||
<warnCard v-for="item of errList" :data="item" @ok="okWarning" v-if="item.show" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="dialogVisible">
|
||||
<el-dialog :visible.sync="dialogVisible" width="1200px" :destroy-on-close="true" :close-on-click-modal="false" :title="$t('index.newWork')">
|
||||
<work
|
||||
:dice="DualSide == 1 ? 2 : 1"
|
||||
@jobPost="closeWork"
|
||||
@addError="addError"
|
||||
:isNew="isNew"
|
||||
:saveWorkList="saveWorkList"
|
||||
:printerList="infoData"
|
||||
:shareDisk="shareDisk"
|
||||
:isCopy="isLocal"
|
||||
:filterPassedType="filterPassedType"
|
||||
:sizeType="_PrinterTypeList"
|
||||
>
|
||||
</work>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<div v-if="dialogNetVisible">
|
||||
<el-dialog :visible.sync="dialogNetVisible" width="1200px" :destroy-on-close="true" :close-on-click-modal="false" :title="$t('index.newWork')">
|
||||
<worknet :dice="DualSide == 1 ? 2 : 1" @jobPost="closeNetWork" :printerList="infoData"> </worknet>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<el-dialog :title="$t('index.entireLog')" :visible.sync="dialogWholeLog">
|
||||
<div class="wLog" v-html="wlog" style="text-align: left"></div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 开始用户引导 -->
|
||||
<el-dialog class="guide_dialog" top="30vh" :show-close="false" title="温馨提示" :visible.sync="showStep" width="350px" :close-on-click-modal="false">
|
||||
<div class="start_box">
|
||||
<div class="start_content">欢迎使用卡树自动拷贝打印系统，我们将引导您使用本系统，请您耐心接受引导</div>
|
||||
<div class="start_hide">
|
||||
<el-checkbox v-model="hideStep">我已熟悉系统，不再显示引导</el-checkbox>
|
||||
</div>
|
||||
<div class="start_btn">
|
||||
<el-button @click="startStep" type="primary">开始引导</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'dashboard',
|
||||
computed: {
|
||||
...mapGetters(['name', 'roles'])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
.dashboard-container {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
.login_bg {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<div class="login-container">
|
||||
<img class="login_bg" src="@/assets/images/login_bg.png" />
|
||||
<div class="flex_box form_box">
|
||||
<el-form class="flex_box flex_col flex_row_center login-form" autoComplete="on" :model="loginForm" :rules="loginRules" ref="loginForm" label-position="left">
|
||||
<img class="login_logo" src="@/assets/images/logo.png" />
|
||||
<div class="login_box">
|
||||
<div class="login_title">用户登录</div>
|
||||
<div class="login_label">用户名</div>
|
||||
<el-form-item prop="username">
|
||||
<el-input name="username" type="text" v-model="loginForm.username" autoComplete="on" placeholder="username" />
|
||||
</el-form-item>
|
||||
<div class="login_label">密码</div>
|
||||
<el-form-item prop="password">
|
||||
<el-input name="password" :type="pwdType" @keyup.enter.native="handleLogin" v-model="loginForm.password" autoComplete="on"
|
||||
placeholder="password"></el-input>
|
||||
<span class="show-pwd" @click="showPwd">
|
||||
|
||||
</span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<div class="login_check">
|
||||
<el-checkbox v-model="isChecked">记住账号密码</el-checkbox>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button class="login_btn" type="primary" :loading="loading" @click.native.prevent="handleLogin">{{ $t('login.logIn') }}</el-button>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { validUsername } from '@/utils/validate'
|
||||
|
||||
export default {
|
||||
name: 'login',
|
||||
data() {
|
||||
const validateUsername = (rule, value, callback) => {
|
||||
if (!validUsername(value)) {
|
||||
callback(new Error('请输入正确的用户名'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validatePass = (rule, value, callback) => {
|
||||
if (!value) {
|
||||
callback(new Error('请输入您的密码'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
loginForm: {
|
||||
username: 'admin',
|
||||
password: 'admin'
|
||||
},
|
||||
loginRules: {
|
||||
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
||||
password: [{ required: true, trigger: 'blur', validator: validatePass }]
|
||||
},
|
||||
isChecked: true,
|
||||
loading: false,
|
||||
pwdType: 'password'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showPwd() {
|
||||
if (this.pwdType === 'password') {
|
||||
this.pwdType = ''
|
||||
} else {
|
||||
this.pwdType = 'password'
|
||||
}
|
||||
},
|
||||
handleLogin() {
|
||||
this.$refs.loginForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
this.$store.dispatch('Login', this.loginForm).then(() => {
|
||||
this.loading = false
|
||||
this.$router.push({ path: '/' })
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss">
|
||||
$bg:#F1F1F1;
|
||||
$light_gray:#000000;
|
||||
|
||||
/* reset element-ui css */
|
||||
.login-container {
|
||||
.el-input {
|
||||
display: inline-block;
|
||||
height: 60px;
|
||||
border-radius: 30px;
|
||||
width: 100%;
|
||||
background: #F1F1F1;
|
||||
border-radius: 30px;
|
||||
color: #000;
|
||||
input {
|
||||
background: transparent;
|
||||
border: 0px;
|
||||
-webkit-appearance: none;
|
||||
padding: 12px 5px 12px 15px;
|
||||
color: $light_gray;
|
||||
height: 60px;
|
||||
font-size: 24px;
|
||||
border-radius: 30px;
|
||||
&:-webkit-autofill {
|
||||
border-radius: 30px;
|
||||
-webkit-box-shadow: 0 0 0px 1000px $bg inset !important;
|
||||
-webkit-text-fill-color: #000 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
$bg:#F1F1F1;
|
||||
$dark_gray:#889aa4;
|
||||
$light_gray:#eee;
|
||||
.login-container {
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
.login_bg {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
.form_box {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 9;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 0 0 120px;
|
||||
}
|
||||
.login-form {
|
||||
height: 100%;
|
||||
.login_logo {
|
||||
width: 844px;
|
||||
height: 158px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.login_box {
|
||||
width: 450px;
|
||||
background-color: #fff;
|
||||
border-radius: 24px;
|
||||
padding: 48px;
|
||||
.login_title {
|
||||
font-weight: 500;
|
||||
font-size: 30px;
|
||||
color: #00C325;
|
||||
line-height: 44px;
|
||||
text-align: center;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.login_label {
|
||||
font-size: 24px;
|
||||
color: #B2B2B2;
|
||||
line-height: 36px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.login_check {
|
||||
::v-deep {
|
||||
.el-checkbox__inner {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner {
|
||||
background-color: #00C325;
|
||||
border-color: #00C325;
|
||||
}
|
||||
.el-checkbox__inner::after {
|
||||
width: 6px;
|
||||
height: 14px;
|
||||
left: 8px;
|
||||
}
|
||||
.el-checkbox__label {
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
}
|
||||
.el-checkbox__input.is-checked+.el-checkbox__label {
|
||||
color: #00C325;
|
||||
}
|
||||
}
|
||||
}
|
||||
.login_btn {
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
background: #F1F1F1;
|
||||
border-radius: 33px;
|
||||
border: 3px solid #00BCC3;
|
||||
font-size: 24px;
|
||||
color: #00BCC3;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tips {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
margin-bottom: 10px;
|
||||
span {
|
||||
&:first-of-type {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.svg-container {
|
||||
padding: 6px 5px 6px 15px;
|
||||
color: $dark_gray;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
&_login {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
font-size: 26px;
|
||||
font-weight: 400;
|
||||
color: $light_gray;
|
||||
margin: 0px auto 40px auto;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
.show-pwd {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 7px;
|
||||
font-size: 16px;
|
||||
color: $dark_gray;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user