page title,workbook title padding,logout func,countdown status judge and show,update
This commit is contained in:
jr719
parent
a7aaae03d0
commit
5c65f0e0fc
|
|
@ -21,7 +21,7 @@
|
|||
<!-- <div class="avatar-wrapper"> -->
|
||||
<img :src="avatar" class="user-avatar">
|
||||
<span>{{ name }}</span>
|
||||
<el-button icon="el-icon-switch-button" type="text" style="margin-left:26px;margin-right:20px">退出登录</el-button>
|
||||
<el-button icon="el-icon-switch-button" type="text" style="margin-left:26px;margin-right:20px" @click.native="logout">退出登录</el-button>
|
||||
<!-- <div><i ></i>退出登录</div> -->
|
||||
<!-- <i class="el-icon-caret-bottom" /> -->
|
||||
<!-- </div> -->
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
title: 'Vue Element Admin',
|
||||
title: '定点服务系统',
|
||||
logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
title: 'Vue Element Admin',
|
||||
title: '定点服务系统',
|
||||
logo: 'https://wpimg.wallstcn.com/69a1c46c-eb1c-4b46-8bd4-e9e686ef5251.png'
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
module.exports = {
|
||||
title: 'Vue Element Admin',
|
||||
title: '定点服务系统',
|
||||
|
||||
/**
|
||||
* @type {boolean} true | false
|
||||
|
|
|
|||
|
|
@ -72,9 +72,9 @@ const actions = {
|
|||
|
||||
// user logout
|
||||
logout({ commit, state, dispatch }) {
|
||||
return new Promise((resolve, reject) => {
|
||||
logout(state.token)
|
||||
.then(() => {
|
||||
// return new Promise((resolve, reject) => {
|
||||
// logout(state.token)
|
||||
// .then(() => {
|
||||
commit('SET_TOKEN', '')
|
||||
commit('SET_ROLES', [])
|
||||
removeToken()
|
||||
|
|
@ -84,12 +84,12 @@ const actions = {
|
|||
// to fixed https://github.com/PanJiaChen/vue-element-admin/issues/2485
|
||||
dispatch('tagsView/delAllViews', null, { root: true })
|
||||
|
||||
resolve()
|
||||
})
|
||||
.catch(error => {
|
||||
reject(error)
|
||||
})
|
||||
})
|
||||
// resolve()
|
||||
// })
|
||||
// .catch(error => {
|
||||
// reject(error)
|
||||
// })
|
||||
// })
|
||||
},
|
||||
|
||||
// remove token
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import defaultSettings from '@/settings'
|
||||
|
||||
const title = defaultSettings.title || 'Vue Element Admin'
|
||||
const title = defaultSettings.title || '定点服务系统'
|
||||
|
||||
export default function getPageTitle(pageTitle) {
|
||||
if (pageTitle) {
|
||||
|
|
|
|||
|
|
@ -5,7 +5,8 @@
|
|||
type="primary"
|
||||
style="position:absolute;right:50px;top:120px"
|
||||
@click="$router.push('/convenience/add')"
|
||||
><i class="el-icon-plus" /> 直接建立工单</el-button>
|
||||
><i class="el-icon-plus" /> 直接建立工单</el-button
|
||||
>
|
||||
<div class="title">工单列表</div>
|
||||
<div style="margin-bottom:15px;margin-top:15px" />
|
||||
<el-radio-group v-model="listQuery.phase">
|
||||
|
|
@ -15,20 +16,20 @@
|
|||
<el-radio-button label="PROCESSING">办理中</el-radio-button>
|
||||
<el-radio-button label="FINISH">已办结</el-radio-button>
|
||||
</el-radio-group>
|
||||
<br>
|
||||
<br>
|
||||
<br />
|
||||
<br />
|
||||
<el-radio-group v-model="listQuery.status">
|
||||
<el-radio-button :label="undefined">全部状态</el-radio-button>
|
||||
<el-radio-button label="MINE">我处理</el-radio-button>
|
||||
<el-radio-button label="FORWARDED">已转交</el-radio-button>
|
||||
<el-radio-button
|
||||
label="FORWARDED_APPLY"
|
||||
>转交超限审批中</el-radio-button>
|
||||
<el-radio-button label="FORWARDED_APPLY"
|
||||
>转交超限审批中</el-radio-button
|
||||
>
|
||||
<el-radio-button label="SUBMIT_APPLY">已提交审批</el-radio-button>
|
||||
<el-radio-button label="WAIT_APPLY">待我审批</el-radio-button>
|
||||
</el-radio-group>
|
||||
<br>
|
||||
<br>
|
||||
<br />
|
||||
<br />
|
||||
</div>
|
||||
|
||||
<div class="convenienceList">
|
||||
|
|
@ -54,7 +55,17 @@
|
|||
<div style="display:flex;flex:2;font-size:14px;color:#787878">
|
||||
<div style="flex:1">
|
||||
<p>流水号：{{ item.serialNumber }}</p>
|
||||
<p>阶段：{{ item.phase | phaseFilter }}</p>
|
||||
<p>
|
||||
阶段：{{ item.phase | phaseFilter }}
|
||||
<i class="icon_timeout" v-if="timers&&timers[index].status !== null"></i>
|
||||
<span style="color:#ff3000">{{
|
||||
timers && timers[index].status === null
|
||||
? ""
|
||||
: timers&&timers[index].status
|
||||
? "已超时"
|
||||
: "即将超时"
|
||||
}}</span>
|
||||
</p>
|
||||
</div>
|
||||
<div style="flex:1">
|
||||
<p>申办人：{{ item.residentInformation.name }}</p>
|
||||
|
|
@ -62,6 +73,7 @@
|
|||
状态：<span style="color:#ff5a00">{{
|
||||
item.statusList[0].status | statusFilter
|
||||
}}</span>
|
||||
<!-- <span v-html="timeoutType(item,index)"></span> -->
|
||||
</p>
|
||||
</div>
|
||||
<div style="flex:1">
|
||||
|
|
@ -80,7 +92,8 @@
|
|||
type="primary"
|
||||
size="mini"
|
||||
@click="handleUpdate(item, 5)"
|
||||
>接单</el-button>
|
||||
>接单</el-button
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -174,10 +187,10 @@
|
|||
|
||||
<script>
|
||||
// import Pagination from "@/components/Pagination";
|
||||
import { list, typeList, update } from '@/api/convenience'
|
||||
import { parseTime } from '@/utils'
|
||||
import { staffList } from '@/api/staff'
|
||||
import AliOss from '@/components/AliOSS/index.vue'
|
||||
import { list, typeList, update } from "@/api/convenience";
|
||||
import { parseTime } from "@/utils";
|
||||
import { staffList } from "@/api/staff";
|
||||
import AliOss from "@/components/AliOSS/index.vue";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
|
|
@ -187,48 +200,48 @@ export default {
|
|||
filters: {
|
||||
sponsorFilter(status) {
|
||||
const statusMap = {
|
||||
SELF: '居民',
|
||||
STAFF: '工作人员'
|
||||
}
|
||||
return statusMap[status]
|
||||
SELF: "居民",
|
||||
STAFF: "工作人员"
|
||||
};
|
||||
return statusMap[status];
|
||||
},
|
||||
phaseFilter(status) {
|
||||
const statusMap = {
|
||||
PENDING_ORDER: '待接单',
|
||||
PREREQUISITES: '要件准备中',
|
||||
PROCESSING: '办理中',
|
||||
FINISH: '办结'
|
||||
}
|
||||
return statusMap[status]
|
||||
PENDING_ORDER: "待接单",
|
||||
PREREQUISITES: "要件准备中",
|
||||
PROCESSING: "办理中",
|
||||
FINISH: "办结"
|
||||
};
|
||||
return statusMap[status];
|
||||
},
|
||||
statusFilter(status) {
|
||||
const statusMap = {
|
||||
MINE: '待我处理',
|
||||
FORWARDED: '已转交',
|
||||
FORWARDED_APPLY: '转交超限审批中',
|
||||
SUBMIT_APPLY: '提交申请',
|
||||
WAIT_APPLY: '待审核'
|
||||
}
|
||||
return statusMap[status]
|
||||
MINE: "待我处理",
|
||||
FORWARDED: "已转交",
|
||||
FORWARDED_APPLY: "转交超限审批中",
|
||||
SUBMIT_APPLY: "提交申请",
|
||||
WAIT_APPLY: "待审核"
|
||||
};
|
||||
return statusMap[status];
|
||||
},
|
||||
typeFilter(status) {
|
||||
const statusMap = {
|
||||
1: '建立工单',
|
||||
2: '撤销工单',
|
||||
3: '沟通',
|
||||
4: '调整工单类别',
|
||||
5: '接单',
|
||||
6: '要件齐备',
|
||||
7: '办结',
|
||||
8: '转交超限审批提交',
|
||||
9: '转交超限审批撤销',
|
||||
10: '转交超限审批',
|
||||
11: '发起审批',
|
||||
12: '撤销审批',
|
||||
13: '审批操作',
|
||||
14: '转交'
|
||||
}
|
||||
return statusMap[status]
|
||||
1: "建立工单",
|
||||
2: "撤销工单",
|
||||
3: "沟通",
|
||||
4: "调整工单类别",
|
||||
5: "接单",
|
||||
6: "要件齐备",
|
||||
7: "办结",
|
||||
8: "转交超限审批提交",
|
||||
9: "转交超限审批撤销",
|
||||
10: "转交超限审批",
|
||||
11: "发起审批",
|
||||
12: "撤销审批",
|
||||
13: "审批操作",
|
||||
14: "转交"
|
||||
};
|
||||
return statusMap[status];
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
|
@ -259,126 +272,140 @@ export default {
|
|||
},
|
||||
msec: 0,
|
||||
rules: {
|
||||
ids: [{ required: true, message: '请选择操作对象', trigger: 'change' }]
|
||||
ids: [{ required: true, message: "请选择操作对象", trigger: "change" }]
|
||||
},
|
||||
timers: undefined,
|
||||
timersInterval: undefined
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'listQuery.phase': {
|
||||
"listQuery.phase": {
|
||||
// 深度监听，可监听到对象、数组的变化
|
||||
handler(val) {
|
||||
this.listQuery.phase = val
|
||||
this.getList()
|
||||
this.listQuery.phase = val;
|
||||
this.getList();
|
||||
},
|
||||
deep: true // true 深度监听
|
||||
},
|
||||
'listQuery.status': {
|
||||
"listQuery.status": {
|
||||
// 深度监听，可监听到对象、数组的变化
|
||||
handler(val) {
|
||||
this.listQuery.status = val
|
||||
this.getList()
|
||||
this.listQuery.status = val;
|
||||
this.getList();
|
||||
},
|
||||
deep: true // true 深度监听
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getStaffList()
|
||||
this.getList();
|
||||
this.getStaffList();
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
this.listLoading = true;
|
||||
list(this.listQuery).then(res => {
|
||||
this.list = res.d.records
|
||||
this.listLoading = false
|
||||
clearInterval(this.timersInterval)
|
||||
const tempData = res.d.records
|
||||
const now = Date.parse(new Date()).toString() / 1000
|
||||
const arr = []
|
||||
this.list = res.d.records;
|
||||
this.listLoading = false;
|
||||
clearInterval(this.timersInterval);
|
||||
const tempData = res.d.records;
|
||||
const now = Date.parse(new Date()).toString() / 1000;
|
||||
const arr = [];
|
||||
tempData.map((item, index) => {
|
||||
// console.log(item);
|
||||
// PREREQUISITES: "要件准备中",
|
||||
// PROCESSING: "办理中",
|
||||
// FINISH: "办结"
|
||||
let msec = []
|
||||
let obj = {}
|
||||
let msec = [];
|
||||
let obj = {};
|
||||
switch (item.phase) {
|
||||
case 'PENDING_ORDER':
|
||||
case "PENDING_ORDER":
|
||||
// 待接单
|
||||
// console.log(item.createDate)
|
||||
// this.timers[index]++;
|
||||
msec = now - item.createDate
|
||||
// msec++;
|
||||
// console.log(msec);
|
||||
msec = now - item.createDate;
|
||||
obj = {
|
||||
time: msec,
|
||||
phase: item.phase
|
||||
}
|
||||
|
||||
arr.push(obj)
|
||||
break
|
||||
case 'PREREQUISITES':
|
||||
phase: item.phase,
|
||||
status: null
|
||||
};
|
||||
arr.push(obj);
|
||||
break;
|
||||
case "PREREQUISITES":
|
||||
// 要件准备
|
||||
// console.log(index);
|
||||
// console.log(now);
|
||||
// console.log(item.createDate);
|
||||
// console.log(item.acceptanceTime);
|
||||
// console.log(now - item.createDate - item.acceptanceTime);
|
||||
msec = now - item.createDate - item.acceptanceTime
|
||||
msec = now - item.createDate - item.acceptanceTime;
|
||||
obj = {
|
||||
time: msec,
|
||||
phase: item.phase
|
||||
}
|
||||
arr.push(obj)
|
||||
break
|
||||
case 'PROCESSING':
|
||||
phase: item.phase,
|
||||
status: null
|
||||
};
|
||||
arr.push(obj);
|
||||
break;
|
||||
case "PROCESSING":
|
||||
// 办理中
|
||||
msec =
|
||||
now -
|
||||
item.createDate -
|
||||
item.acceptanceTime -
|
||||
item.prerequisitesTime
|
||||
item.prerequisitesTime;
|
||||
obj = {
|
||||
time: msec,
|
||||
phase: item.phase
|
||||
}
|
||||
arr.push(obj)
|
||||
break
|
||||
case 'FINISH':
|
||||
phase: item.phase,
|
||||
status: null
|
||||
};
|
||||
arr.push(obj);
|
||||
break;
|
||||
case "FINISH":
|
||||
msec =
|
||||
item.acceptanceTime + item.prerequisitesTime + item.finishTime
|
||||
item.acceptanceTime + item.prerequisitesTime + item.finishTime;
|
||||
obj = {
|
||||
time: msec,
|
||||
phase: item.phase
|
||||
}
|
||||
arr.push(obj)
|
||||
phase: item.phase,
|
||||
status: null
|
||||
};
|
||||
arr.push(obj);
|
||||
// 办结
|
||||
break
|
||||
break;
|
||||
default:
|
||||
// console.log("default");
|
||||
break
|
||||
break;
|
||||
}
|
||||
})
|
||||
// console.log(arr);
|
||||
});
|
||||
this.timersInterval = setInterval(() => {
|
||||
// console.log(arr);
|
||||
if (arr.length > 0) {
|
||||
arr.map(item => {
|
||||
if (item.phase !== 'FINISH') {
|
||||
item.time++
|
||||
arr.map((item, index) => {
|
||||
if (item.phase !== "FINISH") {
|
||||
item.time++;
|
||||
if (this.list[index].phase === "PENDING_ORDER") {
|
||||
if (item.status == null) {
|
||||
if (item.time > 57600) {
|
||||
item.status = false;
|
||||
if (item.time >= 86400) {
|
||||
item.status = true;
|
||||
}
|
||||
})
|
||||
}
|
||||
this.timers = arr
|
||||
}, 1000)
|
||||
})
|
||||
}
|
||||
}
|
||||
if (this.list[index].phase === "PROCESSING") {
|
||||
if (item.status == null) {
|
||||
// &&item.time<this.list[index].eventType.commitmentTimeLimit
|
||||
if (
|
||||
item.time >
|
||||
this.list[index].eventType.timeoutReminder * 3600
|
||||
) {
|
||||
item.status = false;
|
||||
if (
|
||||
item.time >=
|
||||
this.list[index].eventType.commitmentTimeLimit * 3600
|
||||
) {
|
||||
item.status = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
this.timers = arr;
|
||||
}, 1000);
|
||||
});
|
||||
},
|
||||
getTypeList() {
|
||||
typeList().then(res => {
|
||||
// console.log(res);
|
||||
})
|
||||
});
|
||||
},
|
||||
getStaffList() {
|
||||
staffList().then(res => {
|
||||
|
|
@ -386,10 +413,10 @@ export default {
|
|||
const obj = {
|
||||
label: item.name,
|
||||
value: item.id
|
||||
}
|
||||
this.staffOptions.push(obj)
|
||||
})
|
||||
})
|
||||
};
|
||||
this.staffOptions.push(obj);
|
||||
});
|
||||
});
|
||||
},
|
||||
handleTypeChange() {},
|
||||
resetPayload() {
|
||||
|
|
@ -401,79 +428,79 @@ export default {
|
|||
attachmentList: undefined,
|
||||
approve: undefined,
|
||||
evaluation: undefined
|
||||
}
|
||||
};
|
||||
},
|
||||
handleUpdate(row, type) {
|
||||
this.resetPayload()
|
||||
this.resetPayload();
|
||||
this.$nextTick(() => {
|
||||
this.$refs.applyForm.clearValidate()
|
||||
})
|
||||
this.updateType = type
|
||||
this.payload.id = row.id
|
||||
this.payload.version = row.version
|
||||
this.payload.type = type
|
||||
this.$refs.applyForm.clearValidate();
|
||||
});
|
||||
this.updateType = type;
|
||||
this.payload.id = row.id;
|
||||
this.payload.version = row.version;
|
||||
this.payload.type = type;
|
||||
switch (type) {
|
||||
case 5:
|
||||
this.applyDialog = true
|
||||
break
|
||||
this.applyDialog = true;
|
||||
break;
|
||||
case 6:
|
||||
this.applyDialog = true
|
||||
break
|
||||
this.applyDialog = true;
|
||||
break;
|
||||
case 11:
|
||||
this.applyDialog = true
|
||||
break
|
||||
this.applyDialog = true;
|
||||
break;
|
||||
case 13:
|
||||
this.applyDialog = true
|
||||
break
|
||||
this.applyDialog = true;
|
||||
break;
|
||||
case 14:
|
||||
this.applyDialog = true
|
||||
break
|
||||
this.applyDialog = true;
|
||||
break;
|
||||
default:
|
||||
this.updateData()
|
||||
break
|
||||
this.updateData();
|
||||
break;
|
||||
}
|
||||
},
|
||||
updateData() {
|
||||
update(this.payload).then(res => {
|
||||
if (res.c === 200) {
|
||||
this.$notify.success('操作成功')
|
||||
this.getList()
|
||||
this.$notify.success("操作成功");
|
||||
this.getList();
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
apply() {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.applyForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.updateData()
|
||||
this.applyDialog = false
|
||||
this.updateData();
|
||||
this.applyDialog = false;
|
||||
}
|
||||
})
|
||||
}, 100)
|
||||
});
|
||||
}, 100);
|
||||
},
|
||||
handleFilterPhase(phase, event) {
|
||||
// console.log(event.target.tagName==='SPAN');
|
||||
if (event.target.tagName === 'SPAN') {
|
||||
if (event.target.tagName === "SPAN") {
|
||||
event.target.parentElement.setAttribute(
|
||||
'class',
|
||||
'el-button el-button--' +
|
||||
(phase === undefined ? 'primary' : 'default') +
|
||||
' el-button--medium is-round'
|
||||
)
|
||||
"class",
|
||||
"el-button el-button--" +
|
||||
(phase === undefined ? "primary" : "default") +
|
||||
" el-button--medium is-round"
|
||||
);
|
||||
} else {
|
||||
event.target.setAttribute(
|
||||
'class',
|
||||
'el-button el-button--' +
|
||||
(phase === undefined ? 'primary' : 'default') +
|
||||
' el-button--medium is-round'
|
||||
)
|
||||
"class",
|
||||
"el-button el-button--" +
|
||||
(phase === undefined ? "primary" : "default") +
|
||||
" el-button--medium is-round"
|
||||
);
|
||||
}
|
||||
this.listQuery.phase = phase
|
||||
this.getList()
|
||||
this.listQuery.phase = phase;
|
||||
this.getList();
|
||||
},
|
||||
handleFilterStatus(status) {
|
||||
this.listQuery.status = status
|
||||
this.getList()
|
||||
this.listQuery.status = status;
|
||||
this.getList();
|
||||
},
|
||||
handlePreview() {},
|
||||
handleRemove() {},
|
||||
|
|
@ -482,24 +509,36 @@ export default {
|
|||
timeFormat(timeStamp) {
|
||||
const timeStr = `${
|
||||
Math.floor(timeStamp / 3600) < 9
|
||||
? '0' + Math.floor(timeStamp / 3600)
|
||||
? "0" + Math.floor(timeStamp / 3600)
|
||||
: Math.floor(timeStamp / 3600)
|
||||
}:${
|
||||
Math.floor(((timeStamp % 86400) % 3600) / 60) < 9
|
||||
? '0' + Math.floor(((timeStamp % 86400) % 3600) / 60)
|
||||
? "0" + Math.floor(((timeStamp % 86400) % 3600) / 60)
|
||||
: Math.floor(((timeStamp % 86400) % 3600) / 60)
|
||||
}:${
|
||||
Math.floor(((timeStamp % 86400) % 3600) % 60) < 9
|
||||
? '0' + Math.floor(((timeStamp % 86400) % 3600) % 60)
|
||||
? "0" + Math.floor(((timeStamp % 86400) % 3600) % 60)
|
||||
: Math.floor(((timeStamp % 86400) % 3600) % 60)
|
||||
}`
|
||||
return timeStr
|
||||
}`;
|
||||
return timeStr;
|
||||
},
|
||||
countdown(index, status) {
|
||||
//
|
||||
}
|
||||
// timeoutType(row,index) {
|
||||
// let tempData = Object.assign({}, row);
|
||||
// switch (tempData.phase) {
|
||||
// case "PENDING_ORDER":
|
||||
// // tempData.acceptanceTime
|
||||
// this.timers[index]
|
||||
// break;
|
||||
// }
|
||||
// let statusEl = '<i class="icon_timeout"></i>即将超时'; //'<i class="icon_timeoutYet"></i>已超时'
|
||||
|
||||
// return statusEl;
|
||||
// }
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scope>
|
||||
|
|
@ -519,7 +558,7 @@ export default {
|
|||
background-color: #f5f7fa;
|
||||
border-left: 5px solid #1890ff !important;
|
||||
} */
|
||||
.title {
|
||||
.app-container .title {
|
||||
border-left: 5px solid #1890ff;
|
||||
padding-left: 8px;
|
||||
font-size: 18px;
|
||||
|
|
@ -579,4 +618,12 @@ export default {
|
|||
.el-radio-button:last-child .el-radio-button__inner {
|
||||
border-radius: 17px;
|
||||
}
|
||||
.icon_timeout {
|
||||
background: url("./img/icon_timeout.png") no-repeat;
|
||||
background-size: cover;
|
||||
width: 12px;
|
||||
height: 11px;
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -11,13 +11,13 @@
|
|||
margin: 0 auto;"
|
||||
>
|
||||
<el-row>
|
||||
<el-col
|
||||
:span="12"
|
||||
<el-col :span="12"
|
||||
><img
|
||||
src="./img/loginImg.png"
|
||||
style="padding: 70px 0px 70px 72px;width:100%"
|
||||
alt=""
|
||||
></el-col>
|
||||
/></el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form
|
||||
ref="loginForm"
|
||||
|
|
@ -38,7 +38,7 @@
|
|||
<el-input
|
||||
ref="username"
|
||||
v-model="loginForm.username"
|
||||
placeholder="Username"
|
||||
placeholder="请输入用户名"
|
||||
name="username"
|
||||
type="text"
|
||||
tabindex="1"
|
||||
|
|
@ -60,7 +60,12 @@
|
|||
/>
|
||||
<!-- style="width:290px" -->
|
||||
<!-- <el-button @click="handleSms">获取验证码</el-button> -->
|
||||
<button class="btn_getCode" type="button" :disabled="getCodeDisabled" @click="handleSms">
|
||||
<button
|
||||
class="btn_getCode"
|
||||
type="button"
|
||||
:disabled="getCodeDisabled"
|
||||
@click="handleSms"
|
||||
>
|
||||
{{ codeText }}
|
||||
</button>
|
||||
</el-form-item>
|
||||
|
|
@ -70,7 +75,8 @@
|
|||
type="primary"
|
||||
style="width:100%;margin-bottom:30px;border-radius:10px;height:54px"
|
||||
@click.native.prevent="handleLogin"
|
||||
>登录</el-button>
|
||||
>登录</el-button
|
||||
>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
@ -79,12 +85,12 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { validUsername } from '@/utils/validate'
|
||||
import { getGuestToken, getSms } from '@/api/user'
|
||||
import Axios from 'axios'
|
||||
import { validUsername } from "@/utils/validate";
|
||||
import { getGuestToken, getSms } from "@/api/user";
|
||||
import Axios from "axios";
|
||||
|
||||
export default {
|
||||
name: 'Login',
|
||||
name: "Login",
|
||||
// components: { SocialSign },
|
||||
data() {
|
||||
const validateUsername = (rule, value, callback) => {
|
||||
|
|
@ -94,57 +100,57 @@ export default {
|
|||
// callback()
|
||||
// }
|
||||
if (value.length < 4) {
|
||||
callback(new Error('账号格式错误，不能为空或小于4位'))
|
||||
callback(new Error("账号格式错误，不能为空或小于11位"));
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
callback();
|
||||
}
|
||||
};
|
||||
const validateCaptcha = (rule, value, callback) => {
|
||||
if (value.length < 6) {
|
||||
callback(new Error('验证码格式错误，不能为空或小于6位'))
|
||||
callback(new Error("验证码格式错误，不能为空或小于6位"));
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
callback();
|
||||
}
|
||||
};
|
||||
return {
|
||||
// loginForm: {
|
||||
// username: 'admin',
|
||||
// password: '111111'
|
||||
// },
|
||||
loginForm: {
|
||||
username: '18882564006',
|
||||
captcha: '111111',
|
||||
appVersion: '1.0.0',
|
||||
system: 'IOS',
|
||||
username: "18882564006",
|
||||
captcha: "111111",
|
||||
appVersion: "1.0.0",
|
||||
system: "IOS",
|
||||
device: navigator.userAgent,
|
||||
extra: ''
|
||||
extra: ""
|
||||
},
|
||||
loginRules: {
|
||||
username: [
|
||||
{ required: true, trigger: 'blur', validator: validateUsername }
|
||||
{ required: true, trigger: "blur", validator: validateUsername }
|
||||
],
|
||||
password: [
|
||||
{ required: true, trigger: 'blur', validator: validateCaptcha }
|
||||
captcha: [
|
||||
{ required: true, trigger: "blur", validator: validateCaptcha }
|
||||
]
|
||||
},
|
||||
passwordType: 'password',
|
||||
passwordType: "password",
|
||||
capsTooltip: false,
|
||||
loading: false,
|
||||
showDialog: false,
|
||||
redirect: undefined,
|
||||
otherQuery: {},
|
||||
codeText: '获取验证码',
|
||||
codeText: "获取验证码",
|
||||
time: 5,
|
||||
getCodeDisabled: false
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route: {
|
||||
handler: function(route) {
|
||||
const query = route.query
|
||||
const query = route.query;
|
||||
if (query) {
|
||||
this.redirect = query.redirect
|
||||
this.otherQuery = this.getOtherQuery(query)
|
||||
this.redirect = query.redirect;
|
||||
this.otherQuery = this.getOtherQuery(query);
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
|
|
@ -152,30 +158,30 @@ export default {
|
|||
},
|
||||
created() {
|
||||
// window.addEventListener('storage', this.afterQRScan)
|
||||
const { appVersion, system, device, extra } = this.loginForm
|
||||
const { appVersion, system, device, extra } = this.loginForm;
|
||||
const payload = {
|
||||
appVersion,
|
||||
system,
|
||||
device,
|
||||
extra
|
||||
}
|
||||
};
|
||||
Axios({
|
||||
method: 'POST',
|
||||
method: "POST",
|
||||
url: `${process.env.VUE_APP_BASE_API}api/auth/guest`,
|
||||
data: payload,
|
||||
headers: {
|
||||
Authorization: 'basic YW5kcm9pZC1jbGllbnQ6YW5kcm9pZC1zZWNyZXQtMjAyMA=='
|
||||
Authorization: "basic YW5kcm9pZC1jbGllbnQ6YW5kcm9pZC1zZWNyZXQtMjAyMA=="
|
||||
}
|
||||
}).then(res => {
|
||||
// console.log(res);
|
||||
sessionStorage.setItem('token', res.data.d.access_token)
|
||||
})
|
||||
sessionStorage.setItem("token", res.data.d.access_token);
|
||||
});
|
||||
},
|
||||
mounted() {
|
||||
if (this.loginForm.username === '') {
|
||||
this.$refs.username.focus()
|
||||
} else if (this.loginForm.captcha === '') {
|
||||
this.$refs.password.focus()
|
||||
if (this.loginForm.username === "") {
|
||||
this.$refs.username.focus();
|
||||
} else if (this.loginForm.captcha === "") {
|
||||
this.$refs.password.focus();
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
|
|
@ -183,8 +189,8 @@ export default {
|
|||
},
|
||||
methods: {
|
||||
checkCapslock(e) {
|
||||
const { key } = e
|
||||
this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z'
|
||||
const { key } = e;
|
||||
this.capsTooltip = key && key.length === 1 && key >= "A" && key <= "Z";
|
||||
},
|
||||
// showPwd() {
|
||||
// if (this.passwordType === 'password') {
|
||||
|
|
@ -200,34 +206,37 @@ export default {
|
|||
this.$refs.loginForm.validate(valid => {
|
||||
if (valid) {
|
||||
Axios({
|
||||
method: 'POST',
|
||||
method: "POST",
|
||||
url: `${process.env.VUE_APP_BASE_API}api/auth/sms`,
|
||||
data: this.loginForm,
|
||||
headers: {
|
||||
Authorization:
|
||||
'basic YW5kcm9pZC1jbGllbnQ6YW5kcm9pZC1zZWNyZXQtMjAyMA=='
|
||||
"basic YW5kcm9pZC1jbGllbnQ6YW5kcm9pZC1zZWNyZXQtMjAyMA=="
|
||||
}
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
console.log(res);
|
||||
if (res.data.c === 200) {
|
||||
this.$store.dispatch('user/setToken', res.data.d.access_token)
|
||||
this.$store.dispatch("user/setToken", res.data.d.access_token);
|
||||
this.$router.push({
|
||||
path: this.redirect || '/',
|
||||
path: this.redirect || "/",
|
||||
query: this.otherQuery
|
||||
})
|
||||
});
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '登录成功',
|
||||
type: 'success',
|
||||
title: "成功",
|
||||
message: "登录成功",
|
||||
type: "success",
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
})
|
||||
});
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
this.$notify.error(res.data.m);
|
||||
}
|
||||
})
|
||||
});
|
||||
} else {
|
||||
console.log("error submit!!");
|
||||
|
||||
return false;
|
||||
}
|
||||
});
|
||||
// this.$refs.loginForm.validate(valid => {
|
||||
// if (valid) {
|
||||
// this.loading = true
|
||||
|
|
@ -247,53 +256,53 @@ export default {
|
|||
},
|
||||
getOtherQuery(query) {
|
||||
return Object.keys(query).reduce((acc, cur) => {
|
||||
if (cur !== 'redirect') {
|
||||
acc[cur] = query[cur]
|
||||
if (cur !== "redirect") {
|
||||
acc[cur] = query[cur];
|
||||
}
|
||||
return acc
|
||||
}, {})
|
||||
return acc;
|
||||
}, {});
|
||||
},
|
||||
handleSms() {
|
||||
this.getCodeDisabled = false
|
||||
this.getCodeDisabled = false;
|
||||
const payload = {
|
||||
phone: this.loginForm.username,
|
||||
category: 'SIGNIN'
|
||||
}
|
||||
category: "SIGNIN"
|
||||
};
|
||||
Axios({
|
||||
method: 'GET',
|
||||
method: "GET",
|
||||
url: `${process.env.VUE_APP_BASE_API}api/common/sms/send`,
|
||||
params: payload,
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + sessionStorage.getItem('token')
|
||||
Authorization: "Bearer " + sessionStorage.getItem("token")
|
||||
}
|
||||
}).then(res => {
|
||||
if (res.data.c === 200) {
|
||||
this.getCodeDisabled = true
|
||||
this.timer()
|
||||
this.getCodeDisabled = true;
|
||||
this.timer();
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: '获取验证码成功',
|
||||
type: 'success',
|
||||
title: "成功",
|
||||
message: "获取验证码成功",
|
||||
type: "success",
|
||||
duration: 2000
|
||||
})
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
timer() {
|
||||
this.codeText = `${this.time}s 后重新获取`
|
||||
this.codeText = `${this.time}s 后重新获取`;
|
||||
var interval = setInterval(() => {
|
||||
this.time--
|
||||
this.codeText = `${this.time}s 后重新获取`
|
||||
this.time--;
|
||||
this.codeText = `${this.time}s 后重新获取`;
|
||||
if (this.time === 0) {
|
||||
this.time = 5
|
||||
this.codeText = '获取验证码'
|
||||
this.getCodeDisabled = false
|
||||
clearInterval(interval)
|
||||
this.time = 5;
|
||||
this.codeText = "获取验证码";
|
||||
this.getCodeDisabled = false;
|
||||
clearInterval(interval);
|
||||
}
|
||||
}, 1000)
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
@ -309,7 +318,7 @@ $cursor: #fff;
|
|||
color: $cursor;
|
||||
}
|
||||
}
|
||||
button:focus{
|
||||
button:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="app-container" style="padding-top:15px">
|
||||
<!-- <div class="filter-container" /> -->
|
||||
<div class="workBookLayout">
|
||||
<div class="title">工作手册管理</div>
|
||||
<div class="text-center"style="padding:10% 0">
|
||||
<div class="text-center" style="padding:10% 0">
|
||||
<img class="img" src="./img/comingSoon.png" alt="">
|
||||
<h2>业务正在努力开发中...</h2>
|
||||
<div style="color:#787878">该功能即将上线，请稍等</div>
|
||||
|
|
@ -81,7 +81,7 @@ export default {
|
|||
methods: {
|
||||
getList() {
|
||||
workBookList(this.listQuery).then(res => {
|
||||
console.log(res)
|
||||
// console.log(res)
|
||||
this.list = res.d.records
|
||||
})
|
||||
}
|
||||
|
|
@ -91,10 +91,11 @@ export default {
|
|||
|
||||
<style scoped>
|
||||
.workBookLayout {
|
||||
padding-top: 20px;
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
.title {
|
||||
.app-container .title {
|
||||
border-left: 5px solid #1890ff;
|
||||
padding-left: 8px;
|
||||
font-size: 18px;
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ function resolve(dir) {
|
|||
return path.join(__dirname, dir)
|
||||
}
|
||||
|
||||
const name = defaultSettings.title || 'vue Element Admin' // page title
|
||||
const name = defaultSettings.title || '定点服务系统' // page title
|
||||
|
||||
// If your port is set to 80,
|
||||
// use administrator privileges to execute the command line.
|
||||
|
|
|
|||
Loading…
Reference in New Issue