Skip to content

Q
quantum-blocks
Commit b341cbe0 authored by Xuguangxing's avatar Xuguangxing
Browse files
Options

feat: 对接接口并新增选择页面交互

parent bd777a97
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 550 additions and 62 deletions
app/controller/navigator.ts
View file @ b341cbe0
......@@ -30,8 +30,17 @@ export default class NavigatorController extends Controller {
// 保存导航配置
public async saveNavigatorConfig(ctx: Context) {
const pageInfo = ctx.request.body;
console.log(pageInfo);
// ctx.body = ctx.helper.ok(result);
ctx.body = 1;
if (!pageInfo.id) {
delete pageInfo.id;
}
try {
await ctx.service.navigator.saveOrUpdate(pageInfo);
ctx.body = ctx.helper.ok({});
} catch (e) {
ctx.logger.info(`保存导航配置异常, ${JSON.stringify(e)}`);
ctx.body = ctx.helper.fail({
message: '保存导航配置失败'
});
}
}
}
\ No newline at end of file
app/model/navigatorConfig.ts
View file @ b341cbe0
......@@ -38,9 +38,29 @@
})
author: string;
@Column({
field: 'bgColor',
type: DataType.STRING(255)
})
bgColor: string;
@Column({
field: 'bgImg',
type: DataType.STRING(255)
})
bgImg: string;
@Column({
field: 'navigatorData',
type: DataType.TEXT
field: 'navigatorData',
type: DataType.TEXT,
get() {
const configData = this.getDataValue('navigatorData');
return configData ? JSON.parse(configData) : null
},
set(value) {
this.setDataValue('navigatorData', JSON.stringify(value))
// return JSON.stringify(value);
}
})
navigatorData: string;
......
app/service/navigator.ts
View file @ b341cbe0
......@@ -42,4 +42,22 @@ export default class ArticeService extends Service {
})
return res;
}
// 保存或编辑
async saveOrUpdate(data) {
if (data.id) {
// 编辑
const id = data.id;
const saveData = Object.assign({}, data);
delete saveData.id;
const res = await this.context.model.NavigatorConfig.update(saveData, {
where: {
id
}
})
return res;
}
// 保存
const res = await this.context.model.NavigatorConfig.create(data);
return res;
}
}
app/web/api/navigator.api.ts
View file @ b341cbe0
......@@ -9,5 +9,8 @@ export default {
},
deleteNavigator(params) {
return http.post('http://localhost:7002/navigator/delete', params);
},
saveNavigator(params) {
return http.post('http://localhost:7002/navigator/save', params);
}
};
\ No newline at end of file
app/web/config/navigatorCol.config.ts
View file @ b341cbe0
......@@ -15,7 +15,19 @@ export const columns = function(pointer) {
{
align: 'center',
title: '所选页面',
key: 'pages'
render: (h, params) => {
const navigatorData = params.row.navigatorData;
let str = '';
try {
for (let i = 0; i < navigatorData.length; i++) {
str += `${i + 1}-${navigatorData[i].pageName}; `;
}
return h('span', str);
} catch (e) {
console.log(e);
}
return h('span', str);
}
},
{
align: 'center',
......@@ -99,20 +111,26 @@ export const urlTableColumns = function(pointer) {
return [
{
align: 'center',
title: 'ID',
title: '排序',
key: 'id',
width: 80
},
{
align: 'center',
title: '导航名称',
key: 'configName',
width: 120
},
{
align: 'center',
title: '所选页面',
key: 'name',
width: 300
key: 'pageName',
width: 120
},
{
align: 'center',
title: '跳转链接',
key: 'pages'
key: 'pageUrl'
},
];
};
\ No newline at end of file
app/web/page/editor/view/navigator/components/activityPageTable.vue 0 → 100644
View file @ b341cbe0
<template>
<div>
<div class="search-bar">
<Form @submit.native.prevent inline ref="searchForm" :model="searchForm" class="inline">
<Form-item label="名称" prop="name">
<Input v-model="searchForm.pageName" class="comWidth" />
</Form-item>
<Form-item label="描述" prop="pageDescribe">
<Input v-model="searchForm.pageDescribe" class="comWidth" />
</Form-item>
<Form-item label="作者" prop="author">
<Input v-model="searchForm.author" class="comWidth" />
</Form-item>
<FormItem class="btnGroupStyle">
<div>
<Button class="btnStyle" @click="reset()">重置</Button>
<Button type="primary" class="btnStyle" @click="filter">查询</Button>
</div>
</FormItem>
</Form>
</div>
<div class="tableGroupStyle">
<Table
:columns="columns"
:data="tableData"
class="tableStyle"
/>
<Page
:total="total"
v-if="total > 0"
show-elevator
show-sizer
class="pageStyle"
:current="searchForm.pageNo"
:pageSize="searchForm.pageSize"
@on-change="changePageNo"
/>
<!-- @on-change="changePageNo"
@on-page-size-change="changePageSize" -->
</div>
</div>
</template>
<script>
import api from '@api/editor.api'
import config from '@/config/index';
export default {
data() {
return {
total: 0,
searchForm: {
pageName: '',
pageDescribe: '',
author: '',
pageSize: 10,
pageNo: 1
},
columns: [
{
align: 'center',
title: '页面名称',
key: 'pageName',
width: 150,
},
{
align: 'center',
title: '描述',
key: 'pageDescribe',
width: 150,
},
{
align: 'center',
title: '作者',
key: 'author',
width: 100
},
{
align: 'center',
title: '封面',
width: 60,
render: (h, params) => {
return h('div', {
style: {
padding: '5px 0',
display: 'flex',
alignItems: 'center',
justifyContent: 'center'
}
}, [
h('Img', {
style: {
width: '35px'
},
attrs: {
src: params.row.coverImage
}
})
])
}
},
{
align: 'center',
title: '链接',
render: (h, params) => {
return h('span', `${config.h5Host}/activity/${params.row.uuid}?tenantId=${params.row.tenantId}&vccToken={token}`)
}
},
{
align: 'center',
title: '操作',
width: 80,
render: (h, params) => {
const row = params.row;
return h('div', [
h('Button', {
props: {
type: 'primary',
size: 'small'
},
on: {
click: () => {
this.select(row);
}
}
}, '选择')
]);
},
}
],
tableData: []
}
},
created() {
this.query()
},
methods: {
filter() {
this.searchForm.pageNo = 1;
this.searchForm.pageSize = 10;
this.query();
},
changePageNo(pageNo) {
this.searchForm.pageNo = pageNo;
this.query();
},
select(row) {
this.$emit('selectActivityPage', {
pageType: 2,
pageUrl: `${config.h5Host}/activity/${row.uuid}?tenantId=${row.tenantId}&vccToken={token}`,
pageName: row.pageName
});
},
async query() {
const res = await api.getPageList(this.searchForm);
this.total = res.total || 0;
this.tableData = res.data || []
},
reset() {
this.searchForm = {
pageName: '',
pageDescribe: '',
author: '',
pageSize: 10,
pageNo: 1
}
},
}
}
</script>
<style scoped lang="less">
.comWidth {
width: 200px;
}
.search-bar{
width: 100%;
height: 50px;
.btnGroupStyle{
button{
margin-right: 6px;
}
}
/deep/ .ivu-form-item{
margin-bottom: 0;
}
/deep/ .ivu-form-item-label {
font-weight: bold;
display: inline-block;
}
/deep/.ivu-form-item-content {
display: inline-block;
}
}
.tableGroupStyle {
background: #fff;
.toolBarStyle {
display: flex;
justify-content: space-between;
align-items: center;
}
.pageStyle {
margin-top: 20px;
width: 100%;
text-align: right;
}
}
</style>
\ No newline at end of file
app/web/page/editor/view/navigator/components/featurePageTable.vue 0 → 100644
View file @ b341cbe0
<template>
<div>
<Table
:columns="columns"
:data="tableData"
class="tableStyle"
/>
</div>
</template>
<script>
export default {
data() {
return {
columns: [
{
align: 'center',
title: '页面名称',
key: 'name',
},
{
align: 'center',
title: '操作',
render: (h, params) => {
const row = params.row;
return h('div', [
h('Button', {
props: {
type: 'primary',
size: 'small'
},
on: {
click: () => {
this.select(row);
}
}
}, '选择')
]);
},
}
],
tableData: [
{
name: '首页tab',
url: 'home'
},
{
name: '购物车tab',
url: 'shopcart'
},
{
name: '我的tab',
url: 'user'
}
]
}
},
methods: {
select(row) {
this.$emit('selectFeaturePage', {
pageType: 1,
pageUrl: row.url,
pageName: row.name
});
}
}
}
</script>
\ No newline at end of file
app/web/page/editor/view/navigator/components/navigatorPageTable.vue 0 → 100644
View file @ b341cbe0
<template>
<div></div>
</template>
\ No newline at end of file
app/web/page/editor/view/navigator/index.vue
View file @ b341cbe0
......@@ -16,30 +16,30 @@
</FormItem>
</Form>
</div>
<div class="tableGroupStyle">
<div class="toolBarStyle">
<h3>查询数据</h3>
<div>
<Button type="primary" class="btnStyle" @click="add">新增</Button>
<slot></slot>
</div>
<div class="tableGroupStyle">
<div class="toolBarStyle">
<h3>查询数据</h3>
<div>
<Button type="primary" class="btnStyle" @click="add">新增</Button>
<slot></slot>
</div>
<Table
:columns="columns"
:data="tableData"
class="tableStyle"
/>
<Page
:total="total"
v-if="total > 0"
show-elevator
show-sizer
class="pageStyle"
:current="searchForm.pageNo"
:pageSize="searchForm.pageSize"
@on-change="changePageNo"
@on-page-size-change="changePageSize"
/>
</div>
<Table
:columns="columns"
:data="tableData"
class="tableStyle"
/>
<Page
:total="total"
v-if="total > 0"
show-elevator
show-sizer
class="pageStyle"
:current="searchForm.pageNo"
:pageSize="searchForm.pageSize"
@on-change="changePageNo"
@on-page-size-change="changePageSize"
/>
</div>
<Modal v-model="showPagesUrl" title="页面地址列表" width="900">
<Table
......@@ -52,7 +52,7 @@
<addOrEditNavigator
v-model="showAddOrEdit"
:navigatorConfig="navigatorConfig"
@close="showAddOrEdit = false"
@close="closeAddOrEdit"
/>
</div>
</template>
......@@ -96,6 +96,13 @@ export default {
this.tableData = res.data || []
},
closeAddOrEdit(refresh){
this.showAddOrEdit = false;
this.navigatorConfig = null;
if (refresh) {
this.query();
}
},
add() {
this.navigatorConfig = null;
this.showAddOrEdit = true;
......@@ -113,8 +120,18 @@ export default {
},
showAddr(row) {
// 查看地址列表
let configs = row.navigatorData || [];
let arr = [];
for (let i = 0; i < configs.length; i++) {
let obj = {};
obj.id = i + 1;
obj.configName = configs[i].name;
obj.pageName = configs[i].pageName;
obj.pageUrl = configs[i].pageType == 1 ? '' : configs[i].pageUrl;
arr.push(obj)
}
this.urlTableData = arr;
this.showPagesUrl = true;
console.log(row);
},
preview(row) {
// 预览，默认预览第一个导航页面
......@@ -122,7 +139,6 @@ export default {
},
edit(row) {
// 编辑
console.log(row);
this.navigatorConfig = row;
this.showAddOrEdit = true;
},
......
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