Skip to content

C
center-zws
提交 6db3c1da authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

chore: update

上级 76665f78
隐藏空白字符变更
内嵌 并排
正在显示 包含 295 行增加 和 66 行删除
src/assets/menus.ts
浏览文件 @ 6db3c1da
import type { IMenuItem } from '@/types'
import { VideoCamera, Suitcase } from '@element-plus/icons-vue'
import { Suitcase } from '@element-plus/icons-vue'
export const menus: IMenuItem[] = [
{
name: '信息管理',
path: '/base',
children: [
{
icon: VideoCamera,
icon: Suitcase,
name: '渠道管理',
path: '/base/channel'
},
......@@ -14,6 +14,16 @@ export const menus: IMenuItem[] = [
icon: Suitcase,
name: '项目管理',
path: '/base/project'
},
{
icon: Suitcase,
name: '用户管理',
path: '/base/users'
},
{
icon: Suitcase,
name: '角色管理',
path: '/base/roles'
}
]
},
......
src/components/base/AppList.vue
浏览文件 @ 6db3c1da
......@@ -146,6 +146,7 @@ defineExpose({ refetch, tableRef })
filterable
clearable
@change="search"
style="width: 200px"
v-if="item.type === 'select'">
<el-option
:label="option[item.labelKey] || option.label"
......@@ -249,8 +250,18 @@ defineExpose({ refetch, tableRef })
.el-table-column--selection .cell {
padding: 0 14px !important;
}
.el-button a {
margin: -8px -15px;
padding: 8px 15px;
.table-list {
.el-button {
a {
margin: -8px -15px;
padding: 8px 15px;
}
&.is-text {
padding: 8px;
}
&.is-text + .is-text {
margin-left: 0;
}
}
}
</style>
src/modules/base/channel/index.ts
浏览文件 @ 6db3c1da
......@@ -5,6 +5,16 @@ export const routes: Array<RouteRecordRaw> = [
{
path: '/base/channel',
component: AppLayout,
children: [{ path: '', component: () => import('./views/Index.vue') }]
children: [
{ name: 'channelIndex', path: '', component: () => import('./views/Index.vue') },
{ name: 'channelCreate', path: 'create', component: () => import('./views/Update.vue'), props: { isAdd: true } },
{
name: 'channelUpdate',
path: 'update/:id',
component: () => import('./views/Update.vue'),
props: { isUpdate: true }
},
{ name: 'channelView', path: 'view/:id', component: () => import('./views/Update.vue'), props: { isView: true } }
]
}
]
src/modules/base/channel/views/Index.vue
浏览文件 @ 6db3c1da
......@@ -6,7 +6,7 @@ const QRCode = defineAsyncComponent(() => import('../components/QRCode.vue'))
const appList = $ref<InstanceType<typeof AppList> | null>(null)
const listOptions = computed(() => {
const listOptions = $computed(() => {
return {
filters: [
{ type: 'input', prop: 'code', placeholder: '渠道编号' },
......@@ -17,42 +17,84 @@ const listOptions = computed(() => {
{ type: 'select', prop: 'code', placeholder: '回抽状态' },
{ type: 'select', prop: 'code', placeholder: '渠道质量' }
],
columns: [
{ label: '渠道编号', prop: 'name' },
{ label: '渠道名称', prop: 'name' },
{ label: '渠道标签', prop: 'name' },
{ label: '归属人', prop: 'name' },
{ label: '渠道类型', prop: 'name' },
{ label: '状态', prop: 'name' },
{ label: '更新时间', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x' }
],
data: [{}]
data: [
{ id: 1, code: 123 },
{ id: 2, code: 456 }
]
}
})
const columns = $computed(() => {
const columns: Record<string, any>[] = [
{ label: '渠道编号', prop: 'code' },
{ label: '渠道名称', prop: 'name' },
{ label: '渠道标签', prop: 'name' },
{ label: '归属人', prop: 'name' },
{ label: '渠道类型', prop: 'name' },
{ label: '状态', prop: 'name' },
{ label: '更新时间', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x', width: 300 }
]
if (selectionVisible) columns.unshift({ type: 'selection' })
return columns
})
let selectionVisible = $ref(false)
function toggleSelection() {
selectionVisible = !selectionVisible
// 清空选择的数据
appList?.tableRef.clearSelection()
}
const labelVisible = $ref(true)
let multipleSelection = $ref([])
function handleSelectionChange(value: any) {
multipleSelection = value
}
const labelVisible = $ref(false)
let currentRow = $ref()
// 添加成员
function handleUser(row: any) {
currentRow = row
}
// 二维码
let qrcodeVisible = $ref(false)
function handleQRCode(row: any) {
currentRow = row
qrcodeVisible = true
}
// 删除
function handleRemove(row: any) {
currentRow = row
}
</script>
<template>
<AppCard title="渠道管理">
<AppList v-bind="listOptions" ref="appList">
<AppList :columns="columns" v-bind="listOptions" @selection-change="handleSelectionChange" ref="appList">
<template #header-buttons>
<el-button type="primary">创建渠道</el-button>
<el-button type="primary">添加标签</el-button>
<el-button type="primary">选择标签</el-button>
<el-button type="primary">取消</el-button>
<el-button type="primary"><router-link :to="{ name: 'channelCreate' }">创建渠道</router-link></el-button>
<el-button type="primary" @click="toggleSelection" v-if="!selectionVisible">添加标签</el-button>
<template v-else>
<el-button type="primary" :disabled="!multipleSelection.length" @click="labelVisible = true"
>选择标签</el-button
>
<el-button type="primary" @click="toggleSelection">取消</el-button>
</template>
</template>
<template #table-x>
<el-link type="info">查看</el-link>
<el-link>编辑</el-link>
<el-link>添加成员</el-link>
<el-link>二维码</el-link>
<el-link type="danger">删除</el-link>
<template #table-x="{ row }">
<el-button text>
<router-link :to="{ name: 'channelView', params: { id: row.id } }">查看</router-link>
</el-button>
<el-button text style="--el-button-text-color: #3276fc">
<router-link :to="{ name: 'channelUpdate', params: { id: row.id } }">编辑</router-link>
</el-button>
<el-button text style="--el-button-text-color: #00bfbf" @click="handleUser(row)">添加成员</el-button>
<el-button text style="--el-button-text-color: #f59a23" @click="handleQRCode(row)">二维码</el-button>
<el-button text style="--el-button-text-color: #d9001b" @click="handleRemove(row)">删除</el-button>
</template>
</AppList>
</AppCard>
<Label v-model="labelVisible"></Label>
<QRCode></QRCode>
<Label v-model="labelVisible" :data="multipleSelection"></Label>
<QRCode v-model="qrcodeVisible" :data="currentRow"></QRCode>
</template>
src/modules/base/channel/views/Update.vue
浏览文件 @ 6db3c1da
<script setup lang="ts"></script>
<script setup lang="ts">
interface Props {
isAdd?: boolean
isUpdate?: boolean
isView?: boolean
}
const props = defineProps<Props>()
const title = $computed(() => {
return (props.isAdd && '创建渠道') || (props.isUpdate && '编辑渠道') || (props.isView && '查看渠道') || ''
})
</script>
<template>
<AppCard title="创建项目">
<el-card shadow="never"> Never </el-card>
</AppCard>
<AppCard :title="title"></AppCard>
</template>
src/modules/base/project/index.ts
浏览文件 @ 6db3c1da
......@@ -6,10 +6,15 @@ export const routes: Array<RouteRecordRaw> = [
path: '/base/project',
component: AppLayout,
children: [
{ path: '', component: () => import('./views/Index.vue') },
{ path: 'create', component: () => import('./views/Update.vue'), props: { isAdd: true } },
{ path: 'update/:id', component: () => import('./views/Update.vue'), props: { isUpdate: true } },
{ path: 'view/:id', component: () => import('./views/Update.vue'), props: { isView: true } }
{ name: 'projectIndex', path: '', component: () => import('./views/Index.vue') },
{ name: 'projectCreate', path: 'create', component: () => import('./views/Update.vue'), props: { isAdd: true } },
{
name: 'projectUpdate',
path: 'update/:id',
component: () => import('./views/Update.vue'),
props: { isUpdate: true }
},
{ name: 'projectView', path: 'view/:id', component: () => import('./views/Update.vue'), props: { isView: true } }
]
}
]
src/modules/base/project/views/Index.vue
浏览文件 @ 6db3c1da
......@@ -3,7 +3,7 @@ import AppList from '@/components/base/AppList.vue'
const appList = $ref<InstanceType<typeof AppList> | null>(null)
const listOptions = computed(() => {
const listOptions = $computed(() => {
return {
filters: [
{ type: 'input', prop: 'code', placeholder: '项目编号' },
......@@ -11,36 +11,60 @@ const listOptions = computed(() => {
{ type: 'select', prop: 'code', placeholder: '项目类型' },
{ type: 'select', prop: 'code', placeholder: '状态' }
],
columns: [
{ label: '项目编号', prop: 'name' },
{ label: '项目名称', prop: 'name' },
{ label: '项目网址', prop: 'name' },
{ label: '项目类型', prop: 'name' },
{ label: '状态', prop: 'name' },
{ label: '更新时间', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x' }
],
data: [{}]
data: [
{ id: 1, code: 123 },
{ id: 2, code: 456 }
]
}
})
const columns = $computed(() => {
const columns: Record<string, any>[] = [
{ label: '项目编号', prop: 'name' },
{ label: '项目名称', prop: 'name' },
{ label: '项目网址', prop: 'name' },
{ label: '项目类型', prop: 'name' },
{ label: '状态', prop: 'name' },
{ label: '更新时间', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x', width: 240 }
]
if (selectionVisible) columns.unshift({ type: 'selection' })
return columns
})
let selectionVisible = $ref(false)
function toggleSelection() {
selectionVisible = !selectionVisible
// 清空选择的数据
appList?.tableRef.clearSelection()
}
let multipleSelection = $ref([])
function handleSelectionChange(value: any) {
multipleSelection = value
}
</script>
<template>
<AppCard title="项目管理">
<AppList v-bind="listOptions" ref="appList">
<AppList :columns="columns" v-bind="listOptions" @selection-change="handleSelectionChange" ref="appList">
<template #header-buttons>
<router-link to="/base/project/create">
<el-button type="primary">创建项目</el-button>
</router-link>
<el-button type="primary">添加标签</el-button>
<el-button type="primary">选择标签</el-button>
<el-button type="primary">取消</el-button>
<el-button type="primary"><router-link :to="{ name: 'projectCreate' }">创建项目</router-link></el-button>
<el-button type="primary" @click="toggleSelection" v-if="!selectionVisible">添加成员</el-button>
<template v-else>
<el-button type="primary" :disabled="!multipleSelection.length">选择成员</el-button>
<el-button type="primary" @click="toggleSelection">取消</el-button>
</template>
</template>
<template #table-x>
<el-link type="info">查看</el-link>
<el-link>编辑</el-link>
<el-link>添加成员</el-link>
<el-link type="danger">删除</el-link>
<template #table-x="{ row }">
<el-button text>
<router-link :to="{ name: 'projectView', params: { id: row.id } }">查看</router-link>
</el-button>
<el-button text style="--el-button-text-color: #3276fc">
<router-link :to="{ name: 'projectUpdate', params: { id: row.id } }">编辑</router-link>
</el-button>
<el-button text style="--el-button-text-color: #00bfbf">添加成员</el-button>
<el-button text style="--el-button-text-color: #d9001b">删除</el-button>
</template>
</AppList>
</AppCard>
......
src/modules/base/project/views/Update.vue
浏览文件 @ 6db3c1da
<script setup lang="ts">
import InfoBase from '../components/InfoBase.vue'
import InfoMembers from '../components/InfoMembers.vue'
import InfoUsers from '../components/InfoUsers.vue'
interface Props {
isAdd?: boolean
......@@ -17,6 +17,6 @@ const title = $computed(() => {
<template>
<AppCard :title="title">
<InfoBase style="margin: 20px 0"></InfoBase>
<InfoMembers></InfoMembers>
<InfoUsers></InfoUsers>
</AppCard>
</template>
src/modules/base/roles/api.ts 0 → 100644
浏览文件 @ 6db3c1da
import httpRequest from '@/utils/axios'
// 获取封面列表
export function getCoverList(params?: { type?: string; page?: number; ['per-page']?: number }) {
return httpRequest.get('/api/resource/v1/backend/cover/list', { params })
}
src/modules/base/roles/index.ts 0 → 100644
浏览文件 @ 6db3c1da
import type { RouteRecordRaw } from 'vue-router'
import AppLayout from '@/components/layout/Index.vue'
export const routes: Array<RouteRecordRaw> = [
{
path: '/base/roles',
component: AppLayout,
children: [{ path: '', component: () => import('./views/Index.vue') }]
}
]
src/modules/base/roles/views/Index.vue 0 → 100644
浏览文件 @ 6db3c1da
<script setup lang="ts">
import AppList from '@/components/base/AppList.vue'
const appList = $ref<InstanceType<typeof AppList> | null>(null)
const listOptions = $computed(() => {
return {
filters: [
{ type: 'input', prop: 'code', placeholder: '请输入用户姓名' },
{ type: 'input', prop: 'code', placeholder: '请输入用户手机号' },
{ type: 'input', prop: 'code', placeholder: '请输入角色名称' }
],
columns: [
{ label: '名称', prop: 'name' },
{ label: '描述', prop: 'name' },
{ label: '用户数量', prop: 'name' },
{ label: '角色类型', prop: 'name' },
{ label: '更新时间', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x', width: 100 }
],
data: [
{ id: 1, code: 123 },
{ id: 2, code: 456 }
]
}
})
// 查看
let currentRow = $ref()
function handleView(row: any) {
currentRow = row
}
</script>
<template>
<AppCard title="角色管理">
<AppList v-bind="listOptions" ref="appList">
<template #table-x="{ row }">
<el-button text type="primary" @click="handleView(row)">查看</el-button>
</template>
</AppList>
</AppCard>
</template>
src/modules/base/users/api.ts 0 → 100644
浏览文件 @ 6db3c1da
import httpRequest from '@/utils/axios'
// 获取封面列表
export function getCoverList(params?: { type?: string; page?: number; ['per-page']?: number }) {
return httpRequest.get('/api/resource/v1/backend/cover/list', { params })
}
src/modules/base/users/index.ts 0 → 100644
浏览文件 @ 6db3c1da
import type { RouteRecordRaw } from 'vue-router'
import AppLayout from '@/components/layout/Index.vue'
export const routes: Array<RouteRecordRaw> = [
{
path: '/base/users',
component: AppLayout,
children: [{ path: '', component: () => import('./views/Index.vue') }]
}
]
src/modules/base/users/views/Index.vue 0 → 100644
浏览文件 @ 6db3c1da
<script setup lang="ts">
import AppList from '@/components/base/AppList.vue'
const appList = $ref<InstanceType<typeof AppList> | null>(null)
const listOptions = $computed(() => {
return {
filters: [
{ type: 'input', prop: 'code', placeholder: '请输入用户姓名' },
{ type: 'input', prop: 'code', placeholder: '请输入用户手机号' },
{ type: 'input', prop: 'code', placeholder: '请输入用户邮箱' },
{ type: 'input', prop: 'code', placeholder: '请输入角色名称' }
],
columns: [
{ label: '姓名', prop: 'name' },
{ label: '手机', prop: 'name' },
{ label: '邮箱', prop: 'name' },
{ label: '角色数量', prop: 'name' },
{ label: '操作', prop: 'name', slots: 'table-x', width: 100 }
],
data: [
{ id: 1, code: 123 },
{ id: 2, code: 456 }
]
}
})
// 查看
let currentRow = $ref()
function handleView(row: any) {
currentRow = row
}
</script>
<template>
<AppCard title="用户管理">
<AppList v-bind="listOptions" ref="appList">
<template #table-x="{ row }">
<el-button text type="primary" @click="handleView(row)">查看</el-button>
</template>
</AppList>
</AppCard>
</template>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论