Skip to content

GitLab

Q
qk_admin
Commit 4ba687ff authored by yaya's avatar yaya
Browse files
Options

feat:添加邀请码添加功能

parent be0a9ec2
Show whitespace changes
Inline Side-by-side
Showing with 295 additions and 19 deletions
src/api/business/invite.js
View file @ 4ba687ff
......@@ -7,3 +7,24 @@ export function fetchList(params) {
data: params
})
}
export function setInvalid(params) {
return request({
url: '/invitationCode/setInvalid',
method: 'post',
data: params
})
}
export function getUserList(params) {
return request({
url: '/user/findList',
method: 'post',
data: params
})
}
export function invitationCodeCreat(params) {
return request({
url: '/invitationCode/create',
method: 'post',
data: params
})
}
src/router/index.js
View file @ 4ba687ff
......@@ -154,6 +154,18 @@ export const asyncRouterMap = [
icon: 'user',
noCache: true
}
},
{
path: 'addInvite',
component: () => import('@/views/user/addInvite'),
name: 'inviteList',
meta: {
perms: ['POST /invitationCode/create'],
title: '生成邀请码',
icon: 'user',
noCache: true
},
hidden: true
}
]
},
......
src/views/user/addInvite.vue 0 → 100644
View file @ 4ba687ff
<template>
<div class="page_addInvite">
<el-card class="box-card">
<h3>生成邀请码</h3>
<el-form ref="addInviteRef" :rules="rules" :model="inviteInfo" label-width="100px">
<el-form-item label="有效期" prop="timeList" require>
<el-date-picker
v-model="inviteInfo.timeList"
:picker-options="pickerOptions2"
style="width: 400px"
type="daterange"
align="right"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd"
@change="handleDateChange" />
</el-form-item>
<el-form-item label="使用人数" prop="enabledNum">
<el-input v-model="inviteInfo.enabledNum" style="width: 400px" placeholder="请输入使用人数" type="number"/>
</el-form-item>
<el-form-item label="邀请人" prop="applicant">
<el-cascader
:options="userList"
:clearable="true"
v-model="inviteInfo.applicant"
filterable
style="width: 400px"
@input.native="handleInputChange"
@change="handleCategoryChange"/>
</el-form-item>
<el-form-item label="备注">
<!-- <editor :init="editorInit" :style="{'min-height':'800px' }" v-model="goods.detail"/>-->
<el-input
v-model="inviteInfo.detail"
:rows="6"
type="textarea"
placeholder="请输入备注"/>
</el-form-item>
</el-form>
</el-card>
<div class="op-container">
<el-button @click="handleCancel">取消</el-button>
<el-button type="primary" @click="handlePublish">立即生成</el-button>
</div>
</div>
</template>
<script>
import { getUserList, invitationCodeCreat } from '@/api/business/invite'
export default {
name: 'AddInvite',
data() {
return {
inviteInfo: {},
userList: [],
rules: {
timeList: [{ required: true, message: '请选择有效时间', trigger: 'blur' }],
enabledNum: [{ required: true, message: '请输入使用人数', trigger: 'blur' }],
applicant: [{ required: true, message: '邀请人不能为空', trigger: 'blur' }]
},
pickerOptions2: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
}, {
text: '最近一个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
}, {
text: '最近三个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
picker.$emit('pick', [start, end])
}
}]
},
value6: '',
value7: ''
}
},
created() {
this.handleGetUserList()
},
methods: {
handleCancel() {
},
handlePublish() {
this.$refs.addInviteRef.validate((valid) => {
if (valid) {
invitationCodeCreat(this.inviteInfo)
.then(response => {
this.$notify.success({
title: '成功',
message: '生成邀请码成功'
})
this.$router.push({ path: '/user/inviteList' })
})
.catch(response => {
this.$notify.error({
title: '失败',
message: response.data.errmsg
})
})
}
})
},
handleDateChange(value) {
console.log('====date==', value)
this.inviteInfo.timeList = value
this.inviteInfo.effectiveStartTime = value[0]
this.inviteInfo.effectiveEndTime = value[1]
},
handleCategoryChange(value) {
console.log('====value==', value)
this.inviteInfo.applicant = value[0]
},
handleInputChange(el) {
this.handleGetUserList(el.target.value)
},
handleGetUserList(name) {
const params = {
page: 1,
size: 100,
name: name
}
getUserList(params)
.then(response => {
if (response.data.data) {
this.userList = response.data.data.map((item) => {
return {
value: item.id,
label: item.name
}
})
console.log('===userList=', this.userList)
}
})
.catch(response => {
console.log('====error==', response)
this.$notify.error({
title: '失败',
message: response.data.errmsg
})
})
}
}
}
</script>
<style scoped>
.page_addInvite {
padding: 20px;
}
.op-container {
margin-top: 20px;
}
</style>
src/views/user/inviteList.vue
View file @ 4ba687ff
......@@ -30,23 +30,27 @@
<el-table-column align="center" label="创建时间" prop="createTime"/>
<el-table-column align="center" label="操作" width="300" class-name="small-padding fixed-width">
<el-table-column align="center" label="操作" width="250" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
v-permission="['GET /admin/user/detailApprove']"
type="primary"
type="text"
size="mini"
@click="handleToDetail(scope.row)">详情
</el-button>
<el-button
v-permission="['POST /admin/user/approveAgency']"
type="primary"
type="text"
size="mini"
style="width: 100px"
@click="handleCopyCode(scope.row)">
复制邀请码
</el-button>
<el-button v-permission="['GET /admin/user/detailApprove']" type="primary" size="mini">失效</el-button>
<el-button
v-permission="['GET /admin/user/detailApprove']"
:disabled="scope.row.state > 1"
type="text"
size="mini"
@click="handleSetEnable(scope.row)">失效</el-button>
</template>
</el-table-column>
......@@ -63,7 +67,7 @@
</template>
<script>
import { fetchList } from '@/api/business/invite'
import { fetchList, setInvalid } from '@/api/business/invite'
import Pagination from '@/components/Pagination'
export default {
name: 'InviteList',
......@@ -87,28 +91,88 @@ export default {
},
methods: {
handleAdd() {
this.$router.push({ path: '/user/addInvite' })
},
handleToDetail() {
},
handleCopyCode() {
handleSetEnable(row) {
const params = {
code: row.code
}
setInvalid(params).then(response => {
this.list = this.list.filter((item) => {
if (item.code === row.code) {
item.state = 6
return item
}
return item
})
this.$notify.success({
message: '设置失效成功'
})
}).catch((e) => {
})
},
/**
* 复制
*/
handleCopyCode(row) {
// 复制结果
let copyResult = true
// 设置想要复制的文本内容
if (!row.code) {
return
}
const text = `藏家相册注册邀请码${row.code}，最多可使用${row.enabledNum || 0}次，机会难得，快去体验吧～`
// 判断是否支持clipboard方式
if (window.navigator.clipboard) {
// 利用clipboard将文本写入剪贴板（这是一个异步promise）
window.navigator.clipboard.writeText(text).then((res) => {
console.log('复制成功')
// 返回复制操作的最终结果
return copyResult
}).catch((err) => {
copyResult = false
console.log('复制失败', err)
// 返回复制操作的最终结果
return copyResult
})
} else {
// 不支持clipboard方式 则采用document.execCommand()方式
// 创建一个input元素
const inputDom = document.createElement('textarea')
// 设置为只读 防止移动端手机上弹出软键盘
inputDom.setAttribute('readonly', 'readonly')
// 给input元素赋值
inputDom.value = text
// 将创建的input添加到body
document.body.appendChild(inputDom)
// 选中input元素的内容
inputDom.select()
// 执行浏览器复制命令
// 复制命令会将当前选中的内容复制到剪切板中（这里就是创建的input标签中的内容）
// Input要在正常的编辑状态下原生复制方法才会生效
const result = document.execCommand('copy')
// 判断是否复制成功
if (result) {
console.log('复制成功')
} else {
console.log('复制失败')
copyResult = false
}
// 复制操作后再将构造的标签 移除
document.body.removeChild(inputDom)
// 返回复制操作的最终结果
}
this.$notify.success({
message: '邀请码已复制，快去分享给好友吧～'
})
},
getList() {
this.listLoading = true
fetchList(this.listQuery).then(response => {
this.list = response.data.data.dataList
/* this.list = (response.data.data.dataList || []).map((e, index) => {
let imageList = e.images || []
if (e.topImage && imageList.indexOf(e.topImage) === -1) {
imageList = [e.topImage].concat(imageList)
}
return {
...e,
imageList: imageList
}
})*/
this.total = response.data.data.total
this.listLoading = false
}).catch((e) => {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment