init
- 框架初始化 - 安装插件 - 修复PHP8.4报错
This commit is contained in:
466
public/assets/js/backend/shopro/wechat/menu.js
Normal file
466
public/assets/js/backend/shopro/wechat/menu.js
Normal file
@@ -0,0 +1,466 @@
|
||||
define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {
|
||||
|
||||
var Controller = {
|
||||
index: () => {
|
||||
const { reactive, onMounted } = Vue
|
||||
const index = {
|
||||
setup() {
|
||||
const state = reactive({
|
||||
current: [],
|
||||
data: [],
|
||||
order: '',
|
||||
sort: '',
|
||||
})
|
||||
|
||||
function getData() {
|
||||
Fast.api.ajax({
|
||||
url: 'shopro/wechat/menu',
|
||||
type: 'GET',
|
||||
data: {
|
||||
page: pagination.page,
|
||||
list_rows: pagination.list_rows,
|
||||
order: state.order,
|
||||
sort: state.sort,
|
||||
},
|
||||
}, function (ret, res) {
|
||||
state.current = res.data.current
|
||||
state.data = res.data.list.data
|
||||
pagination.total = res.data.list.total
|
||||
return false
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
|
||||
function onChangeSort({ prop, order }) {
|
||||
state.order = order == 'ascending' ? 'asc' : 'desc';
|
||||
state.sort = prop;
|
||||
getData();
|
||||
}
|
||||
|
||||
const pagination = reactive({
|
||||
page: 1,
|
||||
list_rows: 10,
|
||||
total: 0,
|
||||
})
|
||||
|
||||
function onAdd() {
|
||||
Fast.api.open(`shopro/wechat/menu/add?type=add`, "添加", {
|
||||
callback() {
|
||||
getData()
|
||||
}
|
||||
})
|
||||
}
|
||||
function onEdit(id) {
|
||||
Fast.api.open(`shopro/wechat/menu/edit?type=edit&id=${id}`, "编辑", {
|
||||
callback() {
|
||||
getData()
|
||||
}
|
||||
})
|
||||
}
|
||||
function onDelete(id) {
|
||||
Fast.api.ajax({
|
||||
url: `shopro/wechat/menu/delete/id/${id}`,
|
||||
type: 'DELETE',
|
||||
}, function (ret, res) {
|
||||
getData()
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
function onPublish(id) {
|
||||
Fast.api.ajax({
|
||||
url: `shopro/wechat/menu/publish/id/${id}`,
|
||||
type: 'POST',
|
||||
}, function (ret, res) {
|
||||
getData()
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
function onCopy(id) {
|
||||
Fast.api.ajax({
|
||||
url: `shopro/wechat/menu/copy/id/${id}`,
|
||||
type: 'POST',
|
||||
}, function (ret, res) {
|
||||
getData()
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getData()
|
||||
})
|
||||
|
||||
return {
|
||||
state,
|
||||
getData,
|
||||
onChangeSort,
|
||||
pagination,
|
||||
onAdd,
|
||||
onEdit,
|
||||
onDelete,
|
||||
onPublish,
|
||||
onCopy,
|
||||
}
|
||||
}
|
||||
}
|
||||
createApp('index', index);
|
||||
},
|
||||
add: () => {
|
||||
Controller.form();
|
||||
},
|
||||
edit: () => {
|
||||
Controller.form();
|
||||
},
|
||||
form: () => {
|
||||
const { reactive, ref, onMounted, getCurrentInstance } = Vue
|
||||
const addEdit = {
|
||||
setup() {
|
||||
const { proxy } = getCurrentInstance();
|
||||
|
||||
const state = reactive({
|
||||
type: new URLSearchParams(location.search).get('type'),
|
||||
id: new URLSearchParams(location.search).get('id'),
|
||||
|
||||
rightShow: false,
|
||||
selectLevel: null,
|
||||
selectedIndex1: null,
|
||||
selectedIndex2: null,
|
||||
right: [],
|
||||
})
|
||||
|
||||
const defaultSubButton = {
|
||||
name: '未命名',
|
||||
type: 'view',
|
||||
selected: true,
|
||||
show: true,
|
||||
url: '',
|
||||
appid: '',
|
||||
pagepath: '',
|
||||
sub_button: [],
|
||||
media_type: 'news',
|
||||
media_id: '',
|
||||
};
|
||||
|
||||
const form = reactive({
|
||||
model: {
|
||||
name: '',
|
||||
rules: []
|
||||
},
|
||||
rules: {
|
||||
name: [{ required: true, message: '请输入菜单名称', trigger: 'blur' }],
|
||||
},
|
||||
})
|
||||
|
||||
function getDetail() {
|
||||
Fast.api.ajax({
|
||||
url: `shopro/wechat/menu/detail/id/${state.id}`,
|
||||
type: 'GET',
|
||||
}, function (ret, res) {
|
||||
form.model = res.data;
|
||||
initData();
|
||||
return false
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
function initData() {
|
||||
form.model.rules.forEach((d) => {
|
||||
loopData(d);
|
||||
});
|
||||
function loopData(d) {
|
||||
for (var key in defaultSubButton) {
|
||||
if (!d[key]) {
|
||||
d[key] = JSON.parse(JSON.stringify(defaultSubButton))[key];
|
||||
}
|
||||
d.selected = false;
|
||||
d.show = false;
|
||||
}
|
||||
if (d.type == 'click') {
|
||||
d.media_type = d.key?.split('|')[0];
|
||||
d.media_id = d.key?.split('|')[1];
|
||||
}
|
||||
if (d.sub_button && d.sub_button.length > 0) {
|
||||
d.sub_button.forEach((s) => {
|
||||
loopData(s);
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onAddMenu(index, level) {
|
||||
//右侧显示
|
||||
state.rightShow = true;
|
||||
state.selectLevel = level;
|
||||
// 添加level2的数据
|
||||
if (index != null) {
|
||||
state.selectedIndex1 = index;
|
||||
form.model.rules.forEach((i) => {
|
||||
i.selected = false;
|
||||
if (i.sub_button) {
|
||||
i.sub_button.forEach((j) => {
|
||||
j.selected = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
form.model.rules[index].sub_button.push(JSON.parse(JSON.stringify(defaultSubButton)));
|
||||
state.right = form.model.rules[index].sub_button[form.model.rules[index].sub_button.length - 1];
|
||||
state.selectedIndex2 = form.model.rules[index].sub_button.length - 1;
|
||||
} else {
|
||||
// 添加level1的数据 所有的level1不显示
|
||||
form.model.rules.forEach((i) => {
|
||||
i.selected = false;
|
||||
i.show = false;
|
||||
});
|
||||
form.model.rules.push(JSON.parse(JSON.stringify(defaultSubButton)));
|
||||
state.selectedIndex1 = form.model.rules.length - 1;
|
||||
state.right = form.model.rules[form.model.rules.length - 1];
|
||||
}
|
||||
}
|
||||
function onEditMenu(index1, index2) {
|
||||
state.selectedIndex1 = index1;
|
||||
state.selectedIndex2 = index2;
|
||||
state.rightShow = true;
|
||||
form.model.rules.forEach((i) => {
|
||||
i.selected = false;
|
||||
i.show = false;
|
||||
if (i.sub_button) {
|
||||
i.sub_button.forEach((j) => {
|
||||
j.selected = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
form.model.rules[index1].show = true;
|
||||
if (index2 == null) {
|
||||
state.selectLevel = 1;
|
||||
form.model.rules[index1].selected = true;
|
||||
form.model.rules[index1].show = true;
|
||||
state.right = form.model.rules[index1];
|
||||
} else {
|
||||
state.selectLevel = 2;
|
||||
form.model.rules[index1].sub_button[index2].selected = true;
|
||||
state.right = form.model.rules[index1].sub_button[index2];
|
||||
}
|
||||
getMaterialSelect()
|
||||
}
|
||||
function onDeleteMenu() {
|
||||
if (state.selectedIndex2 != null) {
|
||||
form.model.rules[state.selectedIndex1].sub_button.splice(state.selectedIndex2, 1);
|
||||
if (form.model.rules[state.selectedIndex1].sub_button.length > 0) {
|
||||
if (state.selectedIndex2 == 0) {
|
||||
form.model.rules[state.selectedIndex1].sub_button[0].selected = true;
|
||||
state.right = menuData[state.selectedIndex1].sub_button[0];
|
||||
} else {
|
||||
form.model.rules[state.selectedIndex1].sub_button[state.selectedIndex2 - 1].selected = true;
|
||||
state.right = form.model.rules[state.selectedIndex1].sub_button[state.selectedIndex2 - 1];
|
||||
state.selectedIndex2--;
|
||||
}
|
||||
} else {
|
||||
state.right = {};
|
||||
state.rightShow = false;
|
||||
}
|
||||
} else {
|
||||
form.model.rules.splice(state.selectedIndex1, 1);
|
||||
if (form.model.rules.length > 0) {
|
||||
if (state.selectedIndex1 == 0) {
|
||||
form.model.rules[0].selected = true;
|
||||
form.model.rules[0].show = true;
|
||||
state.right = form.model.rules[0];
|
||||
} else {
|
||||
form.model.rules[state.selectedIndex1 - 1].selected = true;
|
||||
form.model.rules[state.selectedIndex1 - 1].show = true;
|
||||
state.right = form.model.rules[state.selectedIndex1 - 1];
|
||||
state.selectedIndex1--;
|
||||
}
|
||||
} else {
|
||||
state.right = {};
|
||||
state.rightShow = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onSelectUrl() {
|
||||
Fast.api.open("shopro/data/page/select", "选择链接", {
|
||||
callback(data) {
|
||||
state.right.url = data.fullPath.url;
|
||||
if (state.right.type == 'miniprogram') {
|
||||
state.right.appid = data.fullPath.appid;
|
||||
state.right.pagepath = data.fullPath.pagepath;
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function onChangeType() {
|
||||
if (state.right.type == 'click') {
|
||||
getMaterialSelect();
|
||||
}
|
||||
}
|
||||
|
||||
function onChangeMediaType() {
|
||||
material.pagination.page = 1
|
||||
getMaterialSelect()
|
||||
}
|
||||
const material = reactive({
|
||||
select: [],
|
||||
pagination: {
|
||||
page: 1,
|
||||
list_rows: 10,
|
||||
total: 0,
|
||||
}
|
||||
})
|
||||
function getMaterialSelect() {
|
||||
Fast.api.ajax({
|
||||
url: 'shopro/wechat/material/select',
|
||||
type: 'GET',
|
||||
data: {
|
||||
type: state.right.media_type,
|
||||
page: material.pagination.page,
|
||||
list_rows: material.pagination.list_rows,
|
||||
},
|
||||
}, function (ret, res) {
|
||||
material.select = initMaterialData(res.data.data, state.right.media_type)
|
||||
material.pagination.total = res.data.total
|
||||
return false
|
||||
}, function (ret, res) { })
|
||||
}
|
||||
function initMaterialData(data, type) {
|
||||
let options = [];
|
||||
if (type == 'news') {
|
||||
data.forEach((i) => {
|
||||
i.content.news_item.forEach((e) => {
|
||||
options.push({
|
||||
media_id: i.media_id,
|
||||
title: e.title,
|
||||
thumb_url: e.thumb_url,
|
||||
type,
|
||||
});
|
||||
});
|
||||
});
|
||||
} else if (type == 'image') {
|
||||
data.forEach((i) => {
|
||||
options.push({
|
||||
media_id: i.media_id,
|
||||
title: i.name,
|
||||
thumb_url: i.url,
|
||||
type,
|
||||
});
|
||||
});
|
||||
} else if (type == 'video') {
|
||||
data.forEach((i) => {
|
||||
options.push({
|
||||
media_id: i.media_id,
|
||||
title: i.name,
|
||||
thumb_url: i.cover_url,
|
||||
type,
|
||||
});
|
||||
});
|
||||
} else if (type == 'voice') {
|
||||
data.forEach((i) => {
|
||||
options.push({
|
||||
media_id: i.media_id,
|
||||
title: i.name,
|
||||
thumb_url: '',
|
||||
type,
|
||||
});
|
||||
});
|
||||
} else if (type == 'text') {
|
||||
data.forEach((i) => {
|
||||
options.push({
|
||||
media_id: i.id,
|
||||
title: i.content,
|
||||
thumb_url: i.content,
|
||||
type,
|
||||
});
|
||||
});
|
||||
} else if (type == 'link') {
|
||||
data.forEach((i) => {
|
||||
options.push({
|
||||
media_id: i.id,
|
||||
title: i.content.title,
|
||||
thumb_url: i.content.image,
|
||||
description: i.content.description,
|
||||
type,
|
||||
});
|
||||
});
|
||||
}
|
||||
return options;
|
||||
}
|
||||
|
||||
function formatData() {
|
||||
// 不同类型包含的数据组
|
||||
const view = ['name', 'type', 'url', 'sub_button'];
|
||||
const miniprogram = ['name', 'type', 'url', 'appid', 'pagepath', 'sub_button'];
|
||||
const click = ['name', 'type', 'media_type', 'media_id', 'sub_button'];
|
||||
|
||||
const data = JSON.parse(JSON.stringify(form.model.rules));
|
||||
data.forEach((d) => {
|
||||
loopData(d);
|
||||
});
|
||||
function loopData(d) {
|
||||
if (d.type == 'view') {
|
||||
for (let j in d) {
|
||||
if (!view.includes(j)) delete d[j];
|
||||
}
|
||||
}
|
||||
if (d.type == 'miniprogram') {
|
||||
for (let j in d) {
|
||||
if (!miniprogram.includes(j)) delete d[j];
|
||||
}
|
||||
}
|
||||
if (d.type == 'click') {
|
||||
for (let j in d) {
|
||||
if (!click.includes(j)) delete d[j];
|
||||
}
|
||||
d.key = d.media_type + '|' + d.media_id;
|
||||
delete d.media_type;
|
||||
delete d.media_id;
|
||||
}
|
||||
if (d.sub_button && d.sub_button.length > 0) {
|
||||
for (let j in d) {
|
||||
if (j != 'name' && j != 'sub_button') delete d[j];
|
||||
}
|
||||
d.sub_button.forEach((s) => {
|
||||
loopData(s);
|
||||
});
|
||||
} else {
|
||||
delete d.sub_button;
|
||||
}
|
||||
}
|
||||
return data;
|
||||
}
|
||||
function onConfirm(data = {}) {
|
||||
let submitForm = { name: form.model.name, rules: formatData(), ...data };
|
||||
// proxy.$refs['formRef'].validate((valid) => {
|
||||
// if (valid) {
|
||||
Fast.api.ajax({
|
||||
url: state.type == 'add' ? 'shopro/wechat/menu/add' : `shopro/wechat/menu/edit/id/${state.id}`,
|
||||
type: 'POST',
|
||||
data: submitForm,
|
||||
}, function (ret, res) {
|
||||
Fast.api.close()
|
||||
}, function (ret, res) { })
|
||||
// }
|
||||
// });
|
||||
}
|
||||
function onPublish() {
|
||||
onConfirm({ publish: 1 })
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
state.type == 'edit' && getDetail()
|
||||
})
|
||||
|
||||
return {
|
||||
state,
|
||||
form,
|
||||
onAddMenu,
|
||||
onEditMenu,
|
||||
onDeleteMenu,
|
||||
onSelectUrl,
|
||||
onChangeType,
|
||||
onChangeMediaType,
|
||||
material,
|
||||
getMaterialSelect,
|
||||
onConfirm,
|
||||
onPublish
|
||||
}
|
||||
}
|
||||
}
|
||||
createApp('addEdit', addEdit);
|
||||
}
|
||||
};
|
||||
return Controller;
|
||||
});
|
||||
Reference in New Issue
Block a user