Skip to content

C
cms-admin
提交 b0bd4238 authored 作者: pengxiaohui's avatar pengxiaohui
浏览文件
操作

广告列表新建更新审核

上级 2a900e41
隐藏空白字符变更
内嵌 并排
正在显示 包含 388 行增加 和 133 行删除
src/api/account.js
浏览文件 @ b0bd4238
......@@ -8,3 +8,7 @@ export function logout() {
export function getUser() {
return httpRequest.get('/api/passport/account/get-user-info')
}
// 发送验证码
export function sendCode(data) {
return httpRequest.post('/api/usercenter/user/send-code', data)
}
\ No newline at end of file
src/api/contentManage.js
浏览文件 @ b0bd4238
import httpRequest from '@/utils/axios'
/* ------------------------------------广告------------------------------------ */
/**
* 获取广告列表
* @param {string} type_id 类型id
......@@ -8,6 +9,20 @@ import httpRequest from '@/utils/axios'
export function getAdList(params) {
return httpRequest.get('/api/cms/admin/v1/advertisements', { params })
}
/**
* 创建广告
*/
export function createAd(data) {
return httpRequest.post('/api/cms/admin/v1/advertisement/create', data)
}
/**
* 更新广告
* @param {string} id 广告id
* @param {object} data 广告表单数据
*/
export function updateAd(id, data) {
return httpRequest.put(`/api/cms/admin/v1/advertisement/${id}/update`, data)
}
/**
* 发布广告
* @param {string} id
......@@ -16,7 +31,17 @@ export function getAdList(params) {
export function publishAd(id, data) {
return httpRequest.post(`/api/cms/admin/v1/advertisement/${id}/publish`, data)
}
/**
* 审核广告
* @param {string} id
* @param {number} data.audit_status 2通过 3驳回
* @param {string} data.audit_remarks 审核说明
*/
export function auditAd(id, data) {
return httpRequest.post(`/api/cms/admin/v1/advertisement/${id}/audit`, data)
}
/* ------------------------------------文章------------------------------------ */
/**
* 获取文章列表
* @param {string} type_id 类型id
......@@ -26,6 +51,12 @@ export function publishAd(id, data) {
export function getArticleList(params) {
return httpRequest.get('/api/cms/admin/v1/articles', { params })
}
/**
* 创建文章
*/
export function createArticle(data) {
return httpRequest.post('/api/cms/admin/v1/article/create', data)
}
/**
* 发布文章
* @param {string} id
......@@ -35,6 +66,7 @@ export function publishArticle(id, data) {
return httpRequest.post(`/api/cms/admin/v1/article/${id}/publish`, data)
}
/* ------------------------------------图文------------------------------------ */
/**
* 获取图文列表
* @param {string} type_id 类型id
......@@ -52,3 +84,11 @@ export function getImgTextList(params) {
export function publishImgText(id, data) {
return httpRequest.post(`/api/cms/admin/v1/img-text/${id}/publish`, data)
}
/**
* 获取广告/文章/图文新建时所选项目对应的类型
* @param {number} content_type 类型 1文章 2广告 3图文
* @param {string} project_id 项目id
*/
export function getProjectContentTypeList(type, id) {
return httpRequest.get(`/api/cms/admin/v1/type/${type}/project/${id}`)
}
src/api/system.js
浏览文件 @ b0bd4238
......@@ -21,4 +21,16 @@ export function searchUserList(params) {
*/
export function getUserRolesPermissions() {
return httpRequest.get('/api/cms/admin/v1/common/user-detail')
}
\ No newline at end of file
}
/**
* 文件上传
*/
export function fileUpload(formData) {
return httpRequest({
url: '/api/cms/admin/v1/common/file-upload',
method: 'post',
headers: { 'Content-Type': 'multipart/form-data' },
data: formData
})
// return httpRequest.post('/api/cms/admin/v1/common/file-upload', { headers: { 'Content-Type': 'multipart/form-data' } })
}
src/pages/content-manage/ads/index.vue
浏览文件 @ b0bd4238
......@@ -39,7 +39,7 @@
<el-button size="mini" :disabled="!multipleSelection.length" @click="handleRemove">删除</el-button>
</template>
</table-list>
<el-drawer :visible.sync="drawerVisible" size="1100px" :destroy-on-close="true">
<el-drawer :visible.sync="drawerVisible" size="1100px" :destroy-on-close="true" ref="ad_drawer">
<template slot="title">
<h5>
{{ drawTitle }}
......@@ -56,7 +56,7 @@
<drawer-form
:options="drawFormOptions"
@drawFormSubmit="HandleDrawFormSubmit"
@drawFormClose="drawerVisible = false"
@drawFormClose="$refs.ad_drawer.closeDrawer()"
>
<template #form-item-review>
<el-form-item>
......@@ -64,8 +64,8 @@
</el-form-item>
</template>
</drawer-form>
<el-dialog title="审核广告" :visible.sync="dialogVisible" width="460px" append-to-body :destroy-on-close="true">
<review-form @dialogClose="dialogVisible = false" @reviewSubmit="handleReviewSubmit" />
<el-dialog title="审核广告" :visible.sync="dialogVisible" width="460px" append-to-body :destroy-on-close="true" ref="auditDialog">
<audit-form @dialogClose="dialogVisible = false" @auditSubmit="handleAuditSubmit" />
</el-dialog>
</el-drawer>
</div>
......@@ -73,10 +73,10 @@
<script>
import TableList from '@/components/TableList'
import DrawerForm from '../components/DrawerForm.vue'
import ReviewForm from '../components/ReviewForm.vue'
import { getAdList, publishAd } from '@/api/contentManage'
import AuditForm from '../components/AuditForm.vue'
import { getAdList, createAd, publishAd, updateAd, auditAd } from '@/api/contentManage'
export default {
components: { TableList, DrawerForm, ReviewForm },
components: { TableList, DrawerForm, AuditForm },
data() {
return {
activeName: '',
......@@ -92,7 +92,7 @@ export default {
],
drawFormOptions: {
type: '',
page: 'ads',
pageType: 2,
details: {}
},
drawItem: '',
......@@ -179,38 +179,62 @@ export default {
this.drawerVisible = true
},
handleDetails(val) {
console.log(val)
this.drawItem = val
this.drawFormOptions.type = 'details'
this.drawFormOptions.details = {
project_id: '111',
type_id: '111',
title: '3232',
uri: 'https://www.baidu.com',
summary: '内容摘要',
remarks: '注意事项',
web_img_uri: 'https://zj-images.oss-cn-beijing.aliyuncs.com/00d78a3a999f4b10000f2cd422232221.JPG',
mobile_terminal_img_uri: 'https://zj-images.oss-cn-beijing.aliyuncs.com/00d78a3a999f4b10000f2cd422232221.JPG',
enclosure_uri: 'https://zj-images.oss-cn-beijing.aliyuncs.com/00d78a3a999f4b10000f2cd422232221.JPG',
video_uri: 'https://zj-images.oss-cn-beijing.aliyuncs.com/00d78a3a999f4b10000f2cd422232221.JPG',
start_time: '2021-01-01 08:33:22',
hasEndDate: 1,
end_time: '2021-01-05 08:33:22',
is_publish: 1,
is_top: 1,
weight: 10,
review_status: 1
}
this.drawFormOptions.details = val
this.drawerVisible = true
},
HandleDrawFormSubmit(val) {
console.log(val)
Object.keys(val).forEach(key => {
if (val[key] === '') delete val[key]
})
if (this.drawFormOptions.type === 'create') {
this.fetchCreateAd(val)
} else {
this.fetchUpdateAd(val)
}
},
handleReviewSubmit(val) {
console.log(val)
handleAuditSubmit(val) {
this.fetchAuditAd(val)
},
handleTabClick() {
// true 强制刷新
this.$refs.tableList.refetch(true)
},
fetchCreateAd(val) {
delete val.is_publish
createAd(val).then(res => {
if (res.code === 0 && res.data && res.data.id) {
this.$message.success('新建广告成功')
this.$refs.tableList.refetch()
this.$refs.ad_drawer.closeDrawer()
} else {
this.$message.error(res.message || '新建广告失败')
}
})
},
fetchUpdateAd(val) {
updateAd(this.drawItem.id, val).then(res => {
if (res.code === 0 && res.data && res.data.status) {
this.$message.success('更改广告成功')
this.$refs.tableList.refetch()
this.$refs.ad_drawer.closeDrawer()
} else {
this.$message.error(res.message || '更改广告失败')
}
})
},
fetchAuditAd(val) {
auditAd(this.drawItem.id, val).then(res => {
if (res.code === 0 && res.data && res.data.status) {
this.$message.success('审核广告成功')
this.$refs.tableList.refetch()
this.dialogVisible = false
} else {
this.$message.error(res.message || '审核广告失败')
}
})
}
}
}
......
src/pages/content-manage/article/index.vue
浏览文件 @ b0bd4238
......@@ -86,7 +86,7 @@ export default {
],
drawFormOptions: {
type: '',
page: 'article'
pageType: 1
},
drawItem: '',
dialogVisible: false
......
src/pages/content-manage/components/ReviewForm.vue → src/pages/content-manage/components/AuditForm.vue
浏览文件 @ b0bd4238
<template>
<el-form :model="reviewForm" :rules="rules" ref="ruleForm" label-width="90px">
<el-form-item label="审核结果" prop="result">
<el-select v-model="reviewForm.result" placeholder="请选择审核结果" size="small" style="width:100%;">
<el-option label="通过" :value="1"></el-option>
<el-option label="不通过" :value="0"></el-option>
<el-form :model="form" :rules="rules" ref="ruleForm" label-width="90px">
<el-form-item label="审核结果" prop="audit_status">
<el-select v-model="form.audit_status" placeholder="请选择审核结果" size="small" style="width:100%;">
<el-option label="通过" :value="2"></el-option>
<el-option label="驳回" :value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="审核评审" prop="text">
<el-input v-model="reviewForm.text" type="textarea" size="small" rows="4" placeholder="请输入审核评审"/>
<el-form-item label="审核评审" prop="audit_remarks">
<el-input v-model="form.audit_remarks" type="textarea" size="small" rows="4" placeholder="请输入审核评审"/>
</el-form-item>
<el-form-item>
<el-button size="mini" @click="$emit('dialogClose')">取消</el-button>
<el-button type="primary" @click="handleReviewSubmit" size="mini">提交</el-button>
<el-button type="primary" @click="handleSubmit" size="mini">提交</el-button>
</el-form-item>
</el-form>
</template>
......@@ -19,21 +19,21 @@
export default {
data() {
return {
reviewForm: {
result: '',
text: ''
form: {
audit_status: '',
audit_remarks: ''
},
rules: {
result: [{ required: true, message: '请选择审核结果', trigger: 'change' }],
text: [{ required: true, message: '请输入审核评审', trigger: 'blur' }]
audit_status: [{ required: true, message: '请选择审核结果', trigger: 'change' }],
audit_remarks: [{ required: true, message: '请输入审核评审', trigger: 'blur' }]
}
}
},
methods: {
handleReviewSubmit() {
handleSubmit() {
this.$refs.ruleForm.validate((valid) => {
if (valid) {
this.$emit('reviewSubmit', this.reviewForm)
this.$emit('auditSubmit', this.form)
}
});
}
......
src/pages/content-manage/components/DrawerForm.vue
浏览文件 @ b0bd4238
......@@ -4,14 +4,14 @@
<el-form-item label="项目：" prop="project_id">
<el-col :span="12">
<el-select v-model="form.project_id" placeholder="请选择项目" size="small" style="width: 100%" clearable :disabled="isDetails">
<el-option v-for="item in projectList" :label="item.project_name" :value="item.project_id" :key="item.project_id"></el-option>
<el-option v-for="item in projects" :label="item.name" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="类型：" prop="type_id">
<el-col :span="12">
<el-select v-model="form.type_id" placeholder="请选择类型" size="small" style="width: 100%" clearable :disabled="isDetails">
<el-option v-for="item in typeList" :label="item.type_name" :value="item.type_id" :key="item.type_id"></el-option>
<el-select v-model="form.type_id" placeholder="请选择类型" size="small" style="width: 100%" clearable :disabled="isDetails || !form.project_id">
<el-option v-for="item in typeList" :label="item.name" :value="item.id" :key="item.id"></el-option>
</el-select>
</el-col>
</el-form-item>
......@@ -21,13 +21,13 @@
<el-form-item label="跳转链接：" style="margin-right:15px;">
<el-input v-model="form.uri" placeholder="请输入跳转链接" size="small" :disabled="isDetails"/>
</el-form-item>
<el-form-item v-if="pageName !== 'ads'" label="摘要：" prop="summary" :rules="{required: true, message: '请输入摘要', trigger: 'blur'}" style="margin-right:15px;">
<el-input type="textarea" v-model="form.summary" placeholder="请输入摘要" size="small" rows="4" :disabled="isDetails"/>
<el-form-item v-if="pageType !== 2" label="摘要：" prop="abstract" :rules="{required: true, message: '请输入摘要', trigger: 'blur'}" style="margin-right:15px;">
<el-input type="textarea" v-model="form.abstract" placeholder="请输入摘要" size="small" rows="4" :disabled="isDetails"/>
</el-form-item>
<el-form-item label="备注：" prop="remarks" style="margin-right:15px;">
<el-input type="textarea" v-model="form.remarks" placeholder="请输入备注" size="small" rows="4" :disabled="isDetails"/>
</el-form-item>
<el-form-item ref="el-form-item-tinymce" v-if="pageName === 'article'" label="正文：" prop="content" :rules="{required: true, message: '请输入正文', trigger: 'blur'}" style="margin-right:15px;">
<el-form-item ref="el-form-item-tinymce" v-if="pageType === 1" label="正文：" prop="content" :rules="{required: true, message: '请输入正文', trigger: 'blur'}" style="margin-right:15px;">
<Tinymce ref="editor" v-model="form.content" :readonly="isDetails" :height="400" @blur="tinymceBlur" />
</el-form-item>
</div>
......@@ -38,7 +38,7 @@
class="avatar-uploader"
action="https://baidu.com"
:show-file-list="false"
:before-upload="val => beforeAvatarUpload(val, 'pc_img')">
:before-upload="val => beforeUpload(val, 'web_img_uri')">
<img v-if="form.web_img_uri" :src="form.web_img_uri" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
......@@ -50,7 +50,7 @@
action="https://baidu.com"
class="avatar-uploader"
:show-file-list="false"
:before-upload="val => beforeAvatarUpload(val, 'mobile_img')">
:before-upload="val => beforeUpload(val, 'mobile_terminal_img_uri')">
<img v-if="form.mobile_terminal_img_uri" :src="form.mobile_terminal_img_uri" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
......@@ -63,10 +63,10 @@
class="file-uploader"
ref="upload"
:show-file-list="false"
:before-upload="val => beforeAvatarUpload(val, 'file')">
:before-upload="val => beforeUpload(val, 'enclosure_uri')">
<el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传文件</el-button>
</el-upload>
<p class="des">请上传文件，最多上传一份<br>支持：word、excel、pdf</p>
<p class="des"><i class="el-icon-circle-check" v-if="form.enclosure_uri"></i>请上传文件，最多上传一份<br>支持：word、excel、pdf</p>
</el-form-item>
<el-form-item label="上传视频：" class="file-upload">
<el-upload
......@@ -75,34 +75,39 @@
class="file-uploader"
ref="upload"
:show-file-list="false"
:before-upload="val => beforeAvatarUpload(val, 'video')">
:before-upload="val => beforeUpload(val, 'video_uri')">
<el-button slot="trigger" size="small" type="primary" :disabled="isDetails">上传视频</el-button>
</el-upload>
<p class="des">请上传文件，最多上传一份<br>支持：MP4</p>
<p class="des"><i class="el-icon-circle-check" v-if="form.video_uri"></i>请上传文件，最多上传一份<br>支持：MP4</p>
</el-form-item>
<el-form-item label="开始时间：" prop="start_time">
<el-date-picker v-model="form.start_time" type="date" placeholder="选择开始时间" size="small" clearable :disabled="isDetails"/>
<el-date-picker v-model="form.start_time" type="datetime" placeholder="选择开始时间" size="small" clearable :disabled="isDetails"/>
</el-form-item>
<el-form-item label="结束时间：" required class="mb-15">
<el-form-item label="结束时间：" :required="form.hasEndDate===1" class="mb-15">
<el-switch v-model="form.hasEndDate" :active-value="1" :inactive-value="0" active-text="有" inactive-text="无" :disabled="isDetails"></el-switch>
<el-date-picker v-if="form.hasEndDate" v-model="form.end_time" type="date" placeholder="选择结束时间" size="small" clearable :disabled="isDetails"/>
<el-date-picker v-if="form.hasEndDate" v-model="form.end_time" type="datetime" placeholder="选择结束时间" size="small" clearable :disabled="isDetails"/>
</el-form-item>
<el-form-item label="发布状态：" class="mb-15">
<el-form-item label="发布状态：" class="mb-15" v-if="!isCreate">
<el-switch v-model="form.is_publish" :active-value="1" :inactive-value="0" active-text="开" inactive-text="关" :disabled="isDetails"></el-switch>
</el-form-item>
<el-form-item label="置顶状态：" class="mb-15" v-if="pageName !== 'image-text'">
<el-form-item label="置顶状态：" class="mb-15" v-if="pageType !== 3">
<el-switch v-model="form.is_top" :active-value="1" :inactive-value="0" active-text="开" inactive-text="关" :disabled="isDetails"></el-switch>
<el-input-number size="small" v-model="form.weight" :min="0" :disabled="isDetails"></el-input-number>
<el-select v-model="form.weight" placeholder="请选择权重" size="small" clearable :disabled="isDetails">
<el-option v-for="item in 10" :label="item" :value="item" :key="item"></el-option>
</el-select>
</el-form-item>
<el-form-item label="推荐状态：" class="mb-15" v-if="pageType === 1">
<el-switch v-model="form.is_recommend" :active-value="1" :inactive-value="0" active-text="开" inactive-text="关" :disabled="isDetails"></el-switch>
</el-form-item>
<el-form-item v-if="!isDetails" class="mb-15">
<el-button @click="handleClose" size="mini">取消</el-button>
<el-button type="primary" @click="submitForm('ruleForm')" size="mini">保存</el-button>
</el-form-item>
<el-form-item label="审核状态：" v-if="isDetails" class="mb-15">
{{options.details.review_status | reviewStatus}}
{{options.details.audit_status | reviewStatus}}
</el-form-item>
<el-form-item label="审核评审：" v-if="isDetails" class="mb-15">
{{options.details.review_word || ''}}
{{options.details.audit_remarks}}
</el-form-item>
<slot name="form-item-review" v-if="isDetails"/>
<!-- <el-form-item v-if="isDetails">
......@@ -113,6 +118,30 @@
</template>
<script>
import Tinymce from '@/components/Tinymce'
import { getProjectContentTypeList } from '@/api/contentManage'
import { fileUpload } from '@/api/system'
import { mapGetters } from 'vuex'
import { formatToDate } from '@/utils/utils'
const defaultForm = {
project_id: '',
type_id: '',
title: '',
uri: '',
abstract: '',
remarks: '',
content: '',
web_img_uri: '',
mobile_terminal_img_uri: '',
enclosure_uri: '',
video_uri: '',
start_time: '',
hasEndDate: 0,
end_time: '',
is_publish: 0,
is_top: 0,
weight: 0,
is_recommend: 0
}
export default {
props: {
options: {
......@@ -124,11 +153,11 @@ export default {
reviewStatus(val) {
let text = '待审核'
switch (val) {
case 1:
text = '通过'
break
case 2:
text = '不通过'
text = '已通过'
break
case 3:
text = '已驳回'
break
}
return text
......@@ -136,34 +165,8 @@ export default {
},
data() {
return {
projectList: [
{ project_id: '111', project_name: '官网' },
{ project_id: '222', project_name: 'kellet' }
],
typeList: [
{ type_id: '111', type_name: 'banner广告' },
{ type_id: '222', type_name: '侧边栏广告' },
{ type_id: '333', type_name: '正文区广告' }
],
form: {
project_id: '',
type_id: '',
title: '',
uri: '',
summary: '',
remarks: '',
content: '',
web_img_uri: '',
mobile_terminal_img_uri: '',
enclosure_uri: '',
video_uri: '',
start_time: '',
hasEndDate: 1,
end_time: '',
is_publish: 1,
is_top: 1,
weight: 10
},
typeList: [],
form: Object.assign({}, defaultForm),
rules: {
project_id: [
{ required: true, message: '请选择项目', trigger: 'change' }
......@@ -181,52 +184,117 @@ export default {
}
},
computed: {
...mapGetters(['projects']),
pageName() {
return this.options.page
},
pageType() {
return this.options.pageType
},
isDetails() {
return this.options.type === 'details'
},
isCreate() {
return this.options.type === 'create'
}
},
watch: {
'form.project_id': {
handler: function(nv) {
if (nv) {
this.fetchContentTypeList()
}
},
immediate: true
}
},
created() {
if (this.isDetails) {
const details = this.options.details
this.deepSet(this.form, details)
Object.keys(this.form).forEach(key => {
if (typeof details[key] !== 'undefined') {
this.form[key] = details[key]
}
})
console.log(this.form)
if (this.form.end_time) {
this.form.hasEndDate = 1
this.form.end_time = formatToDate(this.form.end_time)
} else {
this.form.end_time = ''
}
if (this.form.start_time === 0) {
this.form.start_time = ''
} else {
this.form.start_time = formatToDate(this.form.start_time)
}
}
},
methods: {
deepSet(obj, source) {
for (const key in source) {
const sourceVal = source[key]
if (Array.isArray(sourceVal)) {
obj[key] = sourceVal
} else if (typeof sourceVal === 'object' && !(sourceVal instanceof Date)) {
const val = obj[key]
this.deepSet(val, sourceVal)
} else {
obj[key] = sourceVal
}
beforeUpload(file, target) {
const type = ['enclosure_uri', 'video_uri'].includes(target) ? 'file' : 'image'
switch (target) {
case 'web_img_uri':
case 'mobile_terminal_img_uri':
console.log(file)
break
case 'enclosure_uri':
console.log(file)
break
case 'video_uri':
console.log(file)
break
}
},
beforeAvatarUpload(file, type) {
console.log(file)
console.log(type)
this.fetchUpload(file, type, target)
return false
},
handleClose() {
this.$emit('drawFormClose')
this.form = Object.assign({}, defaultForm)
},
tinymceBlur() {
this.$refs['el-form-item-tinymce'].$emit('el.form.blur')
},
submitForm(formName) {
this.$refs[formName].validate(valid => {
const form = { ...this.form }
if (valid) {
this.$emit('drawFormSubmit', this.form)
if (form.start_time) {
form.start_time = this.toUnitTimestamp(form.start_time)
}
if (form.hasEndDate === 1) {
form.end_time = this.toUnitTimestamp(form.end_time)
} else {
delete form.end_time
}
delete form.hasEndDate
this.$emit('drawFormSubmit', form)
} else {
return false
}
})
},
toUnitTimestamp(time) {
return formatToDate(time).getTime() / 1000
},
fetchContentTypeList() {
if (this.form.project_id) {
getProjectContentTypeList(this.pageType, this.form.project_id).then((res) => {
if (res.code === 0 && Array.isArray(res.data)) {
this.typeList = res.data
}
})
}
},
fetchUpload(file, type, target) {
const formData = new window.FormData()
formData.append('file', file)
formData.append('type', type)
fileUpload(formData).then(res => {
if (res.code === 0 && res.message === 'SUCCESS') {
this.form[target] = res.data[0].full_path
}
})
}
}
}
......@@ -254,6 +322,14 @@ export default {
color: #c9c9c9;
line-height:24px;
font-size:12px;
position:relative;
}
.el-form-item.file-upload .des>i{
position:absolute;
left:-40px;
top:14px;
color: #67c23a;
font-size:16px;
}
.el-form-item.file-upload:not(.is-required){
margin-bottom:5px;
......
src/pages/content-manage/image-text/index.vue
浏览文件 @ b0bd4238
......@@ -82,7 +82,7 @@ export default {
],
drawFormOptions: {
type: '',
page: 'image-text'
pageType: 3
},
drawItem: '',
dialogVisible: false
......
src/pages/settings/staff/index.vue
浏览文件 @ b0bd4238
......@@ -78,8 +78,8 @@
</div>
</div>
</el-drawer>
<el-dialog :title="dialogTitle" ref="dialogForm" :visible.sync="dialogVisible" width="440px" :destroy-on-close="true">
<el-form :model="dialogForm" label-width="80px" class="dialog-form">
<el-dialog :title="dialogTitle" :visible.sync="dialogVisible" width="440px" :destroy-on-close="true">
<el-form :model="dialogForm" ref="dialogForm" label-width="80px" class="dialog-form">
<template v-if="dialogType === 'pwd'">
<el-form-item label="新密码" prop="password" :rules="{ required: true, message: '请输入新密码', trigger: 'blur' }">
<el-input v-model="dialogForm.password" size="small"></el-input>
......@@ -87,6 +87,20 @@
<el-form-item label="确认密码" prop="ensurePassword" :rules="[{ required: true, message: '请输入确认密码', trigger: 'blur' }, { validator: (rule, value, callback) => checkedDialogForm(dialogForm.password, value, callback, '密码'), trigger: 'blur' }]">
<el-input v-model="dialogForm.ensurePassword" size="small"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phone" :rules="{ validator: checkedMobile, trigger: 'blur' }">
<el-input v-model="dialogForm.phone" size="small"></el-input>
</el-form-item>
<el-form-item label="验证码" prop="code" :rules="{ required: true, message: '请输入验证码', trigger: 'blur' }">
<el-col :span="16">
<el-form-item prop="endDate"></el-form-item>
<el-input v-model="dialogForm.code" size="small"></el-input>
</el-col>
<el-col :span="7" style="float:right">
<el-button type="primary" @click="sendCode" size="small" style="width:100%;" id="checkedCode" :disabled="isBtnDisabled">
获取验证码
</el-button>
</el-col>
</el-form-item>
</template>
<template v-if="dialogType === 'phone'">
<el-form-item label="新手机号" prop="phone" :rules="[{ required: true, message: '请输入手机号', trigger: 'blur' }, { validator: checkedMobile, trigger: 'blur' }]">
......@@ -107,6 +121,7 @@
<script>
import TableList from '@/components/TableList'
import { getStaffList, getProjectList, getRoleList, createStaff, updateStaff } from '@/api/settings'
import { sendCode } from '@/api/account'
import { searchUserList } from '@/api/system'
const MOBILE_REG = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{4,8}$/
const EMAIL_REG = /^[A-Za-z0-9]+([_.][A-Za-z0-9]+)*@[A-Za-z0-9-.]+$/
......@@ -118,15 +133,17 @@ const drawerForm = {
const dialogForm = {
password: '',
ensurePassword: '',
code: '',
phone: '',
ensurePhone: ''
}
export default {
components: { TableList },
data() {
const mobileReg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{4,8}$/
const checkMobile = (rule, value, callback) => {
if (value) {
if (!MOBILE_REG.test(value)) {
if (!mobileReg.test(value)) {
callback(new Error('手机号格式错误'));
} else {
callback()
......@@ -153,7 +170,8 @@ export default {
dialogType: '',
operateItem: '',
dialogForm: Object.assign({}, dialogForm),
checkedMobile: checkMobile
checkedMobile: checkMobile,
isBtnDisabled: false
}
},
computed: {
......@@ -224,7 +242,7 @@ export default {
},
handleDialogClose() {
this.drawerVisible = false
this.form = Object.assign({}, drawerForm)
this.form = Object.assign({}, dialogForm)
},
handleCheckAllChange(val) {
this.form.project = val ? this.projectList.map(item => item.project_id) : [];
......@@ -247,6 +265,34 @@ export default {
this.dialogVisible = true
this.dialogType = 'pwd'
},
sendCode() {
console.log(this.dialogForm)
if (!this.dialogForm.phone) {
this.$message('请填写手机号')
} else if (!MOBILE_REG.test(this.dialogForm.phone)) {
this.$message('手机号格式错误')
} else {
this.fetchSendCode()
this.isBtnDisabled = true
this.btnDisabledTimer()
}
},
// 发送验证码按钮计时器
btnDisabledTimer() {
let count = 3
const btnEl = document.querySelector('#checkedCode')
btnEl.innerHTML = count + '秒后重发'
const timer = setInterval(() => {
count--
if (count < 1) {
clearInterval(timer)
this.isBtnDisabled = false
btnEl.innerHTML = '获取验证码'
} else {
btnEl.innerHTML = count + '秒后重发'
}
}, 1000)
},
// 更换手机号
changePhone(data) {
this.operateItem = data
......@@ -290,6 +336,19 @@ export default {
}
})
},
fetchSendCode() {
const params = {
account: this.dialogForm.phone,
service: 'ezijing.com'
}
sendCode(params).then(res => {
if (res && res.code === 0) {
this.$message.success('验证码发送成功')
} else {
this.$message.error(res.msg || '发送验证码失败')
}
})
},
fetchCreateStaff() {
createStaff(this.form).then((res) => {
if (res.code === 0 && res.data && res.data.id) {
......
src/store/getters.js
浏览文件 @ b0bd4238
......@@ -2,6 +2,7 @@ const getters = {
user: state => state.user.user,
roles: state => state.user.roles,
sidebar: state => state.app.sidebar,
permission_routes: state => state.permission.routes
permission_routes: state => state.permission.routes,
projects: state => state.user.projects
}
export default getters
src/store/modules/user.js
浏览文件 @ b0bd4238
......@@ -5,9 +5,9 @@ const user = {
state: {
user: {},
isLogin: false,
hasRolesPermissions: false,
roles: null,
permissions: null
permissions: null,
projects: []
},
mutations: {
......@@ -23,8 +23,8 @@ const user = {
setPermissions(state, permissions) {
state.permissions = permissions
},
setHasRolesPermissions(state, hasRolesPermissions) {
state.hasRolesPermissions = hasRolesPermissions
setProjects(state, projects) {
state.projects = projects
}
},
......@@ -73,12 +73,18 @@ const user = {
permissions = data.permissions
}
commit('setPermissions', permissions)
if (data.projects && Array.isArray(data.projects)) {
commit('setProjects', data.projects)
} else {
commit('setProjects', [])
}
} else {
// window.location.href = `${webConf.others.loginUrl}?rd=${encodeURIComponent(window.location.href)}`
}
}).catch(() => {
commit('setRoles', null)
commit('setPermissions', null)
commit('setProjects', [])
})
}
}
......
src/utils/axios.js
浏览文件 @ b0bd4238
......@@ -14,15 +14,21 @@ httpRequest.interceptors.request.use(
function(config) {
const defaultParams = {
timestamp: parseInt(Date.now() / 1000),
nonce: getNonce(9),
nonce: getNonce(12),
signature: 'UG7wBenexQhiuD2wpCwuxkU0jqcj006d'
}
let params = config.params || config.data
params = Object.assign({}, defaultParams, params)
if (['post', 'put', 'delete'].includes(config.method)) {
config.data = params
if (config.headers['Content-Type'] === 'multipart/form-data') {
Object.keys(defaultParams).forEach(key => {
params.append(key, defaultParams[key])
})
} else {
config.params = params
params = Object.assign({}, defaultParams, params)
if (['post', 'put', 'delete'].includes(config.method)) {
config.data = params
} else {
config.params = params
}
}
if (config.headers['Content-Type'] === 'application/x-www-form-urlencoded') {
config.data = qs.stringify(config.data)
......
src/utils/utils.js
浏览文件 @ b0bd4238
......@@ -18,3 +18,30 @@ export function getNonce(length) {
}
return str
}
/**
* 将时间字符串、时间戳转成日期对象
* @param {(object|string|number)} time
* @returns {Date Object}
*/
export function formatToDate(time) {
let date
if (typeof time === 'object') {
date = time
} else {
if (typeof time === 'string') {
if (/^[0-9]+$/.test(time)) {
// support "1548221490638"
time = parseInt(time)
} else {
// support safari
// https://stackoverflow.com/questions/4310953/invalid-date-in-safari
time = time.replace(new RegExp(/-/gm), '/')
}
}
if (typeof time === 'number' && time.toString().length === 10) {
time = time * 1000
}
date = new Date(time)
}
return date
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论