基础功能好用
This commit is contained in:
zhangshun
@@ -28,7 +28,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
devServer: {
|
devServer: {
|
||||||
https: true,
|
https: false,
|
||||||
historyApiFallback: true,
|
historyApiFallback: true,
|
||||||
hot: true,
|
hot: true,
|
||||||
compress: true,
|
compress: true,
|
||||||
|
|||||||
BIN
favicon.ico
BIN
favicon.ico
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB After Width: | Height: | Size: 4.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 6.0 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 139 KiB After Width: | Height: | Size: 6.0 KiB |
BIN
src/assets/img/logo1.png
Normal file
BIN
src/assets/img/logo1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
@@ -2,10 +2,10 @@
|
|||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="7">
|
<el-col :span="7">
|
||||||
<el-card style="margin-bottom: 10px">
|
<!-- <el-card style="margin-bottom: 10px">-->
|
||||||
<el-button size="small" type="distribution" @click="addFisrtLevel">创建一级菜单</el-button>
|
<!-- <el-button size="small" type="distribution" @click="addFisrtLevel">创建一级菜单</el-button>-->
|
||||||
</el-card>
|
<!-- </el-card>-->
|
||||||
<el-card>
|
<el-card style="height: 550px">
|
||||||
<div slot="header">
|
<div slot="header">
|
||||||
<el-input v-model="filterTextLeft" clearable placeholder="输入关键字进行过滤" size="small"/>
|
<el-input v-model="filterTextLeft" clearable placeholder="输入关键字进行过滤" size="small"/>
|
||||||
</div>
|
</div>
|
||||||
@@ -16,7 +16,6 @@
|
|||||||
highlight-current-row
|
highlight-current-row
|
||||||
size="mini"
|
size="mini"
|
||||||
stripe
|
stripe
|
||||||
style="height:calc(100vh - 330px);"
|
|
||||||
@selection-change="handleSelectionChangeLeft">
|
@selection-change="handleSelectionChangeLeft">
|
||||||
<el-table-column :selectable="selectable" align="center" type="selection" width="55"/>
|
<el-table-column :selectable="selectable" align="center" type="selection" width="55"/>
|
||||||
<el-table-column align="center" type="index" width="60"/>
|
<el-table-column align="center" type="index" width="60"/>
|
||||||
@@ -40,25 +39,26 @@
|
|||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="8">
|
<el-col :span="8">
|
||||||
<el-card style="margin-bottom: 10px">
|
<!-- <el-card style="margin-bottom: 10px">-->
|
||||||
<span>角色:</span>
|
<!-- -->
|
||||||
<el-select
|
<!-- </el-card>-->
|
||||||
v-model="roleName"
|
<el-card style="height: 550px">
|
||||||
filterable
|
|
||||||
placeholder="请选择"
|
|
||||||
size="small"
|
|
||||||
style="width:200px;margin-left:10px"
|
|
||||||
@change="getModule">
|
|
||||||
<el-option
|
|
||||||
v-for="item in roleNames"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"/>
|
|
||||||
</el-select>
|
|
||||||
</el-card>
|
|
||||||
<el-card style="height: 550px;overflow: auto">
|
|
||||||
<div slot="header">
|
<div slot="header">
|
||||||
<el-input v-model="filterText" clearable placeholder="输入关键字进行过滤" size="small"/>
|
<span>角色:</span>
|
||||||
|
<el-select
|
||||||
|
v-model="roleName"
|
||||||
|
filterable
|
||||||
|
placeholder="请选择"
|
||||||
|
size="small"
|
||||||
|
style="width:150px;margin-left:10px"
|
||||||
|
@change="getModule">
|
||||||
|
<el-option
|
||||||
|
v-for="item in roleNames"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"/>
|
||||||
|
</el-select>
|
||||||
|
<el-input v-model="filterText" clearable placeholder="输入关键字进行过滤" size="small" style="width:200px;margin-left:10px"/>
|
||||||
</div>
|
</div>
|
||||||
<el-tree
|
<el-tree
|
||||||
ref="moduleTree"
|
ref="moduleTree"
|
||||||
@@ -109,13 +109,13 @@
|
|||||||
</el-tooltip>
|
</el-tooltip>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="7">
|
<el-col :span="7">
|
||||||
<el-card style="margin-bottom: 10px">
|
<!-- <el-card style="margin-bottom: 10px">-->
|
||||||
<el-button size="small" type="distribution" @click="addSecondLevel">创建二级菜单</el-button>
|
<!-- <el-button size="small" type="distribution" @click="addSecondLevel">创建二级菜单</el-button>-->
|
||||||
<el-button size="small" style="float: right" type="success" @click="RoleNameasdShow=!RoleNameasdShow">
|
<!-- <el-button size="small" style="float: right" type="success" @click="RoleNameasdShow=!RoleNameasdShow">-->
|
||||||
模块分配情况
|
<!-- 模块分配情况-->
|
||||||
</el-button>
|
<!-- </el-button>-->
|
||||||
</el-card>
|
<!-- </el-card>-->
|
||||||
<el-card>
|
<el-card style="height: 550px;">
|
||||||
<div slot="header">
|
<div slot="header">
|
||||||
<el-input v-model="filterTextRight" clearable placeholder="输入关键字进行过滤" size="small"/>
|
<el-input v-model="filterTextRight" clearable placeholder="输入关键字进行过滤" size="small"/>
|
||||||
</div>
|
</div>
|
||||||
@@ -126,7 +126,6 @@
|
|||||||
highlight-current-row
|
highlight-current-row
|
||||||
size="mini"
|
size="mini"
|
||||||
stripe
|
stripe
|
||||||
style="height:calc(100vh - 330px);"
|
|
||||||
@selection-change="handleSelectionChangeRight">
|
@selection-change="handleSelectionChangeRight">
|
||||||
<el-table-column :selectable="selectable" align="center" type="selection" width="55"/>
|
<el-table-column :selectable="selectable" align="center" type="selection" width="55"/>
|
||||||
<el-table-column align="center" type="index" width="60"/>
|
<el-table-column align="center" type="index" width="60"/>
|
||||||
|
|||||||
@@ -107,6 +107,7 @@
|
|||||||
align="center"
|
align="center"
|
||||||
type="selection"
|
type="selection"
|
||||||
width="50"/>
|
width="50"/>
|
||||||
|
<el-table-column align="center" type="index" label="序号" />
|
||||||
<!--<el-table-column align="center" label="照片" width="200">-->
|
<!--<el-table-column align="center" label="照片" width="200">-->
|
||||||
<!-- <template slot-scope="scope">-->
|
<!-- <template slot-scope="scope">-->
|
||||||
<!-- <el-popover-->
|
<!-- <el-popover-->
|
||||||
@@ -170,11 +171,11 @@
|
|||||||
<!-- {{ scope.row.身份证号 }}-->
|
<!-- {{ scope.row.身份证号 }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- </el-table-column>-->
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="学历" width="100">
|
<!-- <el-table-column align="center" label="学历" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.学历名称 }}
|
<!-- {{ scope.row.学历名称 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<!-- <el-table-column align="center" label="入职时间" width="100">-->
|
<!-- <el-table-column align="center" label="入职时间" width="100">-->
|
||||||
<!-- <template slot-scope="scope">-->
|
<!-- <template slot-scope="scope">-->
|
||||||
<!-- {{-->
|
<!-- {{-->
|
||||||
@@ -189,16 +190,16 @@
|
|||||||
<!-- }}-->
|
<!-- }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- </el-table-column>-->
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="联系方式" width="110">
|
<!-- <el-table-column align="center" label="联系方式" width="110">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.联系电话 }}
|
<!-- {{ scope.row.联系电话 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="班组" width="110">
|
<!-- <el-table-column align="center" label="班组" width="110">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.班组名称 }}
|
<!-- {{ scope.row.班组名称 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<!-- <el-table-column align="center" label="民族" width="100">-->
|
<!-- <el-table-column align="center" label="民族" width="100">-->
|
||||||
<!-- <template slot-scope="scope">-->
|
<!-- <template slot-scope="scope">-->
|
||||||
<!-- {{ scope.row.民族 }}-->
|
<!-- {{ scope.row.民族 }}-->
|
||||||
@@ -209,7 +210,7 @@
|
|||||||
<!-- {{ scope.row.家庭住址 }}-->
|
<!-- {{ scope.row.家庭住址 }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- </el-table-column>-->
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" fixed="right" label="操作" width="150">
|
<el-table-column align="center" label="操作" width="150">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<!-- <el-button-->
|
<!-- <el-button-->
|
||||||
<!-- :disabled="scope.row.文件标识 && scope.row.文件标识 !== 'null'"-->
|
<!-- :disabled="scope.row.文件标识 && scope.row.文件标识 !== 'null'"-->
|
||||||
@@ -287,7 +288,7 @@
|
|||||||
:visible.sync="people_DFV"
|
:visible.sync="people_DFV"
|
||||||
center
|
center
|
||||||
style="min-height: 200px"
|
style="min-height: 200px"
|
||||||
width="800px">
|
width="400px">
|
||||||
<el-form
|
<el-form
|
||||||
ref="people_form"
|
ref="people_form"
|
||||||
:model="people_form"
|
:model="people_form"
|
||||||
@@ -296,90 +297,86 @@
|
|||||||
label-position="left"
|
label-position="left"
|
||||||
label-width="110px">
|
label-width="110px">
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-form-item label="姓名" prop="Name">
|
||||||
<el-form-item label="工号" prop="AccountNumber">
|
<el-input v-model="people_form.Name" size="small" style="width:200px"/>
|
||||||
<el-input v-model="people_form.AccountNumber" size="small" style="width:200px"/>
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="工号" prop="AccountNumber">
|
||||||
</el-col>
|
<el-input v-model="people_form.AccountNumber" size="small" style="width:200px"/>
|
||||||
<el-col :span="12">
|
</el-form-item>
|
||||||
<el-form-item label="密码" prop="Password">
|
<el-form-item label="密码" prop="Password">
|
||||||
<el-input v-model="people_form.Password" size="small" style="width:200px"/>
|
<el-input v-model="people_form.Password" size="small" style="width:200px"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
|
||||||
<el-col :span="12">
|
|
||||||
<el-form-item label="姓名" prop="Name">
|
<!-- <el-col :span="12">-->
|
||||||
<el-input v-model="people_form.Name" size="small" style="width:200px"/>
|
<!-- <el-form-item label="性别" prop="Sex">-->
|
||||||
</el-form-item>
|
<!-- <el-select v-model="people_form.Sex" clearable placeholder="请选择性别" size="small" style="width: 200px">-->
|
||||||
</el-col>
|
<!-- <el-option-->
|
||||||
<el-col :span="12">
|
<!-- v-for="item in SexData"-->
|
||||||
<el-form-item label="性别" prop="Sex">
|
<!-- :key="item.value"-->
|
||||||
<el-select v-model="people_form.Sex" clearable placeholder="请选择性别" size="small" style="width: 200px">
|
<!-- :label="item.label"-->
|
||||||
<el-option
|
<!-- :value="item.value"/>-->
|
||||||
v-for="item in SexData"
|
<!-- </el-select>-->
|
||||||
:key="item.value"
|
<!-- </el-form-item>-->
|
||||||
:label="item.label"
|
<!-- </el-col>-->
|
||||||
:value="item.value"/>
|
<!-- <el-col :span="12">-->
|
||||||
</el-select>
|
<!-- <el-form-item label="出生日期" prop="Birthday">-->
|
||||||
</el-form-item>
|
<!-- <el-date-picker-->
|
||||||
</el-col>
|
<!-- v-model="people_form.Birthday"-->
|
||||||
<el-col :span="12">
|
<!-- placeholder="请选择出生日期"-->
|
||||||
<el-form-item label="出生日期" prop="Birthday">
|
<!-- size="small"-->
|
||||||
<el-date-picker
|
<!-- style="width: 200px"-->
|
||||||
v-model="people_form.Birthday"
|
<!-- type="date"-->
|
||||||
placeholder="请选择出生日期"
|
<!-- value-format="yyyy-MM-dd"/>-->
|
||||||
size="small"
|
<!-- </el-form-item>-->
|
||||||
style="width: 200px"
|
<!-- </el-col>-->
|
||||||
type="date"
|
<!-- <el-col :span="12">-->
|
||||||
value-format="yyyy-MM-dd"/>
|
<!-- <el-form-item label="身份证号" prop="IDcard">-->
|
||||||
</el-form-item>
|
<!-- <el-input v-model="people_form.IDcard" size="small" style="width:200px"/>-->
|
||||||
</el-col>
|
<!-- </el-form-item>-->
|
||||||
<el-col :span="12">
|
<!-- </el-col>-->
|
||||||
<el-form-item label="身份证号" prop="IDcard">
|
<!-- <el-col :span="12">-->
|
||||||
<el-input v-model="people_form.IDcard" size="small" style="width:200px"/>
|
<!-- <el-form-item label="入职时间" prop="TimeOfEntry">-->
|
||||||
</el-form-item>
|
<!-- <el-date-picker-->
|
||||||
</el-col>
|
<!-- v-model="people_form.TimeOfEntry"-->
|
||||||
<el-col :span="12">
|
<!-- placeholder="请选择入职时间"-->
|
||||||
<el-form-item label="入职时间" prop="TimeOfEntry">
|
<!-- size="small"-->
|
||||||
<el-date-picker
|
<!-- style="width: 200px"-->
|
||||||
v-model="people_form.TimeOfEntry"
|
<!-- type="date"-->
|
||||||
placeholder="请选择入职时间"
|
<!-- value-format="yyyy-MM-dd"/>-->
|
||||||
size="small"
|
<!-- </el-form-item>-->
|
||||||
style="width: 200px"
|
<!-- </el-col>-->
|
||||||
type="date"
|
<!-- <el-col :span="12">-->
|
||||||
value-format="yyyy-MM-dd"/>
|
<!-- <el-form-item label="联系方式" prop="ContactInformation">-->
|
||||||
</el-form-item>
|
<!-- <el-input v-model="people_form.ContactInformation" size="small" style="width:200px"/>-->
|
||||||
</el-col>
|
<!-- </el-form-item>-->
|
||||||
<el-col :span="12">
|
<!-- </el-col>-->
|
||||||
<el-form-item label="联系方式" prop="ContactInformation">
|
<!-- <el-col :span="12">-->
|
||||||
<el-input v-model="people_form.ContactInformation" size="small" style="width:200px"/>
|
<!-- <el-form-item label="学历" prop="Education">-->
|
||||||
</el-form-item>
|
<!-- <el-select-->
|
||||||
</el-col>
|
<!-- v-model="people_form.Education"-->
|
||||||
<el-col :span="12">
|
<!-- clearable-->
|
||||||
<el-form-item label="学历" prop="Education">
|
<!-- placeholder="请选择学历"-->
|
||||||
<el-select
|
<!-- size="small"-->
|
||||||
v-model="people_form.Education"
|
<!-- style="width: 200px">-->
|
||||||
clearable
|
<!-- <el-option-->
|
||||||
placeholder="请选择学历"
|
<!-- v-for="item in EducationDate"-->
|
||||||
size="small"
|
<!-- :key="item.value"-->
|
||||||
style="width: 200px">
|
<!-- :label="item.label"-->
|
||||||
<el-option
|
<!-- :value="item.value"/>-->
|
||||||
v-for="item in EducationDate"
|
<!-- </el-select>-->
|
||||||
:key="item.value"
|
<!-- </el-form-item>-->
|
||||||
:label="item.label"
|
<!-- </el-col>-->
|
||||||
:value="item.value"/>
|
<!-- <el-col :span="12">-->
|
||||||
</el-select>
|
<!-- <el-form-item label="家庭住址" prop="Address">-->
|
||||||
</el-form-item>
|
<!-- <el-input v-model="people_form.Address" size="small" style="width:200px"/>-->
|
||||||
</el-col>
|
<!-- </el-form-item>-->
|
||||||
<el-col :span="12">
|
<!-- </el-col>-->
|
||||||
<el-form-item label="家庭住址" prop="Address">
|
<!-- <el-col :span="12">-->
|
||||||
<el-input v-model="people_form.Address" size="small" style="width:200px"/>
|
<!-- <el-form-item label="民族" prop="Nation">-->
|
||||||
</el-form-item>
|
<!-- <el-input v-model="people_form.Nation" size="small" style="width:200px"/>-->
|
||||||
</el-col>
|
<!-- </el-form-item>-->
|
||||||
<el-col :span="12">
|
<!-- </el-col>-->
|
||||||
<el-form-item label="民族" prop="Nation">
|
|
||||||
<el-input v-model="people_form.Nation" size="small" style="width:200px"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-col>
|
|
||||||
<!--<el-col :span="12">-->
|
<!--<el-col :span="12">-->
|
||||||
<!-- <el-form-item label="职称" prop="Post">-->
|
<!-- <el-form-item label="职称" prop="Post">-->
|
||||||
<!-- <el-select-->
|
<!-- <el-select-->
|
||||||
@@ -435,16 +432,17 @@
|
|||||||
center
|
center
|
||||||
style="height: 800px"
|
style="height: 800px"
|
||||||
title="离职名单"
|
title="离职名单"
|
||||||
width="80%">
|
width="40%">
|
||||||
<el-table
|
<el-table
|
||||||
:data="LeavingList"
|
:data="LeavingList"
|
||||||
border
|
border
|
||||||
height="500"
|
height="420"
|
||||||
highlight-current-row
|
highlight-current-row
|
||||||
size="mini"
|
size="mini"
|
||||||
stripe
|
stripe
|
||||||
style="width: 100%"
|
style="width: 100%"
|
||||||
tooltip-effect="dark">
|
tooltip-effect="dark">
|
||||||
|
<el-table-column align="center" type="index" label="序号" />
|
||||||
<el-table-column align="center" label="部门名称" width="100">
|
<el-table-column align="center" label="部门名称" width="100">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.节点名称 }}
|
{{ scope.row.节点名称 }}
|
||||||
@@ -460,60 +458,60 @@
|
|||||||
{{ scope.row.密码 }}
|
{{ scope.row.密码 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="姓名" width="100">
|
<el-table-column align="center" label="姓名" >
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.姓名 }}
|
{{ scope.row.姓名 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="性别" width="100">
|
<!-- <el-table-column align="center" label="性别" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.性别 }}
|
<!-- {{ scope.row.性别 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="身份证号" width="165">
|
<!-- <el-table-column align="center" label="身份证号" width="165">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.身份证号 }}
|
<!-- {{ scope.row.身份证号 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="学历" width="100">
|
<!-- <el-table-column align="center" label="学历" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.学历名称 }}
|
<!-- {{ scope.row.学历名称 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="入职时间" width="100">
|
<!-- <el-table-column align="center" label="入职时间" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{
|
<!-- {{-->
|
||||||
scope.row.入公司时间 !== '' && scope.row.入公司时间 !== null ? scope.row.入公司时间 = scope.row.入公司时间.split(' ')[0] : scope.row.入公司时间
|
<!-- scope.row.入公司时间 !== '' && scope.row.入公司时间 !== null ? scope.row.入公司时间 = scope.row.入公司时间.split(' ')[0] : scope.row.入公司时间-->
|
||||||
}}
|
<!-- }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="出生日期" width="100">
|
<!-- <el-table-column align="center" label="出生日期" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{
|
<!-- {{-->
|
||||||
scope.row.出生日期 !== '' && scope.row.出生日期 !== null ? scope.row.出生日期 = scope.row.出生日期.split(' ')[0] : scope.row.出生日期
|
<!-- scope.row.出生日期 !== '' && scope.row.出生日期 !== null ? scope.row.出生日期 = scope.row.出生日期.split(' ')[0] : scope.row.出生日期-->
|
||||||
}}
|
<!-- }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="联系方式" width="110">
|
<!-- <el-table-column align="center" label="联系方式" width="110">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.联系电话 }}
|
<!-- {{ scope.row.联系电话 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<!-- <el-table-column align="center" label="岗位工种" width="100">-->
|
<!-- <el-table-column align="center" label="岗位工种" width="100">-->
|
||||||
<!-- <template slot-scope="scope">-->
|
<!-- <template slot-scope="scope">-->
|
||||||
<!-- {{ scope.row.岗位名称 }}-->
|
<!-- {{ scope.row.岗位名称 }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- </el-table-column>-->
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="民族" width="100">
|
<!-- <el-table-column align="center" label="民族" width="100">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.民族 }}
|
<!-- {{ scope.row.民族 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="家庭住址">
|
<!-- <el-table-column align="center" label="家庭住址">-->
|
||||||
<template slot-scope="scope">
|
<!-- <template slot-scope="scope">-->
|
||||||
{{ scope.row.家庭住址 }}
|
<!-- {{ scope.row.家庭住址 }}-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
</el-table-column>
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="操作" width="100">
|
<el-table-column align="center" label="操作" width="100">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button
|
||||||
|
|||||||
@@ -41,16 +41,20 @@
|
|||||||
</template>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="工控机IP" width="110px" align="center">
|
|
||||||
|
<el-table-column label="工位MES功能" width="110px" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<template>
|
<el-tag v-if="scope.row.是否启用MES" size="mini" type="success">启用</el-tag>
|
||||||
{{ scope.row.工控机IP }}
|
<el-tag v-else size="mini" type="warning">禁用</el-tag>
|
||||||
</template>
|
<!-- <el-checkbox v-model="scope.row.是否启用MES" @change="updateUsedMes(scope.row)" />-->
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="工位MES界面" width="110px" align="center">
|
<el-table-column label="MES_DLL" width="110px" align="center">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-checkbox v-model="scope.row.是否启用MES" @change="updateUsedMes(scope.row)" />
|
<template>
|
||||||
|
<span v-if="scope.row.是否启用MES">{{ scope.row.MesDll }}</span>
|
||||||
|
<span v-else ></span>
|
||||||
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" width="150" align="center">
|
<el-table-column label="操作" width="150" align="center">
|
||||||
@@ -68,23 +72,26 @@
|
|||||||
</el-card>
|
</el-card>
|
||||||
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible" :title="title" center style="min-height: 200px;" width="400px">
|
<el-dialog v-el-drag-dialog :visible.sync="dialogFormVisible" :title="title" center style="min-height: 200px;" width="400px">
|
||||||
<el-form ref="formData" :model="formData" :rules="rules" label-position="right" label-width="120px">
|
<el-form ref="formData" :model="formData" :rules="rules" label-position="right" label-width="120px">
|
||||||
<el-form-item label="MES工序号" prop="fileName">
|
<!-- <el-form-item label="MES工序号" prop="fileName">-->
|
||||||
<el-input v-model="formData.fileName" readonly class="myReadOnly-input" size="small" placeholder="指南工位号"/>
|
<!-- <el-input v-model="formData.fileName" readonly class="myReadOnly-input" size="small" placeholder="指南工位号"/>-->
|
||||||
</el-form-item>
|
<!-- </el-form-item>-->
|
||||||
<el-form-item label="MES资源号" prop="nameIndustrialComputer">
|
<!-- <el-form-item label="MES资源号" prop="nameIndustrialComputer">-->
|
||||||
<el-input v-model="formData.nameIndustrialComputer" readonly class="myReadOnly-input" size="small" placeholder="指南工位号"/>
|
<!-- <el-input v-model="formData.nameIndustrialComputer" readonly class="myReadOnly-input" size="small" placeholder="指南工位号"/>-->
|
||||||
</el-form-item>
|
<!-- </el-form-item>-->
|
||||||
<el-form-item label="PLCS工位号" prop="stationNumber">
|
<el-form-item label="工位号" prop="stationNumber">
|
||||||
<el-input v-model="formData.stationNumber" readonly class="myReadOnly-input" size="small" placeholder="工位号"/>
|
<el-input v-model="formData.stationNumber" readonly class="myReadOnly-input" size="small" placeholder="工位号"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="工控机IP" prop="ipIndustrialComputer">
|
|
||||||
<el-input v-model="formData.ipIndustrialComputer" readonly class="myReadOnly-input" size="small" placeholder="工控机IP"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="工位名称" prop="stationName">
|
<el-form-item label="工位名称" prop="stationName">
|
||||||
<el-input v-model="formData.stationName" clearable size="small" placeholder="工位名称"/>
|
<el-input v-model="formData.stationName" clearable size="small" placeholder="工位名称"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="工位MES界面" prop="enableMES">
|
<el-form-item label="工位MES功能" prop="enableMES">
|
||||||
<el-checkbox v-model="formData.enableMES" />
|
<!-- <el-checkbox v-model="formData.enableMES" />-->
|
||||||
|
<el-tag v-if="formData.enableMES" size="mini" type="success">启用</el-tag>
|
||||||
|
<el-tag v-else size="mini" type="warning">禁用</el-tag>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="formData.enableMES" label="MES_DLL" prop="MesDll">
|
||||||
|
<el-input v-model="formData.MesDll" readonly class="myReadOnly-input" size="small" placeholder="MES_DLL"/>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<div slot="footer">
|
<div slot="footer">
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -24,8 +24,8 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
<span style="margin-left: 10px">订单号：</span>
|
<span style="margin-left: 10px">订单号：</span>
|
||||||
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 150px; "/>
|
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 150px; "/>
|
||||||
<span style="margin-left: 10px">产品图号：</span>
|
<span style="margin-left: 10px">产品型号：</span>
|
||||||
<el-select v-model="engineTypeValue" placeholder="请选择产品图号" filterable clearable size="small" style="width: 250px">
|
<el-select v-model="engineTypeValue" placeholder="请选择产品型号" filterable clearable size="small" style="width: 150px">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in engineType"
|
v-for="item in engineType"
|
||||||
:key="item.value"
|
:key="item.value"
|
||||||
@@ -35,17 +35,17 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
<span style="margin-left: 10px">生产时间：</span>
|
<span style="margin-left: 10px">生产时间：</span>
|
||||||
<el-date-picker
|
<el-date-picker
|
||||||
:clearable = "false"
|
|
||||||
v-model="dateTime"
|
v-model="dateTime"
|
||||||
size="small"
|
:clearable="false"
|
||||||
type="daterange"
|
|
||||||
align="center"
|
align="center"
|
||||||
style="width: 250px;"
|
end-placeholder="结束日期"
|
||||||
value-format="yyyy-MM-dd"
|
|
||||||
format="yyyy-MM-dd"
|
format="yyyy-MM-dd"
|
||||||
range-separator="～"
|
range-separator="～"
|
||||||
|
size="small"
|
||||||
start-placeholder="开始日期"
|
start-placeholder="开始日期"
|
||||||
end-placeholder="结束日期"/>
|
style="width: 240px;"
|
||||||
|
type="daterange"
|
||||||
|
value-format="yyyy-MM-dd"/>
|
||||||
<!--<span style="margin-left: 10px">批次条码：</span>-->
|
<!--<span style="margin-left: 10px">批次条码：</span>-->
|
||||||
<!--<el-input v-model="traceabilityCode" placeholder="请输入批次条码" clearable size="small" style="width: 200px; margin-left: 13px"/>-->
|
<!--<el-input v-model="traceabilityCode" placeholder="请输入批次条码" clearable size="small" style="width: 200px; margin-left: 13px"/>-->
|
||||||
<!--<span style="margin-left: 10px">精确追溯码：</span>-->
|
<!--<span style="margin-left: 10px">精确追溯码：</span>-->
|
||||||
@@ -150,7 +150,7 @@
|
|||||||
{{ scope.row.工位号 }}
|
{{ scope.row.工位号 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="产品图号">
|
<el-table-column align="center" label="产品型号">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.发动机型号 }}
|
{{ scope.row.发动机型号 }}
|
||||||
</template>
|
</template>
|
||||||
@@ -287,7 +287,7 @@ export default {
|
|||||||
}
|
}
|
||||||
], // 是否合格
|
], // 是否合格
|
||||||
isQualifiedValue: 2, // 是否合格
|
isQualifiedValue: 2, // 是否合格
|
||||||
dateTime: '', // 时间
|
dateTime: [], // 时间
|
||||||
loading: false, // 时间
|
loading: false, // 时间
|
||||||
tableData: [], // 时间
|
tableData: [], // 时间
|
||||||
date: new Date(),
|
date: new Date(),
|
||||||
@@ -299,7 +299,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.dateTime = [getNowShotTime(), getNowShotTime]
|
this.dateTime = [getNowShotTime(), getNowShotTime()]
|
||||||
this.getStationNumber()
|
this.getStationNumber()
|
||||||
this.getEngineType()
|
this.getEngineType()
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -55,8 +55,8 @@
|
|||||||
<!-- </el-select>-->
|
<!-- </el-select>-->
|
||||||
<span style="margin-left: 10px">订单号：</span>
|
<span style="margin-left: 10px">订单号：</span>
|
||||||
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 150px; margin-left: 5px"/>
|
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 150px; margin-left: 5px"/>
|
||||||
<span style="margin-left: 10px">产品图号：</span>
|
<span style="margin-left: 10px">产品型号：</span>
|
||||||
<el-select v-model="engineTypeValue" placeholder="请选择产品图号" filterable clearable size="small" style="width: 250px">
|
<el-select v-model="engineTypeValue" placeholder="请选择产品型号" filterable clearable size="small" style="width: 150px">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in engineType"
|
v-for="item in engineType"
|
||||||
:key="item.value"
|
:key="item.value"
|
||||||
@@ -130,7 +130,7 @@
|
|||||||
{{ scope.row.工位号 }}
|
{{ scope.row.工位号 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="产品图号">
|
<el-table-column align="center" label="产品型号">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.机型 }}
|
{{ scope.row.机型 }}
|
||||||
</template>
|
</template>
|
||||||
@@ -209,6 +209,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { getNowShotTime } from '../../../utils/tool'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -247,7 +249,7 @@ export default {
|
|||||||
}
|
}
|
||||||
], // 是否合格
|
], // 是否合格
|
||||||
isQualifiedValue: 1, // 是否合格
|
isQualifiedValue: 1, // 是否合格
|
||||||
dateTime: '', // 时间
|
dateTime: [], // 时间
|
||||||
loading: false, // 时间
|
loading: false, // 时间
|
||||||
tableData: [], // 时间
|
tableData: [], // 时间
|
||||||
date: new Date(),
|
date: new Date(),
|
||||||
@@ -259,13 +261,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
var year, month, day, audiTime
|
this.dateTime = [getNowShotTime(), getNowShotTime()]
|
||||||
this.date = new Date() // 修改数据date
|
|
||||||
year = new Date().getFullYear()
|
|
||||||
month = new Date().getMonth() + 1 < 10 ? '0' + (new Date().getMonth() + 1) : new Date().getMonth() + 1
|
|
||||||
day = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()
|
|
||||||
audiTime = year + '-' + month + '-' + day
|
|
||||||
this.dateTime = [audiTime, audiTime]
|
|
||||||
this.getStationNumber()
|
this.getStationNumber()
|
||||||
this.getEngineType()
|
this.getEngineType()
|
||||||
this.getStationNumberN()
|
this.getStationNumberN()
|
||||||
|
|||||||
@@ -20,12 +20,12 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
<span style="margin-left: 10px;letter-spacing: 3px">订单号：</span>
|
<span style="margin-left: 10px;letter-spacing: 3px">订单号：</span>
|
||||||
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 250px;"/>
|
<el-input v-model="orderNumberValue" placeholder="订单号" clearable size="small" style="width: 250px;"/>
|
||||||
<span style="margin-left: 10px;">产品图号：</span>
|
<span style="margin-left: 10px;">产品型号：</span>
|
||||||
<el-select
|
<el-select
|
||||||
v-model="engineTypeValue"
|
v-model="engineTypeValue"
|
||||||
clearable
|
clearable
|
||||||
filterable
|
filterable
|
||||||
placeholder="请选择产品图号"
|
placeholder="请选择产品型号"
|
||||||
size="small"
|
size="small"
|
||||||
style="width: 250px">
|
style="width: 250px">
|
||||||
<el-option
|
<el-option
|
||||||
@@ -144,7 +144,7 @@
|
|||||||
{{ scope.row.工位号 }}
|
{{ scope.row.工位号 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="产品图号" width="120px">
|
<el-table-column align="center" label="产品型号" width="120px">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.发动机型号 }}
|
{{ scope.row.发动机型号 }}
|
||||||
</template>
|
</template>
|
||||||
@@ -214,6 +214,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
import { getNowShotTime } from '../../../utils/tool'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -248,7 +250,7 @@ export default {
|
|||||||
}
|
}
|
||||||
], // 是否合格
|
], // 是否合格
|
||||||
isQualifiedValue: 1, // 是否合格
|
isQualifiedValue: 1, // 是否合格
|
||||||
dateTime: '', // 时间
|
dateTime: [], // 时间
|
||||||
loading: false, // 时间
|
loading: false, // 时间
|
||||||
tableData: [], // 时间
|
tableData: [], // 时间
|
||||||
date: new Date(),
|
date: new Date(),
|
||||||
@@ -260,14 +262,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
var year, month, day, audiTime
|
this.dateTime = [getNowShotTime(), getNowShotTime()]
|
||||||
this.date = new Date() // 修改数据date
|
|
||||||
year = new Date().getFullYear()
|
|
||||||
month = new Date().getMonth() + 1 < 10 ? '0' + (new Date().getMonth() + 1) : new Date().getMonth() + 1
|
|
||||||
day = new Date().getDate() < 10 ? '0' + new Date().getDate() : new Date().getDate()
|
|
||||||
audiTime = year + '-' + month + '-' + day
|
|
||||||
console.log(audiTime, 'audiTime')
|
|
||||||
this.dateTime = [audiTime, audiTime]
|
|
||||||
this.getStationNumber()
|
this.getStationNumber()
|
||||||
this.getEngineType()
|
this.getEngineType()
|
||||||
},
|
},
|
||||||
@@ -296,7 +291,7 @@ export default {
|
|||||||
this.ExecDatabase(Data).then(response => {
|
this.ExecDatabase(Data).then(response => {
|
||||||
for (let i = 0; i < response.data.length; i++) {
|
for (let i = 0; i < response.data.length; i++) {
|
||||||
this.stationNumber.push({
|
this.stationNumber.push({
|
||||||
label: response.data[i].工位号,
|
label: `【${response.data[i].工位号}】${response.data[i].工位名称}`,
|
||||||
value: response.data[i].工位号
|
value: response.data[i].工位号
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,8 +2,8 @@
|
|||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-card class="topCard">
|
<el-card class="topCard">
|
||||||
<div class="topDiv">
|
<div class="topDiv">
|
||||||
<span style="margin-left: 10px">产品图号：</span>
|
<span style="margin-left: 10px">产品型号：</span>
|
||||||
<el-input v-model="equipmentType" style="width:150px;" clearable placeholder="产品图号" size="small"/>
|
<el-input v-model="equipmentType" style="width:150px;" clearable placeholder="产品型号" size="small"/>
|
||||||
<el-button type="primary" plain size="small" icon="el-icon-search" style="margin-left: 10px" @click="searchOrder()">查询</el-button>
|
<el-button type="primary" plain size="small" icon="el-icon-search" style="margin-left: 10px" @click="searchOrder()">查询</el-button>
|
||||||
<!-- <el-button type="distribution" size="small" icon="el-icon-circle-plus" @click="creatOrder('form')">增加</el-button>-->
|
<!-- <el-button type="distribution" size="small" icon="el-icon-circle-plus" @click="creatOrder('form')">增加</el-button>-->
|
||||||
</div>
|
</div>
|
||||||
@@ -21,12 +21,12 @@
|
|||||||
style="width: 60%;"
|
style="width: 60%;"
|
||||||
border
|
border
|
||||||
size="mini">
|
size="mini">
|
||||||
<el-table-column align="center" label="图号代码" width="100px">
|
<el-table-column align="center" label="产品型号代码" width="100px">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.发动机机型标志 }}
|
{{ scope.row.发动机机型标志 }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column align="center" label="产品图号">
|
<el-table-column align="center" label="产品型号">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.发动机型号 }}
|
{{ scope.row.发动机型号 }}
|
||||||
</template>
|
</template>
|
||||||
@@ -36,7 +36,7 @@
|
|||||||
<!-- {{ scope.row.配方号 }}-->
|
<!-- {{ scope.row.配方号 }}-->
|
||||||
<!-- </template>-->
|
<!-- </template>-->
|
||||||
<!-- </el-table-column>-->
|
<!-- </el-table-column>-->
|
||||||
<el-table-column align="center" label="结构">
|
<el-table-column align="center" label="大机型">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
{{ scope.row.标识字符 }}
|
{{ scope.row.标识字符 }}
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@@ -3,7 +3,6 @@
|
|||||||
<el-menu class="navbar" mode="horizontal" style="background: #1576e8!important;">
|
<el-menu class="navbar" mode="horizontal" style="background: #1576e8!important;">
|
||||||
<hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container"/>
|
<hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container"/>
|
||||||
<breadcrumb />
|
<breadcrumb />
|
||||||
<span style="display: inline-block;position: absolute;right: 100px;font-size: 16px;color: #fff">550KV GIS隔离开关信息管理系统</span>
|
|
||||||
<el-dropdown class="avatar-container" trigger="click">
|
<el-dropdown class="avatar-container" trigger="click">
|
||||||
<div class="avatar-wrapper">
|
<div class="avatar-wrapper">
|
||||||
<img :src="require('@/assets/img/leftPic.png')" class="user-avatar">
|
<img :src="require('@/assets/img/leftPic.png')" class="user-avatar">
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<el-scrollbar wrap-class="scrollbar-wrapper">
|
<el-scrollbar wrap-class="scrollbar-wrapper">
|
||||||
<div v-show="isShow" class="img-wrapper">
|
<div v-show="isShow" class="img-wrapper">
|
||||||
<img :src="require('@/assets/img/LOGO.png')" width="165px" height="49px">
|
<img :src="require('@/assets/img/LOGO1.png')" height="49px">
|
||||||
<!-- <span style="font-size: 18px; font-weight: bold; color: white;margin-top: 7px">迈思信息<br>-->
|
<!-- <span style="font-size: 18px; font-weight: bold; color: white;margin-top: 7px">迈思信息<br>-->
|
||||||
<!-- <span style="font-size: 13px; color: white;margin-top: 0px!important;">MESWORK</span>-->
|
<!-- <span style="font-size: 13px; color: white;margin-top: 0px!important;">MESWORK</span>-->
|
||||||
<!-- </span>-->
|
<!-- </span>-->
|
||||||
|
|||||||
@@ -1,338 +1,394 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="scanner-container">
|
<div>
|
||||||
<div class="scanner-header">
|
<div class="login-container">
|
||||||
<h1>平板摄像头扫码器</h1>
|
<!-- <i class="login-img"/>-->
|
||||||
<p>将二维码对准扫描框即可自动识别</p>
|
<el-form
|
||||||
</div>
|
ref="loginForm"
|
||||||
<div class="scanner-content">
|
:model="loginForm"
|
||||||
<div class="video-container">
|
:rules="loginRules"
|
||||||
<video id="video" autoplay playsinline></video>
|
auto-complete="on"
|
||||||
<div class="scan-area">
|
label-position="left"
|
||||||
<div class="scan-line"></div>
|
label-width="0px"
|
||||||
|
class="card-box login-form">
|
||||||
|
<h1 class="title">
|
||||||
|
<img :src="require('@/assets/img/LOGO.png')" alt="" style="height: 50px;align-items: center;">
|
||||||
|
<div style="margin-left: 65px">
|
||||||
|
<!-- <div>550KV GIS隔离开关</div> -->
|
||||||
|
<div>智能装配线信息管理系统</div>
|
||||||
|
</div>
|
||||||
|
</h1>
|
||||||
|
<div class="line"/>
|
||||||
|
<div class="content">
|
||||||
|
<el-form-item prop="username">
|
||||||
|
<span class="svg-container svg-container_login">
|
||||||
|
<svg-icon icon-class="username" />
|
||||||
|
</span>
|
||||||
|
<el-input v-model="loginForm.username" name="username" type="text" auto-complete="off" placeholder="请输入用户名" @input.native="changeUser" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item prop="password">
|
||||||
|
<span class="svg-container">
|
||||||
|
<svg-icon icon-class="password"/>
|
||||||
|
</span>
|
||||||
|
<el-input
|
||||||
|
:type="pwdType"
|
||||||
|
v-model="loginForm.password"
|
||||||
|
name="password"
|
||||||
|
auto-complete="on"
|
||||||
|
placeholder="请输入密码"
|
||||||
|
@keyup.enter.native="handleLogin"/>
|
||||||
|
<span class="show-pwd" @click="showPwd"><svg-icon icon-class="eye" /></span>
|
||||||
|
</el-form-item>
|
||||||
|
<div style="display: flex;align-items: center;">
|
||||||
|
<el-checkbox v-model="loginForm.checked" class="remeberPassword">记住密码</el-checkbox>
|
||||||
|
<el-button type="text" style="margin-left: 190px;color: #1576e8" @click="handleEdit('form')">修改密码</el-button>
|
||||||
|
</div>
|
||||||
|
<el-button :loading="loading" class="signIn" type="primary" style="width:100%;" @click.native.prevent="handleLogin">
|
||||||
|
<span style="font-size: 20px!important;">登录</span>
|
||||||
|
</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</el-form>
|
||||||
|
|
||||||
<div class="status" :class="statusClass" v-if="statusMessage">
|
|
||||||
{{ statusMessage }}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="controls">
|
|
||||||
<button class="btn-primary" @click="startScanning" :disabled="isScanning">
|
|
||||||
<svg class="icon" viewBox="0 0 24 24" fill="white">
|
|
||||||
<path d="M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9M12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17M12,4.5C7,4.5 2.73,7.61 1,12C2.73,16.39 7,19.5 12,19.5C17,19.5 21.27,16.39 23,12C21.27,7.61 17,4.5 12,4.5Z" />
|
|
||||||
</svg>
|
|
||||||
开始扫描
|
|
||||||
</button>
|
|
||||||
<button class="btn-secondary" @click="stopScanning">
|
|
||||||
<svg class="icon" viewBox="0 0 24 24" fill="currentColor">
|
|
||||||
<path d="M12,2C17.52,2 22,6.48 22,12C22,17.52 17.52,22 12,22C6.48,22 2,17.52 2,12C2,6.48 6.48,2 12,2M12,4C7.58,4 4,7.58 4,12C4,16.42 7.58,20 12,20C16.42,20 20,16.42 20,12C20,7.58 16.42,4 12,4M12,10.5C11.17,10.5 10.5,11.17 10.5,12C10.5,12.83 11.17,13.5 12,13.5C12.83,13.5 13.5,12.83 13.5,12C13.5,11.17 12.83,10.5 12,10.5Z" />
|
|
||||||
</svg>
|
|
||||||
停止扫描
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="result-container" v-if="scanResult">
|
|
||||||
<div class="result-title">扫描结果：</div>
|
|
||||||
<div class="result-content">{{ scanResult }}</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="performance-info" v-if="showPerformanceWarning">
|
|
||||||
<strong>性能提示：</strong> 已启用性能优化模式，降低扫描频率以避免浏览器警告。
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="instructions">
|
|
||||||
<h3>使用说明sad：</h3>
|
|
||||||
<ul>
|
|
||||||
<li>点击"开始扫描"按钮启用摄像头</li>
|
|
||||||
<li>将二维码置于扫描框内，系统会自动识别</li>
|
|
||||||
<li>确保环境光线充足，二维码清晰可见</li>
|
|
||||||
<li>扫描完成后可点击"停止扫描"关闭摄像头</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<el-dialog :visible.sync="dialogFormVisible" title="修改密码" center style="min-height: 200px" width="400px">
|
||||||
|
<el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="110px">
|
||||||
|
<el-form-item label="考勤编号" prop="Account" style="display: inline-block">
|
||||||
|
<el-input v-model="form.Account" size="small" style="width:200px"/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="原始密码" prop="beforPassword" style="display: inline-block">
|
||||||
|
<el-input v-model="form.beforPassword" size="small" style="width:200px"/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="新密码" prop="newPassword" style="display: inline-block">
|
||||||
|
<el-input v-model="form.newPassword" size="small" style="width:200px"/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="确认密码" prop="againPassword" style="display: inline-block">
|
||||||
|
<el-input v-model="form.againPassword" size="small" style="width:200px"/>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button size="small" @click="callOff()">取消</el-button>
|
||||||
|
<el-button type="primary" size="small" @click="EditPassword('form')">确定</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import { cloudEditPassword, editPassword } from '@/api/login'
|
||||||
|
import Cookie from 'js-cookie'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Login',
|
name: 'Login',
|
||||||
data() {
|
data() {
|
||||||
|
const validateValue = (rules, value, callback) => {
|
||||||
|
if (this.form.newPassword !== this.form.againPassword) {
|
||||||
|
callback(new Error('两次输入密码不同'))
|
||||||
|
} else {
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
const validateUsername = (rule, value, callback) => {
|
||||||
|
// if (!isvalidUsername(value)) {
|
||||||
|
// callback(new Error('请输入4-5位工号'))
|
||||||
|
// } else {
|
||||||
|
// callback()
|
||||||
|
// }
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
// const validatePass = (rule, value, callback) => {
|
||||||
|
// if (value.length < 5) {
|
||||||
|
// callback(new Error('密码不能小于5位'))
|
||||||
|
// } else {
|
||||||
|
// callback()
|
||||||
|
// }
|
||||||
|
// }
|
||||||
return {
|
return {
|
||||||
video: null,
|
rules: {
|
||||||
canvas: null,
|
againPassword: [
|
||||||
context: null,
|
{ required: true, message: '请输入确认密码', trigger: 'blur' },
|
||||||
isScanning: false,
|
{ required: true, trigger: 'blur', validator: validateValue }],
|
||||||
scanResult: '',
|
Account: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
||||||
statusMessage: '',
|
beforPassword: [{ required: true, message: '请输入原始密码', trigger: 'blur' }],
|
||||||
statusClass: 'info',
|
newPassword: [{ required: true, message: '请输入新密码', trigger: 'blur' }]
|
||||||
stream: null,
|
},
|
||||||
scanInterval: null,
|
list: [],
|
||||||
lastScanTime: 0,
|
form: {
|
||||||
scanDelay: 300, // 扫描间隔(毫秒)
|
againPassword: '',
|
||||||
showPerformanceWarning: false
|
Account: '',
|
||||||
|
beforPassword: '',
|
||||||
|
newPassword: ''
|
||||||
|
},
|
||||||
|
dialogFormVisible: false,
|
||||||
|
loginForm: {
|
||||||
|
username: '',
|
||||||
|
password: '',
|
||||||
|
checked: false
|
||||||
|
},
|
||||||
|
loginRules: {
|
||||||
|
username: [{ required: true, trigger: 'blur', validator: validateUsername }]
|
||||||
|
// password: [{ required: true, trigger: 'blur', validator: validatePass }]
|
||||||
|
},
|
||||||
|
loading: false,
|
||||||
|
pwdType: 'password'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
// 页面加载调用获取cookie值
|
||||||
mounted() {
|
mounted() {
|
||||||
this.video = document.getElementById('video');
|
this.getCookie()
|
||||||
this.canvas = document.createElement('canvas');
|
|
||||||
this.context = this.canvas.getContext('2d');
|
|
||||||
this.statusMessage = '点击"开始扫描"按钮启用摄像头';
|
|
||||||
|
|
||||||
// 检测设备性能并调整扫描频率
|
|
||||||
this.adjustPerformance();
|
|
||||||
},
|
},
|
||||||
|
|
||||||
beforeDestroy() {
|
|
||||||
this.stopScanning()
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
async startScanning() {
|
showPwd() {
|
||||||
this.statusMessage = '正在请求摄像头权限...'
|
if (this.pwdType === 'password') {
|
||||||
this.statusClass = 'info'
|
this.pwdType = ''
|
||||||
|
} else {
|
||||||
try {
|
this.pwdType = 'password'
|
||||||
// 请求摄像头访问权限
|
|
||||||
this.stream = await navigator.mediaDevices.getUserMedia({
|
|
||||||
video: {
|
|
||||||
facingMode: 'environment', // 优先使用后置摄像头
|
|
||||||
width: { ideal: 1280 },
|
|
||||||
height: { ideal: 720 }
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
this.video.srcObject = this.stream
|
|
||||||
this.isScanning = true
|
|
||||||
this.statusMessage = '摄像头已启用，请将二维码对准扫描框'
|
|
||||||
this.statusClass = 'info'
|
|
||||||
this.scanResult = ''
|
|
||||||
|
|
||||||
// 使用setInterval替代requestAnimationFrame，控制扫描频率
|
|
||||||
this.scanInterval = setInterval(() => {
|
|
||||||
this.scanQRCode()
|
|
||||||
}, this.scanDelay)
|
|
||||||
} catch (error) {
|
|
||||||
console.error('无法访问摄像头:', error)
|
|
||||||
this.statusMessage = '无法访问摄像头: ' + error.message
|
|
||||||
this.statusClass = 'error'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
changeUser() {
|
||||||
stopScanning() {
|
this.loginForm.password = ''
|
||||||
this.isScanning = false
|
|
||||||
if (this.scanInterval) {
|
|
||||||
clearInterval(this.scanInterval)
|
|
||||||
this.scanInterval = null
|
|
||||||
}
|
|
||||||
if (this.stream) {
|
|
||||||
this.stream.getTracks().forEach(track => track.stop())
|
|
||||||
this.stream = null
|
|
||||||
}
|
|
||||||
this.statusMessage = '扫描已停止'
|
|
||||||
this.statusClass = 'info'
|
|
||||||
},
|
},
|
||||||
|
handleLogin() {
|
||||||
scanQRCode() {
|
this.$refs.loginForm.validate(valid => {
|
||||||
if (!this.isScanning || !this.video.readyState === this.video.HAVE_ENOUGH_DATA) return
|
if (valid) {
|
||||||
|
this.loading = true
|
||||||
// 设置canvas尺寸与视频一致
|
this.$store.dispatch('Login', this.loginForm).then(() => {
|
||||||
this.canvas.width = this.video.videoWidth
|
this.loading = false
|
||||||
this.canvas.height = this.video.videoHeight
|
this.$router.push({ path: '/' })
|
||||||
|
}).catch(() => {
|
||||||
// 绘制当前视频帧到canvas
|
this.loading = false
|
||||||
this.context.drawImage(this.video, 0, 0, this.canvas.width, this.canvas.height)
|
})
|
||||||
|
} else {
|
||||||
// 获取图像数据
|
console.log('error submit!!')
|
||||||
const imageData = this.context.getImageData(0, 0, this.canvas.width, this.canvas.height)
|
return false
|
||||||
|
|
||||||
// 使用jsQR库识别二维码
|
|
||||||
try {
|
|
||||||
const code = jsQR(imageData.data, imageData.width, imageData.height, {
|
|
||||||
inversionAttempts: 'dontInvert'
|
|
||||||
})
|
|
||||||
|
|
||||||
if (code) {
|
|
||||||
this.scanResult = code.data
|
|
||||||
this.statusMessage = '二维码识别成功！'
|
|
||||||
this.statusClass = 'success'
|
|
||||||
|
|
||||||
// 识别成功后可以继续扫描或停止扫描
|
|
||||||
// this.stopScanning();
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
if (this.loginForm.checked === true) { // 传入账号名，密码，和保存天数3个参数
|
||||||
console.warn('二维码识别出错:', error)
|
this.setCookie(this.loginForm.username, this.loginForm.password, this.loginForm.checked)
|
||||||
}
|
} else {
|
||||||
|
this.clearCookie()
|
||||||
|
}
|
||||||
|
})
|
||||||
},
|
},
|
||||||
|
// 设置cookie
|
||||||
adjustPerformance() {
|
setCookie(username, password, checked) {
|
||||||
// 根据设备性能调整扫描频率
|
Cookie.set('username', username, { expires: 7 })
|
||||||
const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)
|
Cookie.set('password', password, { expires: 7 })
|
||||||
if (isMobile) {
|
Cookie.set('checked', checked, { expires: 7 })
|
||||||
this.scanDelay = 500 // 移动设备上降低扫描频率
|
},
|
||||||
this.showPerformanceWarning = true
|
// 读取 cookie
|
||||||
}
|
getCookie() {
|
||||||
|
this.loginForm.username = Cookie.get('username')
|
||||||
|
this.loginForm.password = Cookie.get('password')
|
||||||
|
this.loginForm.checked = Boolean(Cookie.get('checked'))
|
||||||
|
},
|
||||||
|
// 清除cookie
|
||||||
|
clearCookie() {
|
||||||
|
Cookie.remove('username')
|
||||||
|
Cookie.remove('password')
|
||||||
|
Cookie.remove('checked')
|
||||||
|
},
|
||||||
|
handleEdit() {
|
||||||
|
this.addForm('form', [this.dialogFormVisible = true])
|
||||||
|
},
|
||||||
|
callOff() {
|
||||||
|
this.dialogFormVisible = false
|
||||||
|
},
|
||||||
|
EditPassword(formName) {
|
||||||
|
this.$refs[formName].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
editPassword(this.form.Account, this.form.beforPassword, this.form.newPassword, 5).then(response => {
|
||||||
|
if (response.data.result[0].result === '1') {
|
||||||
|
if (response.data.output[0].返回 === '1') {
|
||||||
|
cloudEditPassword(this.form.Account, this.form.newPassword).then(response => {
|
||||||
|
console.log(response, 333)
|
||||||
|
if (response.data[0].result === '1') {
|
||||||
|
this.$message.success('修改成功')
|
||||||
|
this.dialogFormVisible = false
|
||||||
|
} else {
|
||||||
|
this.$message.error('编辑失败')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$message.error('用户名或密码不正确')
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this.$message.error('编辑失败')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style rel="stylesheet/scss" lang="scss">
|
<style rel="stylesheet/scss" lang="scss">
|
||||||
.scanner-container {
|
$bg:#2d3a4b;
|
||||||
width: 100%;
|
$dark_gray:#889aa4;
|
||||||
max-width: 800px;
|
$light_gray:#eee;
|
||||||
background-color: rgba(255, 255, 255, 0.95);
|
|
||||||
border-radius: 20px;
|
.login-container {
|
||||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
|
position: fixed;
|
||||||
overflow: hidden;
|
height: 100%;
|
||||||
}
|
width:100%;
|
||||||
.scanner-header {
|
background-color: #ebebeb;
|
||||||
background: linear-gradient(to right, #4a00e0, #8e2de2);
|
background-image:url("../../../static/login.png");background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;
|
||||||
color: white;
|
input:-webkit-autofill {
|
||||||
padding: 20px;
|
-webkit-box-shadow: 0 0 0 1000px #293444 inset !important;
|
||||||
text-align: center;
|
-webkit-text-fill-color: #fff !important;
|
||||||
}
|
}
|
||||||
.scanner-header h1 {
|
/*.login-img{*/
|
||||||
font-size: 1.8rem;
|
/* position: absolute;*/
|
||||||
margin-bottom: 10px;
|
/* width: 100%;*/
|
||||||
}
|
/* height: 100%;*/
|
||||||
.scanner-header p {
|
/* background: url("../../../static/login.png") no-repeat;*/
|
||||||
opacity: 0.9;
|
/*}*/
|
||||||
}
|
input {
|
||||||
.scanner-content {
|
background: transparent;
|
||||||
padding: 30px;
|
border: 1px;
|
||||||
}
|
-webkit-appearance: none;
|
||||||
.video-container {
|
border-radius: 0;
|
||||||
position: relative;
|
padding: 12px 5px 12px 15px;
|
||||||
width: 100%;
|
color: $light_gray;
|
||||||
margin-bottom: 20px;
|
height: 47px;
|
||||||
border-radius: 10px;
|
}
|
||||||
overflow: hidden;
|
.el-input {
|
||||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
|
display: inline-block;
|
||||||
}
|
height: 47px;
|
||||||
#video {
|
width: 85%;
|
||||||
width: 100%;
|
}
|
||||||
height: auto;
|
.svg-container {
|
||||||
display: block;
|
padding: 6px 5px 6px 15px;
|
||||||
background-color: #000;
|
color: #1576e8;
|
||||||
}
|
font-size: 20px!important;
|
||||||
.scan-area {
|
vertical-align: middle;
|
||||||
position: absolute;
|
width: 30px;
|
||||||
top: 50%;
|
display: inline-block;
|
||||||
left: 50%;
|
&_login {
|
||||||
transform: translate(-50%, -50%);
|
font-size: 20px;
|
||||||
width: 70%;
|
}
|
||||||
height: 200px;
|
}
|
||||||
border: 2px solid #4a00e0;
|
.title {
|
||||||
border-radius: 10px;
|
font-size: 22px;
|
||||||
box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.3);
|
line-height: 30px;
|
||||||
display: flex;
|
color: #1576e8;
|
||||||
justify-content: center;
|
margin: 0 auto 20px auto;
|
||||||
align-items: center;
|
text-align: center;
|
||||||
}
|
font-weight: bold;
|
||||||
.scan-line {
|
font-family: 微软雅黑Regular＆Bold;
|
||||||
width: 100%;
|
display: flex;
|
||||||
height: 2px;
|
}
|
||||||
background: #4a00e0;
|
.content{
|
||||||
position: absolute;
|
width: 330px;
|
||||||
animation: scan 2s linear infinite;
|
margin: 30px auto 0 auto;
|
||||||
}
|
}
|
||||||
@keyframes scan {
|
.line{
|
||||||
0% { top: 0; }
|
width: 100%;
|
||||||
50% { top: calc(100% - 2px); }
|
margin: 0 auto 25px auto;
|
||||||
100% { top: 0; }
|
background-color: #1576e8;
|
||||||
}
|
height: 1px;
|
||||||
.controls {
|
}
|
||||||
display: flex;
|
.login-form {
|
||||||
justify-content: center;
|
height: 500px;
|
||||||
gap: 15px;
|
border-radius: 20px;
|
||||||
margin-bottom: 25px;
|
background-color: white;
|
||||||
}
|
position: absolute;
|
||||||
button {
|
left: 0;
|
||||||
padding: 12px 25px;
|
right: 0;
|
||||||
border: none;
|
width: 400px;
|
||||||
border-radius: 50px;
|
padding: 35px 15px 15px 15px;
|
||||||
font-size: 1rem;
|
margin: 120px auto;
|
||||||
font-weight: 600;
|
}
|
||||||
cursor: pointer;
|
.tips {
|
||||||
transition: all 0.3s ease;
|
font-size: 14px;
|
||||||
display: flex;
|
color: #fff;
|
||||||
align-items: center;
|
margin-bottom: 10px;
|
||||||
gap: 8px;
|
span {
|
||||||
}
|
&:first-of-type {
|
||||||
.btn-primary {
|
margin-right: 16px;
|
||||||
background: linear-gradient(to right, #4a00e0, #8e2de2);
|
}
|
||||||
color: white;
|
}
|
||||||
}
|
}
|
||||||
.btn-primary:hover {
|
.el-input__inner{
|
||||||
transform: translateY(-3px);
|
border: none!important;
|
||||||
box-shadow: 0 5px 15px rgba(142, 45, 226, 0.4);
|
font-size: 18px!important;
|
||||||
}
|
color: #29335b!important;
|
||||||
.btn-secondary {
|
}
|
||||||
background: #f0f0f0;
|
.el-form-item {
|
||||||
color: #333;
|
border: 1px solid #1576e8;
|
||||||
}
|
background: #ffffff;
|
||||||
.btn-secondary:hover {
|
border-radius: 5px;
|
||||||
background: #e0e0e0;
|
color: #454545;
|
||||||
}
|
}
|
||||||
.result-container {
|
/*登录button*/
|
||||||
background-color: #f8f9fa;
|
.signIn{
|
||||||
border-radius: 10px;
|
width: 100%;
|
||||||
padding: 20px;
|
border: none;
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
border-left: 4px solid #4a00e0;
|
border-radius: 5px;
|
||||||
}
|
font-size: 18px;
|
||||||
.result-title {
|
color:white;
|
||||||
font-weight: 600;
|
background: -webkit-linear-gradient(left, #1576e8 , #9fd2ab); /* Safari 5.1 - 6.0 */
|
||||||
margin-bottom: 10px;
|
background: -o-linear-gradient(right, #1576e8, #9fd2ab); /* Opera 11.1 - 12.0 */
|
||||||
color: #4a00e0;
|
background: -moz-linear-gradient(right, #1576e8, #9fd2ab); /* Firefox 3.6 - 15 */
|
||||||
}
|
background: linear-gradient(to right, #1576e8 , #9fd2ab); /* 标准的语法（必须放在最后） */
|
||||||
.result-content {
|
}
|
||||||
word-break: break-all;
|
.remeberPassword{
|
||||||
background: white;
|
color: #1576e8;
|
||||||
padding: 15px;
|
}
|
||||||
border-radius: 8px;
|
.show-pwd {
|
||||||
border: 1px solid #e0e0e0;
|
position: absolute;
|
||||||
}
|
right: 10px;
|
||||||
.status {
|
top: 7px;
|
||||||
text-align: center;
|
font-size: 16px;
|
||||||
padding: 10px;
|
color: #1576e8;
|
||||||
border-radius: 8px;
|
cursor: pointer;
|
||||||
margin-bottom: 15px;
|
user-select:none;
|
||||||
}
|
}
|
||||||
.status.success {
|
@media (min-width: 1024px) {
|
||||||
background-color: #d4edda;
|
/*根据屏幕大小确定显示的位置*/
|
||||||
color: #155724;
|
.login-form{
|
||||||
border: 1px solid #c3e6cb;
|
position: absolute;
|
||||||
}
|
left: 40%;
|
||||||
.status.error {
|
top: 0;
|
||||||
background-color: #f8d7da;
|
width: 600px;
|
||||||
color: #721c24;
|
}
|
||||||
border: 1px solid #f5c6cb;
|
.title{
|
||||||
}
|
font-size: 32px!important;
|
||||||
.status.info {
|
line-height: 32px;
|
||||||
background-color: #d1ecf1;
|
}
|
||||||
color: #0c5460;
|
.el-form-item{
|
||||||
border: 1px solid #bee5eb;
|
width: 400px;
|
||||||
}
|
height: 48px;
|
||||||
.instructions {
|
}
|
||||||
background-color: #e8f4fd;
|
.content{
|
||||||
border-radius: 10px;
|
width: 400px;
|
||||||
padding: 15px;
|
}
|
||||||
margin-top: 20px;
|
}
|
||||||
font-size: 0.9rem;
|
@media (min-width: 1281px) {
|
||||||
}
|
.login-form{
|
||||||
.instructions h3 {
|
position: absolute;
|
||||||
color: #4a00e0;
|
left: 30%;
|
||||||
margin-bottom: 10px;
|
top: 6%;
|
||||||
}
|
width: 600px;
|
||||||
.instructions ul {
|
}
|
||||||
padding-left: 20px;
|
}
|
||||||
}
|
}
|
||||||
.instructions li {
|
</style>
|
||||||
margin-bottom: 8px;
|
<style>
|
||||||
}
|
.remeberPassword .el-checkbox__inner:hover{
|
||||||
.icon {
|
border: 1px solid #1576e8;
|
||||||
width: 20px;
|
}
|
||||||
height: 20px;
|
.remeberPassword .el-checkbox__input.is-checked .el-checkbox__inner{
|
||||||
}
|
background-color: #1576e8;
|
||||||
|
border-color: #1576e8;
|
||||||
|
}
|
||||||
|
.remeberPassword .el-checkbox__input.is-checked+.el-checkbox__label{
|
||||||
|
color: #1576e8;
|
||||||
|
}
|
||||||
|
.remeberPassword .el-checkbox__input.is-focus .el-checkbox__inner{
|
||||||
|
border-color: #1576e8;
|
||||||
|
}
|
||||||
|
.login-container input:-webkit-autofill{
|
||||||
|
-webkit-box-shadow:0 0 0 1000px #fff inset !important;
|
||||||
|
-webkit-text-fill-color: #29335b !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,394 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="login-container">
|
|
||||||
<!-- <i class="login-img"/>-->
|
|
||||||
<el-form
|
|
||||||
ref="loginForm"
|
|
||||||
:model="loginForm"
|
|
||||||
:rules="loginRules"
|
|
||||||
auto-complete="on"
|
|
||||||
label-position="left"
|
|
||||||
label-width="0px"
|
|
||||||
class="card-box login-form">
|
|
||||||
<h1 class="title">
|
|
||||||
<img :src="require('@/assets/img/LOGO.png')" alt="" style="height: 50px;align-items: center;">
|
|
||||||
<div style="margin-left: 30px">
|
|
||||||
<div>550KV GIS隔离开关</div>
|
|
||||||
<div>信息管理系统</div>
|
|
||||||
</div>
|
|
||||||
</h1>
|
|
||||||
<div class="line"/>
|
|
||||||
<div class="content">
|
|
||||||
<el-form-item prop="username">
|
|
||||||
<span class="svg-container svg-container_login">
|
|
||||||
<svg-icon icon-class="username" />
|
|
||||||
</span>
|
|
||||||
<el-input v-model="loginForm.username" name="username" type="text" auto-complete="off" placeholder="请输入用户名" @input.native="changeUser" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item prop="password">
|
|
||||||
<span class="svg-container">
|
|
||||||
<svg-icon icon-class="password"/>
|
|
||||||
</span>
|
|
||||||
<el-input
|
|
||||||
:type="pwdType"
|
|
||||||
v-model="loginForm.password"
|
|
||||||
name="password"
|
|
||||||
auto-complete="on"
|
|
||||||
placeholder="请输入密码"
|
|
||||||
@keyup.enter.native="handleLogin"/>
|
|
||||||
<span class="show-pwd" @click="showPwd"><svg-icon icon-class="eye" /></span>
|
|
||||||
</el-form-item>
|
|
||||||
<div style="display: flex;align-items: center;">
|
|
||||||
<el-checkbox v-model="loginForm.checked" class="remeberPassword">记住密码</el-checkbox>
|
|
||||||
<el-button type="text" style="margin-left: 190px;color: #1576e8" @click="handleEdit('form')">修改密码</el-button>
|
|
||||||
</div>
|
|
||||||
<el-button :loading="loading" class="signIn" type="primary" style="width:100%;" @click.native.prevent="handleLogin">
|
|
||||||
<span style="font-size: 20px!important;">登录</span>
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-dialog :visible.sync="dialogFormVisible" title="修改密码" center style="min-height: 200px" width="400px">
|
|
||||||
<el-form ref="form" :model="form" :rules="rules" label-position="left" label-width="110px">
|
|
||||||
<el-form-item label="考勤编号" prop="Account" style="display: inline-block">
|
|
||||||
<el-input v-model="form.Account" size="small" style="width:200px"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="原始密码" prop="beforPassword" style="display: inline-block">
|
|
||||||
<el-input v-model="form.beforPassword" size="small" style="width:200px"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="新密码" prop="newPassword" style="display: inline-block">
|
|
||||||
<el-input v-model="form.newPassword" size="small" style="width:200px"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="确认密码" prop="againPassword" style="display: inline-block">
|
|
||||||
<el-input v-model="form.againPassword" size="small" style="width:200px"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<div slot="footer" class="dialog-footer">
|
|
||||||
<el-button size="small" @click="callOff()">取消</el-button>
|
|
||||||
<el-button type="primary" size="small" @click="EditPassword('form')">确定</el-button>
|
|
||||||
</div>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<script>
|
|
||||||
import { cloudEditPassword, editPassword } from '@/api/login'
|
|
||||||
import Cookie from 'js-cookie'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'Login',
|
|
||||||
data() {
|
|
||||||
const validateValue = (rules, value, callback) => {
|
|
||||||
if (this.form.newPassword !== this.form.againPassword) {
|
|
||||||
callback(new Error('两次输入密码不同'))
|
|
||||||
} else {
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const validateUsername = (rule, value, callback) => {
|
|
||||||
// if (!isvalidUsername(value)) {
|
|
||||||
// callback(new Error('请输入4-5位工号'))
|
|
||||||
// } else {
|
|
||||||
// callback()
|
|
||||||
// }
|
|
||||||
callback()
|
|
||||||
}
|
|
||||||
// const validatePass = (rule, value, callback) => {
|
|
||||||
// if (value.length < 5) {
|
|
||||||
// callback(new Error('密码不能小于5位'))
|
|
||||||
// } else {
|
|
||||||
// callback()
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
return {
|
|
||||||
rules: {
|
|
||||||
againPassword: [
|
|
||||||
{ required: true, message: '请输入确认密码', trigger: 'blur' },
|
|
||||||
{ required: true, trigger: 'blur', validator: validateValue }],
|
|
||||||
Account: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
|
||||||
beforPassword: [{ required: true, message: '请输入原始密码', trigger: 'blur' }],
|
|
||||||
newPassword: [{ required: true, message: '请输入新密码', trigger: 'blur' }]
|
|
||||||
},
|
|
||||||
list: [],
|
|
||||||
form: {
|
|
||||||
againPassword: '',
|
|
||||||
Account: '',
|
|
||||||
beforPassword: '',
|
|
||||||
newPassword: ''
|
|
||||||
},
|
|
||||||
dialogFormVisible: false,
|
|
||||||
loginForm: {
|
|
||||||
username: '',
|
|
||||||
password: '',
|
|
||||||
checked: false
|
|
||||||
},
|
|
||||||
loginRules: {
|
|
||||||
username: [{ required: true, trigger: 'blur', validator: validateUsername }]
|
|
||||||
// password: [{ required: true, trigger: 'blur', validator: validatePass }]
|
|
||||||
},
|
|
||||||
loading: false,
|
|
||||||
pwdType: 'password'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 页面加载调用获取cookie值
|
|
||||||
mounted() {
|
|
||||||
this.getCookie()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
showPwd() {
|
|
||||||
if (this.pwdType === 'password') {
|
|
||||||
this.pwdType = ''
|
|
||||||
} else {
|
|
||||||
this.pwdType = 'password'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
changeUser() {
|
|
||||||
this.loginForm.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
|
|
||||||
}
|
|
||||||
if (this.loginForm.checked === true) { // 传入账号名，密码，和保存天数3个参数
|
|
||||||
this.setCookie(this.loginForm.username, this.loginForm.password, this.loginForm.checked)
|
|
||||||
} else {
|
|
||||||
this.clearCookie()
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// 设置cookie
|
|
||||||
setCookie(username, password, checked) {
|
|
||||||
Cookie.set('username', username, { expires: 7 })
|
|
||||||
Cookie.set('password', password, { expires: 7 })
|
|
||||||
Cookie.set('checked', checked, { expires: 7 })
|
|
||||||
},
|
|
||||||
// 读取 cookie
|
|
||||||
getCookie() {
|
|
||||||
this.loginForm.username = Cookie.get('username')
|
|
||||||
this.loginForm.password = Cookie.get('password')
|
|
||||||
this.loginForm.checked = Boolean(Cookie.get('checked'))
|
|
||||||
},
|
|
||||||
// 清除cookie
|
|
||||||
clearCookie() {
|
|
||||||
Cookie.remove('username')
|
|
||||||
Cookie.remove('password')
|
|
||||||
Cookie.remove('checked')
|
|
||||||
},
|
|
||||||
handleEdit() {
|
|
||||||
this.addForm('form', [this.dialogFormVisible = true])
|
|
||||||
},
|
|
||||||
callOff() {
|
|
||||||
this.dialogFormVisible = false
|
|
||||||
},
|
|
||||||
EditPassword(formName) {
|
|
||||||
this.$refs[formName].validate((valid) => {
|
|
||||||
if (valid) {
|
|
||||||
editPassword(this.form.Account, this.form.beforPassword, this.form.newPassword, 5).then(response => {
|
|
||||||
if (response.data.result[0].result === '1') {
|
|
||||||
if (response.data.output[0].返回 === '1') {
|
|
||||||
cloudEditPassword(this.form.Account, this.form.newPassword).then(response => {
|
|
||||||
console.log(response, 333)
|
|
||||||
if (response.data[0].result === '1') {
|
|
||||||
this.$message.success('修改成功')
|
|
||||||
this.dialogFormVisible = false
|
|
||||||
} else {
|
|
||||||
this.$message.error('编辑失败')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
} else {
|
|
||||||
this.$message.error('用户名或密码不正确')
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
this.$message.error('编辑失败')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style rel="stylesheet/scss" lang="scss">
|
|
||||||
$bg:#2d3a4b;
|
|
||||||
$dark_gray:#889aa4;
|
|
||||||
$light_gray:#eee;
|
|
||||||
|
|
||||||
.login-container {
|
|
||||||
position: fixed;
|
|
||||||
height: 100%;
|
|
||||||
width:100%;
|
|
||||||
background-color: #ebebeb;
|
|
||||||
background-image:url("../../../static/login.png");background-repeat:no-repeat; background-size:100% 100%;-moz-background-size:100% 100%;
|
|
||||||
input:-webkit-autofill {
|
|
||||||
-webkit-box-shadow: 0 0 0 1000px #293444 inset !important;
|
|
||||||
-webkit-text-fill-color: #fff !important;
|
|
||||||
}
|
|
||||||
/*.login-img{*/
|
|
||||||
/* position: absolute;*/
|
|
||||||
/* width: 100%;*/
|
|
||||||
/* height: 100%;*/
|
|
||||||
/* background: url("../../../static/login.png") no-repeat;*/
|
|
||||||
/*}*/
|
|
||||||
input {
|
|
||||||
background: transparent;
|
|
||||||
border: 1px;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
border-radius: 0;
|
|
||||||
padding: 12px 5px 12px 15px;
|
|
||||||
color: $light_gray;
|
|
||||||
height: 47px;
|
|
||||||
}
|
|
||||||
.el-input {
|
|
||||||
display: inline-block;
|
|
||||||
height: 47px;
|
|
||||||
width: 85%;
|
|
||||||
}
|
|
||||||
.svg-container {
|
|
||||||
padding: 6px 5px 6px 15px;
|
|
||||||
color: #1576e8;
|
|
||||||
font-size: 20px!important;
|
|
||||||
vertical-align: middle;
|
|
||||||
width: 30px;
|
|
||||||
display: inline-block;
|
|
||||||
&_login {
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.title {
|
|
||||||
font-size: 22px;
|
|
||||||
line-height: 30px;
|
|
||||||
color: #1576e8;
|
|
||||||
margin: 0 auto 20px auto;
|
|
||||||
text-align: center;
|
|
||||||
font-weight: bold;
|
|
||||||
font-family: 微软雅黑Regular＆Bold;
|
|
||||||
display: flex;
|
|
||||||
}
|
|
||||||
.content{
|
|
||||||
width: 330px;
|
|
||||||
margin: 30px auto 0 auto;
|
|
||||||
}
|
|
||||||
.line{
|
|
||||||
width: 100%;
|
|
||||||
margin: 0 auto 25px auto;
|
|
||||||
background-color: #1576e8;
|
|
||||||
height: 1px;
|
|
||||||
}
|
|
||||||
.login-form {
|
|
||||||
height: 500px;
|
|
||||||
border-radius: 20px;
|
|
||||||
background-color: white;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
width: 400px;
|
|
||||||
padding: 35px 15px 15px 15px;
|
|
||||||
margin: 120px auto;
|
|
||||||
}
|
|
||||||
.tips {
|
|
||||||
font-size: 14px;
|
|
||||||
color: #fff;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
span {
|
|
||||||
&:first-of-type {
|
|
||||||
margin-right: 16px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-input__inner{
|
|
||||||
border: none!important;
|
|
||||||
font-size: 18px!important;
|
|
||||||
color: #29335b!important;
|
|
||||||
}
|
|
||||||
.el-form-item {
|
|
||||||
border: 1px solid #1576e8;
|
|
||||||
background: #ffffff;
|
|
||||||
border-radius: 5px;
|
|
||||||
color: #454545;
|
|
||||||
}
|
|
||||||
/*登录button*/
|
|
||||||
.signIn{
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
margin-top: 20px;
|
|
||||||
border-radius: 5px;
|
|
||||||
font-size: 18px;
|
|
||||||
color:white;
|
|
||||||
background: -webkit-linear-gradient(left, #1576e8 , #9fd2ab); /* Safari 5.1 - 6.0 */
|
|
||||||
background: -o-linear-gradient(right, #1576e8, #9fd2ab); /* Opera 11.1 - 12.0 */
|
|
||||||
background: -moz-linear-gradient(right, #1576e8, #9fd2ab); /* Firefox 3.6 - 15 */
|
|
||||||
background: linear-gradient(to right, #1576e8 , #9fd2ab); /* 标准的语法（必须放在最后） */
|
|
||||||
}
|
|
||||||
.remeberPassword{
|
|
||||||
color: #1576e8;
|
|
||||||
}
|
|
||||||
.show-pwd {
|
|
||||||
position: absolute;
|
|
||||||
right: 10px;
|
|
||||||
top: 7px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #1576e8;
|
|
||||||
cursor: pointer;
|
|
||||||
user-select:none;
|
|
||||||
}
|
|
||||||
@media (min-width: 1024px) {
|
|
||||||
/*根据屏幕大小确定显示的位置*/
|
|
||||||
.login-form{
|
|
||||||
position: absolute;
|
|
||||||
left: 40%;
|
|
||||||
top: 0;
|
|
||||||
width: 600px;
|
|
||||||
}
|
|
||||||
.title{
|
|
||||||
font-size: 32px!important;
|
|
||||||
line-height: 32px;
|
|
||||||
}
|
|
||||||
.el-form-item{
|
|
||||||
width: 400px;
|
|
||||||
height: 48px;
|
|
||||||
}
|
|
||||||
.content{
|
|
||||||
width: 400px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 1281px) {
|
|
||||||
.login-form{
|
|
||||||
position: absolute;
|
|
||||||
left: 30%;
|
|
||||||
top: 6%;
|
|
||||||
width: 600px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
<style>
|
|
||||||
.remeberPassword .el-checkbox__inner:hover{
|
|
||||||
border: 1px solid #1576e8;
|
|
||||||
}
|
|
||||||
.remeberPassword .el-checkbox__input.is-checked .el-checkbox__inner{
|
|
||||||
background-color: #1576e8;
|
|
||||||
border-color: #1576e8;
|
|
||||||
}
|
|
||||||
.remeberPassword .el-checkbox__input.is-checked+.el-checkbox__label{
|
|
||||||
color: #1576e8;
|
|
||||||
}
|
|
||||||
.remeberPassword .el-checkbox__input.is-focus .el-checkbox__inner{
|
|
||||||
border-color: #1576e8;
|
|
||||||
}
|
|
||||||
.login-container input:-webkit-autofill{
|
|
||||||
-webkit-box-shadow:0 0 0 1000px #fff inset !important;
|
|
||||||
-webkit-text-fill-color: #29335b !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@@ -5,7 +5,7 @@ window.g = {
|
|||||||
mqttIP: '192.168.0.80',
|
mqttIP: '192.168.0.80',
|
||||||
mqttPortNumber: '8083',
|
mqttPortNumber: '8083',
|
||||||
printTemplate: 'BQFT_BarCode_001',
|
printTemplate: 'BQFT_BarCode_001',
|
||||||
baseURL: 'http://127.0.0.1:10040',
|
baseURL: 'http://127.0.0.1:10026',
|
||||||
requestConfig_baseURL: 'http://127.0.0.1:9981/mes'
|
requestConfig_baseURL: 'http://127.0.0.1:9981/mes'
|
||||||
// requestConfig_baseURL: 'http://10.89.33.67:6867/mes'
|
// requestConfig_baseURL: 'http://10.89.33.67:6867/mes'
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user