功能变化: 鲁班h5前端
parent
ad57ca03e0
commit
1f4087e0ed
|
@ -0,0 +1,28 @@
|
||||||
|
{
|
||||||
|
"name": "luban-h5",
|
||||||
|
"version": "0.0.0",
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"dev": "vue-cli-service serve",
|
||||||
|
"serve": "vue-cli-service serve",
|
||||||
|
"build": "npm run build:editor && npm run build:engine",
|
||||||
|
"lint": "vue-cli-service lint --fix",
|
||||||
|
"deploy": "rm -rf dist && npm run build:editor && npm run build:engine && ./deploy.sh",
|
||||||
|
"test:e2e": "vue-cli-service test:e2e",
|
||||||
|
"test:unit": "vue-cli-service test:unit",
|
||||||
|
"build:editor": "cross-env PAGE=EDITOR vue-cli-service build",
|
||||||
|
"build:engine": "cross-env PAGE=ENGINE vue-cli-service build --target lib --name engine ./src/engine-entry.js",
|
||||||
|
"build:core_editor": "cross-env PAGE=CORE_EDITOR vue-cli-service build --target lib --name core-editor ./src/components/core/index.js"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@luban-h5/lbc-button": "^0.0.3",
|
||||||
|
"@luban-h5/lbp-slide": "^0.0.7",
|
||||||
|
"@luban-h5/lbs-text-align": "^0.0.5",
|
||||||
|
"@luban-h5/plugin-common-props": "0.2.8",
|
||||||
|
"@luban-h5/core-editor": "^0.0.4",
|
||||||
|
"@tinymce/tinymce-vue": "^3",
|
||||||
|
"x-data-spreadsheet": "^1.1.4"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,38 @@
|
||||||
|
// 导入各个组件
|
||||||
|
// 把组件保存到一个数组中
|
||||||
|
import { registerMicroApps, start } from 'qiankun'
|
||||||
|
const components = [
|
||||||
|
]
|
||||||
|
|
||||||
|
// 定义 install 方法
|
||||||
|
const install = function (Vue) {
|
||||||
|
if (install.installed) return
|
||||||
|
install.installed = true
|
||||||
|
// 遍历组件列表并注册全局组件
|
||||||
|
components.map(component => {
|
||||||
|
Vue.component(component.name, component) // component.name 此处使用到组件vue文件中的 name 属性
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
if (typeof window !== 'undefined' && window.Vue) {
|
||||||
|
install(window.Vue)
|
||||||
|
}
|
||||||
|
if (!window.qiankunActiveRule) {
|
||||||
|
window.qiankunActiveRule = []
|
||||||
|
}
|
||||||
|
window.qiankunActiveRule.push('drag-h5')
|
||||||
|
registerMicroApps([
|
||||||
|
{
|
||||||
|
name: 'drag-h5', // 应用的名字
|
||||||
|
entry: '//localhost:8082', // 默认会加载这个html 解析里面的js 动态的执行 (子应用必须支持跨域)fetch
|
||||||
|
container: '#qiankun', // 容器id
|
||||||
|
activeRule: '/#/drag-h5' // 根据路由 激活的路径
|
||||||
|
}
|
||||||
|
])
|
||||||
|
start({ prefetch: 'all' })
|
||||||
|
export default {
|
||||||
|
// 导出的对象必须具备一个 install 方法
|
||||||
|
install,
|
||||||
|
// 组件列表
|
||||||
|
...components
|
||||||
|
}
|
|
@ -0,0 +1,42 @@
|
||||||
|
import { request } from '@/api/service'
|
||||||
|
|
||||||
|
export const urlPrefix = '/api/dvadmin_drag_h5/work_manager/'
|
||||||
|
|
||||||
|
export function GetList (query) {
|
||||||
|
return request({
|
||||||
|
url: urlPrefix,
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function GetObj (obj) {
|
||||||
|
return request({
|
||||||
|
url: urlPrefix + obj.id + '/',
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function createObj (obj) {
|
||||||
|
return request({
|
||||||
|
url: urlPrefix,
|
||||||
|
method: 'post',
|
||||||
|
data: obj
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function UpdateObj (obj) {
|
||||||
|
return request({
|
||||||
|
url: urlPrefix + obj.id + '/',
|
||||||
|
method: 'put',
|
||||||
|
data: obj
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function DelObj (id) {
|
||||||
|
return request({
|
||||||
|
url: urlPrefix + id + '/',
|
||||||
|
method: 'delete',
|
||||||
|
data: { id }
|
||||||
|
})
|
||||||
|
}
|
|
@ -0,0 +1,179 @@
|
||||||
|
export const crudOptions = (vm) => {
|
||||||
|
return {
|
||||||
|
pageOptions: {
|
||||||
|
compact: true
|
||||||
|
},
|
||||||
|
options: {
|
||||||
|
tableType: 'vxe-table',
|
||||||
|
rowKey: true, // 必须设置,true or false
|
||||||
|
rowId: 'id',
|
||||||
|
height: '100%', // 表格高度100%, 使用toolbar必须设置
|
||||||
|
highlightCurrentRow: false
|
||||||
|
|
||||||
|
},
|
||||||
|
rowHandle: {
|
||||||
|
view: {
|
||||||
|
thin: true,
|
||||||
|
text: '',
|
||||||
|
disabled () {
|
||||||
|
// return !vm.hasPermissions('Retrieve')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
width: 230,
|
||||||
|
edit: {
|
||||||
|
thin: true,
|
||||||
|
text: '',
|
||||||
|
disabled () {
|
||||||
|
// return !vm.hasPermissions('Update')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
remove: {
|
||||||
|
thin: true,
|
||||||
|
text: '',
|
||||||
|
disabled () {
|
||||||
|
// return !vm.hasPermissions('Delete')
|
||||||
|
}
|
||||||
|
},
|
||||||
|
custom: [{
|
||||||
|
show (index, row) {
|
||||||
|
return true
|
||||||
|
},
|
||||||
|
disabled () {
|
||||||
|
// return !vm.hasPermissions('Update')
|
||||||
|
},
|
||||||
|
text: '作品设计',
|
||||||
|
type: 'warning',
|
||||||
|
size: 'small',
|
||||||
|
emit: 'workDesign'
|
||||||
|
}]
|
||||||
|
|
||||||
|
},
|
||||||
|
indexRow: { // 或者直接传true,不显示title,不居中
|
||||||
|
title: '序号',
|
||||||
|
align: 'center',
|
||||||
|
width: 100
|
||||||
|
},
|
||||||
|
|
||||||
|
viewOptions: {
|
||||||
|
componentType: 'form'
|
||||||
|
},
|
||||||
|
formOptions: {
|
||||||
|
defaultSpan: 24, // 默认的表单 span
|
||||||
|
width: '35%'
|
||||||
|
},
|
||||||
|
columns: [{
|
||||||
|
title: '关键词',
|
||||||
|
key: 'search',
|
||||||
|
show: false,
|
||||||
|
disabled: true,
|
||||||
|
search: {
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
form: {
|
||||||
|
disabled: true,
|
||||||
|
component: {
|
||||||
|
props: {
|
||||||
|
clearable: true
|
||||||
|
},
|
||||||
|
placeholder: '请输入关键词'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
view: { // 查看对话框组件的单独配置
|
||||||
|
disabled: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'ID',
|
||||||
|
key: 'id',
|
||||||
|
show: false,
|
||||||
|
width: 90,
|
||||||
|
form: {
|
||||||
|
disabled: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: '标题',
|
||||||
|
key: 'title',
|
||||||
|
sortable: true,
|
||||||
|
search: {
|
||||||
|
disabled: false,
|
||||||
|
component: {
|
||||||
|
props: {
|
||||||
|
clearable: true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
type: 'input',
|
||||||
|
form: {
|
||||||
|
rules: [ // 表单校验规则
|
||||||
|
{ required: true, message: '标题必填项' }
|
||||||
|
],
|
||||||
|
component: {
|
||||||
|
props: {
|
||||||
|
clearable: true
|
||||||
|
},
|
||||||
|
placeholder: '请输入标题'
|
||||||
|
},
|
||||||
|
itemProps: {
|
||||||
|
class: { yxtInput: true }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '封面图片',
|
||||||
|
key: 'cover_image_url',
|
||||||
|
type: 'image-uploader',
|
||||||
|
sortable: true,
|
||||||
|
form: {
|
||||||
|
rules: [ // 表单校验规则
|
||||||
|
{ required: true, message: '封面图片必填项' }
|
||||||
|
],
|
||||||
|
component: {
|
||||||
|
props: {
|
||||||
|
clearable: true
|
||||||
|
},
|
||||||
|
placeholder: '请输入封面图片'
|
||||||
|
},
|
||||||
|
itemProps: {
|
||||||
|
class: { yxtInput: true }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '是否发布',
|
||||||
|
key: 'is_publish',
|
||||||
|
sortable: true,
|
||||||
|
type: 'radio',
|
||||||
|
dict: {
|
||||||
|
data: vm.dictionary('button_whether_bool')
|
||||||
|
},
|
||||||
|
form: {
|
||||||
|
value: false,
|
||||||
|
component: {
|
||||||
|
placeholder: '请选择是是否发布'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
title: '是否模板',
|
||||||
|
key: 'is_template',
|
||||||
|
sortable: true,
|
||||||
|
type: 'radio',
|
||||||
|
dict: {
|
||||||
|
data: vm.dictionary('button_whether_bool')
|
||||||
|
},
|
||||||
|
form: {
|
||||||
|
value: false,
|
||||||
|
component: {
|
||||||
|
placeholder: '请选择是是否模板'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
].concat(vm.commonEndColumns({
|
||||||
|
description: {
|
||||||
|
showForm: true,
|
||||||
|
showTable: true
|
||||||
|
}
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,78 @@
|
||||||
|
<template>
|
||||||
|
<d2-container :class="{ 'page-compact': crud.pageOptions.compact }">
|
||||||
|
<d2-crud-x
|
||||||
|
ref="d2Crud"
|
||||||
|
v-bind="_crudProps"
|
||||||
|
v-on="_crudListeners"
|
||||||
|
@workDesign="workDesign"
|
||||||
|
>
|
||||||
|
<div slot="header">
|
||||||
|
<crud-search
|
||||||
|
ref="search"
|
||||||
|
:options="crud.searchOptions"
|
||||||
|
@submit="handleSearch"
|
||||||
|
/>
|
||||||
|
<el-button-group>
|
||||||
|
<el-button
|
||||||
|
size="small"
|
||||||
|
v-permission="'Create'"
|
||||||
|
type="primary"
|
||||||
|
@click="addRow"
|
||||||
|
><i class="el-icon-plus" /> 创建新作品</el-button
|
||||||
|
>
|
||||||
|
</el-button-group>
|
||||||
|
<crud-toolbar
|
||||||
|
:search.sync="crud.searchOptions.show"
|
||||||
|
:compact.sync="crud.pageOptions.compact"
|
||||||
|
:columns="crud.columns"
|
||||||
|
@refresh="doRefresh()"
|
||||||
|
@columns-filter-changed="handleColumnsFilterChanged"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</d2-crud-x>
|
||||||
|
<div id="vue"></div>
|
||||||
|
</d2-container>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// 作品管理
|
||||||
|
import * as api from './api'
|
||||||
|
import { crudOptions } from './crud'
|
||||||
|
import { d2CrudPlus } from 'd2-crud-plus'
|
||||||
|
export default {
|
||||||
|
name: 'workManager',
|
||||||
|
mixins: [d2CrudPlus.crud],
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getCrudOptions () {
|
||||||
|
return crudOptions(this)
|
||||||
|
},
|
||||||
|
pageRequest (query) {
|
||||||
|
return api.GetList(query)
|
||||||
|
},
|
||||||
|
addRequest (row) {
|
||||||
|
return api.createObj(row)
|
||||||
|
},
|
||||||
|
updateRequest (row) {
|
||||||
|
return api.UpdateObj(row)
|
||||||
|
},
|
||||||
|
delRequest (row) {
|
||||||
|
return api.DelObj(row.id)
|
||||||
|
},
|
||||||
|
workDesign (row) {
|
||||||
|
this.$router.push({ path: '/drag-h5/editor/' + row.row.id })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.yxtInput {
|
||||||
|
.el-form-item__label {
|
||||||
|
color: #49a1ff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue