agent allow store + update + delete

This commit is contained in:
xiaomlove
2021-04-16 19:04:01 +08:00
parent dc7aa33036
commit d734788363
10 changed files with 240 additions and 150 deletions

6
admin/src/main.js vendored
View File

@@ -2,6 +2,8 @@ import { createApp } from 'vue'
import { ElButton, ElContainer, ElAside, ElHeader, ElMain, ElFooter, ElMenu, ElSubmenu, ElMenuItemGroup, ElMenuItem, ElForm, ElFormItem, ElInput, ElPopover, ElTag, ElCard, ElTable, ElTableColumn, ElPagination, ElDialog, ElPopconfirm, ElUpload, ElLoading, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCascader, ElCheckbox, ElInputNumber } from 'element-plus'
import App from './App.vue'
import router from './router/index'
import 'dayjs/locale/zh-cn'
import locale from 'element-plus/lib/locale/lang/zh-cn'
// import 'element-plus/lib/theme-chalk/index.css'
@@ -60,8 +62,8 @@ app.use(ElButton)
.use(ElSubmenu)
.use(ElMenuItemGroup)
.use(ElMenuItem)
.use(ElForm)
.use(ElFormItem)
.use(ElForm, { locale })
.use(ElFormItem, { locale })
.use(ElInput)
.use(ElPopover)
.use(ElTag)

View File

@@ -92,7 +92,12 @@ const router = createRouter({
{
path: '/agent-allow',
name: 'agent-allow',
component: () => import(/* webpackChunkName: "account" */ '../views/AgentAllow/index.vue')
component: () => import(/* webpackChunkName: "account" */ '../views/AgentAllow/index.vue'),
},
{
path: '/agent-allow-form',
name: 'agent-allow-form',
component: () => import(/* webpackChunkName: "account" */ '../views/AgentAllow/form.vue'),
}
]
})

View File

@@ -2,10 +2,23 @@ import axios from "./axios";
const baseUrl = 'http://nexus-php8.tinyhd.net/api/';
const api = {
listAllowAgent: (params = {}) => {
return axios.get(baseUrl + 'agent-allow', {params: params});
}
},
storeAllowAgent: (params = {}) => {
return axios.post(baseUrl + 'agent-allow', params);
},
updateAllowAgent: (id, params = {}) => {
return axios.put(baseUrl + 'agent-allow/' + id, params);
},
getAllowAgent: (id) => {
return axios.get(baseUrl + 'agent-allow/' + id);
},
deleteAllowAgent: (id) => {
return axios.delete(baseUrl + 'agent-allow/' + id);
},
}
export default api

View File

@@ -22,6 +22,10 @@ axios.interceptors.response.use(res => {
ElMessage.error('服务端异常!')
return Promise.reject(res)
}
if (res.data.data.ret && res.data.data.ret != 0) {
ElMessage.error(res.data.data.msg)
return Promise.reject(res)
}
if (res.data.resultCode && res.data.resultCode != 200) {
if (res.data.message) ElMessage.error(res.data.message)
if (res.data.resultCode == 419) {
@@ -29,7 +33,6 @@ axios.interceptors.response.use(res => {
}
return Promise.reject(res.data)
}
return res.data.data
})

View File

@@ -1,82 +1,170 @@
<template>
<el-dialog
:title="type == 'add' ? '添加轮播图' : '修改轮播图'"
v-model="visible"
width="400px"
>
<el-form :model="ruleForm" :rules="rules" ref="formRef" label-width="100px" class="good-form">
<el-form-item label="图片" prop="url">
<el-upload
class="avatar-uploader"
:action="uploadImgServer"
accept="jpg,jpeg,png"
:headers="{
token: token
}"
:show-file-list="false"
:before-upload="handleBeforeUpload"
:on-success="handleUrlSuccess"
>
<img style="width: 200px; height: 100px; border: 1px solid #e9e9e9;" v-if="ruleForm.url" :src="ruleForm.url" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
<el-form-item label="跳转链接" prop="link">
<el-input type="text" v-model="ruleForm.link"></el-input>
</el-form-item>
<el-form-item label="排序值" prop="sort">
<el-input type="number" v-model="ruleForm.sort"></el-input>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="submitForm"> </el-button>
</span>
</template>
</el-dialog>
<div class="add">
<el-card class="add-container">
<el-form :model="goodForm" :rules="rules" ref="goodRef" class="goodForm" label-width="150px" style="width: 50%">
<el-form-item label="系列" prop="family">
<el-input type="text" v-model="goodForm.family" placeholder=""></el-input>
</el-form-item>
<el-form-item label="起始名称" prop="start_name">
<el-input type="text" v-model="goodForm.start_name" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Agent 起始" prop="agent_start">
<el-input type="text" v-model="goodForm.agent_start" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Agent 模式串" prop="agent_pattern">
<el-input type="text" v-model="goodForm.agent_pattern" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Agent 匹配次数" prop="agent_match_num">
<el-input type="number" min="0" v-model="goodForm.agent_match_num" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Agent 匹配类型" prop="agent_matchtype">
<el-radio v-model="goodForm.agent_matchtype" label="dec">十进制</el-radio>
<el-radio v-model="goodForm.agent_matchtype" label="hex">十六进制</el-radio>
</el-form-item>
<el-form-item label="Peer ID 起始" prop="peer_id_start">
<el-input type="text" v-model="goodForm.peer_id_start" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Peer ID 模式串" prop="peer_id_pattern">
<el-input type="text" v-model="goodForm.peer_id_pattern" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Peer ID 匹配次数" prop="peer_id_match_num">
<el-input type="number" min="0" v-model="goodForm.peer_id_match_num" placeholder=""></el-input>
</el-form-item>
<el-form-item label="Peer ID 匹配类型" prop="peer_id_matchtype">
<el-radio v-model="goodForm.peer_id_matchtype" label="dec">十进制</el-radio>
<el-radio v-model="goodForm.peer_id_matchtype" label="hex">十六进制</el-radio>
</el-form-item>
<el-form-item label="排除部分" prop="exception">
<el-radio v-model="goodForm.exception" label="yes"></el-radio>
<el-radio v-model="goodForm.exception" label="no"></el-radio>
</el-form-item>
<el-form-item label="允许 https" prop="allowhttps">
<el-radio v-model="goodForm.allowhttps" label="yes"></el-radio>
<el-radio v-model="goodForm.allowhttps" label="no"></el-radio>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea" v-model="goodForm.comment" placeholder=""></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitAdd()">{{ id ? '立即修改' : '立即创建' }}</el-button>
</el-form-item>
</el-form>
</el-card>
</div>
</template>
<script>
import { reactive, ref, toRefs } from 'vue'
import { reactive, ref, toRefs, onMounted, onBeforeUnmount, getCurrentInstance } from 'vue'
import WangEditor from 'wangeditor'
import axios from '@/utils/axios'
import { localGet, uploadImgServer, hasEmoji } from '@/utils'
import api from '@/utils/api'
import { ElMessage } from 'element-plus'
import { useRoute, useRouter } from 'vue-router'
import { localGet, uploadImgServer, uploadImgsServer, hasEmoji } from '@/utils'
export default {
name: 'DialogAddSwiper',
props: {
type: String,
reload: Function
},
setup(props) {
const formRef = ref(null)
setup() {
const { proxy } = getCurrentInstance()
console.log('proxy', proxy)
const editor = ref(null)
const goodRef = ref(null)
const route = useRoute()
const router = useRouter()
const { id } = route.query
const state = reactive({
uploadImgServer,
token: localGet('token') || '',
visible: false,
ruleForm: {
url: '',
link: '',
sort: ''
id: id,
defaultCate: '',
goodForm: {
family: '',
start_name: '',
peer_id_pattern: '',
peer_id_match_num: '',
peer_id_matchtype: '',
peer_id_start: '',
agent_pattern: '',
agent_match_num: '',
agent_matchtype: '',
agent_start: '',
exception: '',
allowhttps: '',
comment: ''
},
rules: {
url: [
{ required: 'true', message: '图片不能为空', trigger: ['change'] }
family: [
{ required: 'true' }
],
sort: [
{ required: 'true', message: '排序不能为空', trigger: ['change'] }
start_name: [
{ required: 'true'}
],
peer_id_pattern: [
{ required: 'true' }
],
peer_id_match_num: [
{ required: 'true' }
],
peer_id_matchtype: [
{ required: 'true' }
],
peer_id_start: [
{ required: 'true' }
],
agent_pattern: [
{ required: 'true' }
],
agent_match_num: [
{ required: 'true' }
],
agent_matchtype: [
{ required: 'true' }
],
agent_start: [
{ required: 'true' }
],
exception: [
{ required: 'true' }
],
allowhttps: [
{ required: 'true' }
],
comment: [
{ required: 'true' }
]
},
id: ''
})
// 获取详情
const getDetail = (id) => {
axios.get(`/carousels/${id}`).then(res => {
state.ruleForm = {
url: res.carouselUrl,
link: res.redirectUrl,
sort: res.carouselRank
onMounted(() => {
if (id) {
getAgentAllow(id)
}
})
onBeforeUnmount(() => {
})
const getAgentAllow = (id) => {
api.getAllowAgent(id).then(res => {
state.goodForm = res
console.log(res, state.goodForm)
})
}
const submitAdd = () => {
goodRef.value.validate((vaild) => {
console.log("valid", vaild)
if (vaild) {
// 默认新增用 post 方法
let params = state.goodForm
let res
console.log('params', params)
if (id) {
res = api.updateAllowAgent(id, params)
} else {
res = api.storeAllowAgent(params)
}
ElMessage.success(id ? '修改成功' : '添加成功')
router.push({ path: '/agent-allow' })
}
})
}
@@ -87,75 +175,33 @@ export default {
return false
}
}
// 上传图片
const handleUrlSuccess = (val) => {
state.ruleForm.url = val.data || ''
state.goodForm.goodsCoverImg = val.data || ''
}
// 开启弹窗
const open = (id) => {
state.visible = true
if (id) {
state.id = id
getDetail(id)
} else {
state.ruleForm = {
url: '',
link: '',
sort: ''
}
}
}
// 关闭弹窗
const close = () => {
state.visible = false
}
const submitForm = () => {
console.log(formRef.value.validate)
formRef.value.validate((valid) => {
if (valid) {
if (hasEmoji(state.ruleForm.link)) {
ElMessage.error('不要输入表情包,再输入就打死你个龟孙儿~')
return
}
if (props.type == 'add') {
axios.post('/carousels', {
carouselUrl: state.ruleForm.url,
redirectUrl: state.ruleForm.link,
carouselRank: state.ruleForm.sort
}).then(() => {
ElMessage.success('添加成功')
state.visible = false
if (props.reload) props.reload()
})
} else {
axios.put('/carousels', {
carouselId: state.id,
carouselUrl: state.ruleForm.url,
redirectUrl: state.ruleForm.link,
carouselRank: state.ruleForm.sort
}).then(() => {
ElMessage.success('修改成功')
state.visible = false
if (props.reload) props.reload()
})
}
}
})
const handleChangeCate = (val) => {
state.categoryId = val[2] || 0
}
return {
...toRefs(state),
open,
close,
formRef,
goodRef,
submitAdd,
handleBeforeUpload,
handleUrlSuccess,
submitForm
editor,
handleChangeCate
}
}
}
</script>
<style scoped>
.add {
display: flex;
}
.add-container {
flex: 1;
height: 100%;
}
.avatar-uploader {
width: 100px;
height: 100px;

View File

@@ -31,8 +31,8 @@
>
</el-table-column>
<el-table-column
label="起始名称"
prop="start_name"
label="系列"
prop="family"
>
</el-table-column>
<el-table-column
@@ -43,8 +43,13 @@
<el-table-column
label="Agent 模式串"
prop="agent_pattern"
>
</el-table-column>
></el-table-column>
<el-table-column
label="Agent 匹配次数"
prop="agent_match_num"
width="80px"
></el-table-column>
<el-table-column
prop="peer_id_start"
label="Peer ID 起始"
@@ -55,15 +60,20 @@
label="Peer ID 模式串"
>
</el-table-column>
<el-table-column
label="Peer ID 匹配次数"
prop="peer_id_match_num"
width="80px"
></el-table-column>
<el-table-column
label="操作"
width="100"
>
<template #default="scope">
<a style="cursor: pointer; margin-right: 10px" @click="handleEdit(scope.row.carouselId)">修改</a>
<a style="cursor: pointer; margin-right: 10px" @click="handleEdit(scope.row.id)">修改</a>
<el-popconfirm
title="确定删除吗?"
@confirm="handleDeleteOne(scope.row.carouselId)"
@confirm="handleDeleteOne(scope.row.id)"
>
<template #reference>
<a style="cursor: pointer">删除</a>
@@ -82,13 +92,12 @@
@current-change="changePage"
/>
</el-card>
<DialogAddSwiper ref='addGood' :reload="getCarousels" :type="type" />
</template>
<script>
import { onMounted, reactive, ref, toRefs } from 'vue'
import { ElMessage } from 'element-plus'
import DialogAddSwiper from '@/components/DialogAddSwiper.vue'
import { useRouter } from 'vue-router'
import AgentAllowForm from './form.vue'
import axios from '@/utils/axios'
import api from '@/utils/api'
@@ -96,9 +105,10 @@ import api from '@/utils/api'
export default {
name: 'Swiper',
components: {
DialogAddSwiper
},
setup() {
const router = useRouter()
const multipleTable = ref(null)
const addGood = ref(null)
const state = reactive({
@@ -143,12 +153,18 @@ export default {
// 添加轮播项
const handleAdd = () => {
state.type = 'add'
addGood.value.open()
// addGood.value.open()
router.push({
name: "agent-allow-form"
})
}
// 修改轮播图
const handleEdit = (id) => {
state.type = 'edit'
addGood.value.open(id)
console.log("id", id)
router.push({
name: "agent-allow-form",
query: {id: id}
})
}
// 选择项
const handleSelectionChange = (val) => {
@@ -171,13 +187,9 @@ export default {
}
// 单个删除
const handleDeleteOne = (id) => {
axios.delete('/carousels', {
data: {
ids: [id]
}
}).then(() => {
api.deleteAllowAgent(id).then(() => {
ElMessage.success('删除成功')
getCarousels()
listAgentAllow()
})
}
const changePage = (val) => {

View File

@@ -15,7 +15,7 @@ class AgentAllowController extends Controller
*/
public function index()
{
$result = AgentAllow::query()->paginate();
$result = AgentAllow::query()->orderBy('id', 'desc')->paginate();
$resource = AgentAllowResource::collection($result);
return success('agent allow list', $resource);
}
@@ -35,11 +35,13 @@ class AgentAllowController extends Controller
* Display the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
* @return array
*/
public function show($id)
{
//
$result = AgentAllow::query()->findOrFail($id);
$resource = new AgentAllowResource($result);
return success('agent allow detail', $resource);
}
/**
@@ -47,21 +49,26 @@ class AgentAllowController extends Controller
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
* @return array
*/
public function update(Request $request, $id)
{
//
$result = AgentAllow::query()->findOrFail($id);
$result->update($request->all());
$resource = new AgentAllowResource($result);
return success('agent allow update', $resource);
}
/**
* Remove the specified resource from storage.
*
* @param int $id
* @return \Illuminate\Http\Response
* @return array
*/
public function destroy($id)
{
//
$result = AgentAllow::query()->findOrFail($id);
$deleted = $result->delete();
return success('agent allow delete', [$deleted]);
}
}

View File

@@ -16,6 +16,7 @@ class AgentAllowResource extends JsonResource
{
return [
'id' => $this->id,
'family' => $this->family,
'start_name' => $this->start_name,
'peer_id_pattern' => $this->peer_id_pattern,
'peer_id_match_num' => $this->peer_id_match_num,
@@ -27,6 +28,7 @@ class AgentAllowResource extends JsonResource
'agent_start' => $this->agent_start,
'exception' => $this->exception,
'comment' => $this->comment,
'allowhttps' => $this->allowhttps,
'hits' => $this->hits,
];
}

View File

@@ -7,7 +7,7 @@ class AgentAllow extends NexusModel
protected $table = 'agent_allowed_family';
protected $fillable = [
'family', 'start_name', 'exception', 'allowhttps', 'comment', 'hits',
'family', 'start_name', 'exception', 'allowhttps', 'comment',
'peer_id_pattern', 'peer_id_match_num', 'peer_id_matchtype', 'peer_id_start',
'agent_pattern', 'agent_match_num', 'agent_matchtype', 'agent_start',
];

View File

@@ -29,6 +29,6 @@ return [
'max_age' => 0,
'supports_credentials' => false,
'supports_credentials' => true,
];