Skip to content

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

chore update

上级 730d3267
隐藏空白字符变更
内嵌 并排
正在显示 包含 233 行增加 和 75 行删除
package-lock.json
浏览文件 @ 76665f78
......@@ -27,12 +27,12 @@
"ali-oss": "^6.17.1",
"chalk": "^5.1.2",
"eslint": "^8.26.0",
"eslint-plugin-vue": "^9.6.0",
"eslint-plugin-vue": "^9.7.0",
"npm-run-all": "^4.1.5",
"sass": "^1.55.0",
"typescript": "~4.8.4",
"unplugin-auto-import": "^0.11.4",
"vite": "^3.2.1",
"vite": "^3.2.2",
"vue-tsc": "^1.0.9"
}
},
......@@ -1945,9 +1945,9 @@
}
},
"node_modules/eslint-plugin-vue": {
"version": "9.6.0",
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/-/eslint-plugin-vue-9.6.0.tgz",
"integrity": "sha512-zzySkJgVbFCylnG2+9MDF7N+2Rjze2y0bF8GyUNpFOnT8mCMfqqtLDJkHBuYu9N/psW1A6DVbQhPkP92E+qakA==",
"version": "9.7.0",
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/-/eslint-plugin-vue-9.7.0.tgz",
"integrity": "sha512-DrOO3WZCZEwcLsnd3ohFwqCoipGRSTKTBTnLwdhqAbYZtzWl0o7D+D8ZhlmiZvABKTEl8AFsqH1GHGdybyoQmw==",
"dev": true,
"dependencies": {
"eslint-utils": "^3.0.0",
......@@ -4840,9 +4840,9 @@
}
},
"node_modules/vite": {
"version": "3.2.1",
"resolved": "https://registry.npmmirror.com/vite/-/vite-3.2.1.tgz",
"integrity": "sha512-ADtMkfHuWq4tskJsri2n2FZkORO8ZyhI+zIz7zTrDAgDEtct1jdxOg3YsZBfHhKjmMoWLOSCr+64qrEDGo/DbQ==",
"version": "3.2.2",
"resolved": "https://registry.npmmirror.com/vite/-/vite-3.2.2.tgz",
"integrity": "sha512-pLrhatFFOWO9kS19bQ658CnRYzv0WLbsPih6R+iFeEEhDOuYgYCX2rztUViMz/uy/V8cLCJvLFeiOK7RJEzHcw==",
"dev": true,
"dependencies": {
"esbuild": "^0.15.9",
......@@ -6555,9 +6555,9 @@
}
},
"eslint-plugin-vue": {
"version": "9.6.0",
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/-/eslint-plugin-vue-9.6.0.tgz",
"integrity": "sha512-zzySkJgVbFCylnG2+9MDF7N+2Rjze2y0bF8GyUNpFOnT8mCMfqqtLDJkHBuYu9N/psW1A6DVbQhPkP92E+qakA==",
"version": "9.7.0",
"resolved": "https://registry.npmmirror.com/eslint-plugin-vue/-/eslint-plugin-vue-9.7.0.tgz",
"integrity": "sha512-DrOO3WZCZEwcLsnd3ohFwqCoipGRSTKTBTnLwdhqAbYZtzWl0o7D+D8ZhlmiZvABKTEl8AFsqH1GHGdybyoQmw==",
"dev": true,
"requires": {
"eslint-utils": "^3.0.0",
......@@ -8859,9 +8859,9 @@
}
},
"vite": {
"version": "3.2.1",
"resolved": "https://registry.npmmirror.com/vite/-/vite-3.2.1.tgz",
"integrity": "sha512-ADtMkfHuWq4tskJsri2n2FZkORO8ZyhI+zIz7zTrDAgDEtct1jdxOg3YsZBfHhKjmMoWLOSCr+64qrEDGo/DbQ==",
"version": "3.2.2",
"resolved": "https://registry.npmmirror.com/vite/-/vite-3.2.2.tgz",
"integrity": "sha512-pLrhatFFOWO9kS19bQ658CnRYzv0WLbsPih6R+iFeEEhDOuYgYCX2rztUViMz/uy/V8cLCJvLFeiOK7RJEzHcw==",
"dev": true,
"requires": {
"esbuild": "^0.15.9",
......
package.json
浏览文件 @ 76665f78
......@@ -33,12 +33,12 @@
"ali-oss": "^6.17.1",
"chalk": "^5.1.2",
"eslint": "^8.26.0",
"eslint-plugin-vue": "^9.6.0",
"eslint-plugin-vue": "^9.7.0",
"npm-run-all": "^4.1.5",
"sass": "^1.55.0",
"typescript": "~4.8.4",
"unplugin-auto-import": "^0.11.4",
"vite": "^3.2.1",
"vite": "^3.2.2",
"vue-tsc": "^1.0.9"
}
}
src/components.d.ts
浏览文件 @ 76665f78
import AppCard from '@/components/base/AppCard.vue'
import AppList from '@/components/base/AppList.vue'
import AppUpload from '@/components/base/AppUpload.vue'
declare module 'vue' {
declare module '@vue/runtime-core' {
export interface GlobalComponents {
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
AppCard: typeof AppCard
AppList: typeof AppList
AppUpload: typeof AppUpload
}
}
src/components/base/AppList.vue
浏览文件 @ 76665f78
......@@ -8,26 +8,22 @@ interface IRemoteProps {
callback?: any
}
const props = withDefaults(
defineProps<{
remote?: IRemoteProps
filters?: any[]
moreFilters?: any[]
columns?: any[]
data?: any[]
hasPagination?: boolean
limit?: number
isLimit?: boolean
}>(),
{
isLimit: false,
hasPagination: true,
limit: 10,
data() {
return []
}
}
)
interface Props {
remote?: IRemoteProps
filters?: any[]
filterForm?: any
columns?: any[]
data?: any[]
hasPagination?: boolean
limit?: number
}
const props = withDefaults(defineProps<Props>(), {
hasPagination: true,
limit: 10,
filters: () => [],
columns: () => [],
data: () => []
})
const filterFormRef = ref()
const loading = ref(false)
......@@ -36,13 +32,12 @@ const dataList = ref<any[]>([])
const page = reactive({ total: 0, size: props.limit, currentPage: 1 })
const params = reactive({ ...props.remote?.params })
watch(
() => props.data,
list => {
dataList.value = list || []
},
{ immediate: true }
)
watchEffect(() => {
Object.assign(params, props.remote?.params)
})
watchEffect(() => {
dataList.value = props.data || []
})
// 获取数据
const fetchList = (isReset = false) => {
......@@ -60,11 +55,7 @@ const fetchList = (isReset = false) => {
// 翻页参数设置
if (props.hasPagination) {
requestParams.page = page.currentPage
if (props.isLimit === true) {
requestParams.limit = page.size
} else {
requestParams['per-page'] = page.size
}
requestParams['per-page'] = page.size
}
// 接口请求之前
if (beforeRequest) {
......@@ -80,7 +71,7 @@ const fetchList = (isReset = false) => {
httpRequest(requestParams)
.then((res: any) => {
const { list = [], total = 0 } = callback ? callback(res.data, requestParams) : res.data || {}
page.total = total
page.total = parseInt(total)
dataList.value = list
})
// .catch(() => {
......@@ -125,7 +116,7 @@ onMounted(() => {
fetchList()
})
defineExpose({ refetch, tableRef, params })
defineExpose({ refetch, tableRef })
</script>
<template>
......@@ -133,7 +124,7 @@ defineExpose({ refetch, tableRef, params })
<div class="table-list-hd">
<!-- 筛选 -->
<div class="table-list-filter" v-if="filters && filters.length">
<el-form :inline="true" :model="params" ref="filterFormRef" @submit.prevent>
<el-form :inline="true" :model="params" v-bind="filterForm" ref="filterFormRef" @submit.prevent>
<template v-for="item in filters" :key="item.prop">
<el-form-item :label="item.label" :prop="item.prop">
<template v-if="item.slots">
......@@ -147,23 +138,20 @@ defineExpose({ refetch, tableRef, params })
clearable
@change="search"
style="width: 200px"
v-if="item.type === 'input'"
/>
v-if="item.type === 'input'" />
<!-- select -->
<el-select
v-model="params[item.prop]"
v-bind="item"
filterable
clearable
@change="search"
v-if="item.type === 'select'"
style="width: 200px"
>
v-if="item.type === 'select'">
<el-option
:label="option[item.labelKey] || option.label"
:value="option[item.valueKey] || option.value"
v-for="(option, index) in item.options"
:key="index"
/>
:key="index" />
</el-select>
</template>
</el-form-item>
......@@ -174,21 +162,21 @@ defineExpose({ refetch, tableRef, params })
</el-form-item>
</el-form>
</div>
<div class="table-list-hd-aside"><slot name="header-aside" /></div>
<!-- <div class="table-list-hd-aside"><slot name="header-aside" /></div> -->
</div>
<div class="table-list-buttons"><slot name="header-buttons"></slot></div>
<slot></slot>
<!-- 主体 -->
<div class="table-list-bd">
<slot name="body" v-bind="{ data: dataList }">
<el-table
stripe
:header-cell-style="{ background: '#ededed' }"
:data="dataList"
v-loading="loading"
v-bind="$attrs"
style="height: 100%"
ref="tableRef"
:header-cell-style="{ background: '#EFEFEF' }"
>
<el-table-column v-bind="item || {}" v-for="item in columns" :key="item.prop">
ref="tableRef">
<el-table-column align="center" v-bind="item || {}" v-for="item in columns" :key="item.prop">
<template #default="scope" v-if="item.slots || item.computed">
<slot :name="item.slots" v-bind="scope" v-if="item.slots"></slot>
<div v-html="item.computed(scope)" v-if="item.computed"></div>
......@@ -213,8 +201,7 @@ defineExpose({ refetch, tableRef, params })
@size-change="pageSizeChange"
@current-change="fetchList()"
:hide-on-single-page="true"
v-if="hasPagination"
>
v-if="hasPagination">
</el-pagination>
</div>
</div>
......@@ -230,10 +217,22 @@ defineExpose({ refetch, tableRef, params })
.table-list-hd {
display: flex;
margin-bottom: 10px;
margin-bottom: 20px;
&:empty {
display: none;
}
}
.table-list-filter {
flex: 1;
// padding: 30px 30px 10px;
// background: #f8f8f8;
// border-radius: 12px;
}
.table-list-buttons {
margin-bottom: 20px;
&:empty {
display: none;
}
}
// .table-list-bd {
// flex: 1;
......@@ -250,4 +249,8 @@ defineExpose({ refetch, tableRef, params })
.el-table-column--selection .cell {
padding: 0 14px !important;
}
.el-button a {
margin: -8px -15px;
padding: 8px 15px;
}
</style>
src/modules/base/channel/components/Label.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<template>
<el-dialog title="选择标签" width="400px" :close-on-click-modal="false"></el-dialog>
</template>
src/modules/base/channel/components/QRCode.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<template>
<el-dialog title="生成二维码">
<el-form>
<el-form-item label="选择项目">
<el-select></el-select>
</el-form-item>
</el-form>
</el-dialog>
</template>
src/modules/base/channel/views/Index.vue
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<script setup lang="ts">
import AppList from '@/components/base/AppList.vue'
const Label = defineAsyncComponent(() => import('../components/Label.vue'))
const QRCode = defineAsyncComponent(() => import('../components/QRCode.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: 'select', prop: 'code', placeholder: '渠道标签' },
{ type: 'select', prop: 'code', placeholder: '呼叫状态' },
{ 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: [{}]
}
})
const labelVisible = $ref(true)
</script>
<template>
<AppCard title="渠道管理"></AppCard>
<AppCard title="渠道管理">
<AppList v-bind="listOptions" 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>
</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>
</AppList>
</AppCard>
<Label v-model="labelVisible"></Label>
<QRCode></QRCode>
</template>
src/modules/base/channel/views/Update.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<template>
<AppCard title="创建项目">
<el-card shadow="never"> Never </el-card>
</AppCard>
</template>
src/modules/base/project/components/InfoBase.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<template>
<el-card shadow="never" header="基本信息"></el-card>
</template>
src/modules/base/project/components/InfoMembers.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<template>
<el-card shadow="never" header="成员信息"></el-card>
</template>
src/modules/base/project/index.ts
浏览文件 @ 76665f78
......@@ -5,6 +5,11 @@ export const routes: Array<RouteRecordRaw> = [
{
path: '/base/project',
component: AppLayout,
children: [{ path: '', component: () => import('./views/Index.vue') }]
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 } }
]
}
]
src/modules/base/project/views/Index.vue
浏览文件 @ 76665f78
<script setup lang="ts"></script>
<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: '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: [{}]
}
})
</script>
<template>
<AppCard title="渠道管理"></AppCard>
<AppCard title="项目管理">
<AppList v-bind="listOptions" 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>
</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>
</AppList>
</AppCard>
</template>
src/modules/base/project/views/Update.vue 0 → 100644
浏览文件 @ 76665f78
<script setup lang="ts">
import InfoBase from '../components/InfoBase.vue'
import InfoMembers from '../components/InfoMembers.vue'
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="title">
<InfoBase style="margin: 20px 0"></InfoBase>
<InfoMembers></InfoMembers>
</AppCard>
</template>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论