QM303176530
4 years ago
8 changed files with 138 additions and 539 deletions
-
13server/cmd/datas/authority_menus.go
-
46server/cmd/datas/menus.go
-
242web/package-lock.json
-
2web/package.json
-
19web/src/main.js
-
187web/src/view/example/form/form.vue
-
53web/src/view/example/rte/rte.vue
-
115web/src/view/example/table/table.vue
@ -1,187 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<el-form :model="form" label-width="80px" ref="form"> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动名称</label></el-col> |
|||
<el-col :span="10" :xs="14"><el-input v-model="form.name"></el-input></el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动区域</label></el-col> |
|||
<el-col :span="10" :xs="14"> |
|||
<el-select placeholder="请选择活动区域" v-model="form.region"> |
|||
<el-option label="上海" value="shanghai"></el-option> |
|||
<el-option label="北京" value="beijing"></el-option> |
|||
</el-select> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动时间</label></el-col> |
|||
<el-col :span="10" :xs="18"> |
|||
<el-col :span="11"> |
|||
<el-date-picker placeholder="选择日期" style="width: 100%;" type="date" v-model="form.date1"></el-date-picker> |
|||
</el-col> |
|||
<el-col :span="2" class="line">——</el-col> |
|||
<el-col :span="11"> |
|||
<el-time-picker placeholder="选择时间" style="width: 100%;" v-model="form.date2"></el-time-picker> |
|||
</el-col> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">即时配送</label></el-col> |
|||
<el-col :span="10" :xs="14"><el-switch v-model="form.delivery"></el-switch></el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动性质</label></el-col> |
|||
<el-col :span="10" :xs="14"> |
|||
<el-checkbox-group v-model="form.type"> |
|||
<el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox> |
|||
<el-checkbox label="地推活动" name="type"></el-checkbox> |
|||
<el-checkbox label="线下主题活动" name="type"></el-checkbox> |
|||
<el-checkbox label="单纯品牌曝光" name="type"></el-checkbox> |
|||
</el-checkbox-group> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">特殊资源</label></el-col> |
|||
<el-col :span="10" :xs="14"> |
|||
<el-radio-group v-model="form.resource"> |
|||
<el-radio label="线上品牌商赞助"></el-radio> |
|||
<el-radio label="线下场地免费"></el-radio> |
|||
</el-radio-group> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动形式</label></el-col> |
|||
<el-col :span="10" :xs="14"><el-input type="textarea" v-model="form.desc"></el-input></el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">穿梭框</label></el-col> |
|||
<el-col :span="20" :xs="24"> |
|||
<el-transfer |
|||
:data="data" |
|||
:filter-method="filterMethod" |
|||
filter-placeholder="请输入城市拼音" |
|||
filterable |
|||
v-model="value" |
|||
></el-transfer> |
|||
</el-col> |
|||
</el-row> |
|||
<el-row> |
|||
<el-col :span="3" :xs="6"><label for="">活动时间</label></el-col> |
|||
<el-col :span="10"><el-input v-model="form.name"></el-input></el-col> |
|||
</el-row> |
|||
<el-row type="flex" justify="center"> |
|||
<el-col :span="13"> |
|||
<el-button @click="onSubmit" type="primary">立即创建</el-button> |
|||
<el-button>取消</el-button> |
|||
</el-col> |
|||
|
|||
</el-row> |
|||
|
|||
<!-- <el-form-item label="活动名称"> |
|||
<el-input v-model="form.name"></el-input> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-select label="活动区域" placeholder="请选择活动区域" v-model="form.region"> |
|||
<el-option label="上海" value="shanghai"></el-option> |
|||
<el-option label="北京" value="beijing"></el-option> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="活动时间"> |
|||
<el-col :span="11"> |
|||
<el-date-picker placeholder="选择日期" style="width: 100%;" type="date" v-model="form.date1"></el-date-picker> |
|||
</el-col> |
|||
<el-col :span="2" class="line" style="text-align: center">——</el-col> |
|||
<el-col :span="11"> |
|||
<el-time-picker placeholder="选择时间" style="width: 100%;" v-model="form.date2"></el-time-picker> |
|||
</el-col> |
|||
</el-form-item> |
|||
<el-form-item label="即时配送"> |
|||
<el-switch v-model="form.delivery"></el-switch> |
|||
</el-form-item> |
|||
<el-form-item label="活动性质"> |
|||
<el-checkbox-group v-model="form.type"> |
|||
<el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox> |
|||
<el-checkbox label="地推活动" name="type"></el-checkbox> |
|||
<el-checkbox label="线下主题活动" name="type"></el-checkbox> |
|||
<el-checkbox label="单纯品牌曝光" name="type"></el-checkbox> |
|||
</el-checkbox-group> |
|||
</el-form-item> |
|||
<el-form-item label="特殊资源"> |
|||
<el-radio-group v-model="form.resource"> |
|||
<el-radio label="线上品牌商赞助"></el-radio> |
|||
<el-radio label="线下场地免费"></el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
<el-form-item label="活动形式"> |
|||
<el-input type="textarea" v-model="form.desc"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="穿梭框"> |
|||
<el-transfer |
|||
:data="data" |
|||
:filter-method="filterMethod" |
|||
filter-placeholder="请输入城市拼音" |
|||
filterable |
|||
v-model="value" |
|||
></el-transfer> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button @click="onSubmit" type="primary">立即创建</el-button> |
|||
<el-button>取消</el-button> |
|||
</el-form-item> --> |
|||
</el-form> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
export default { |
|||
data() { |
|||
const generateData = () => { |
|||
const data = [] |
|||
const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都'] |
|||
const pinyin = [ |
|||
'shanghai', |
|||
'beijing', |
|||
'guangzhou', |
|||
'shenzhen', |
|||
'nanjing', |
|||
'xian', |
|||
'chengdu' |
|||
] |
|||
cities.forEach((city, index) => { |
|||
data.push({ |
|||
label: city, |
|||
key: index, |
|||
pinyin: pinyin[index] |
|||
}) |
|||
}) |
|||
return data |
|||
} |
|||
return { |
|||
form: { |
|||
name: '', |
|||
region: '', |
|||
date1: '', |
|||
date2: '', |
|||
delivery: false, |
|||
type: [], |
|||
resource: '', |
|||
desc: '' |
|||
}, |
|||
data: generateData(), |
|||
value: [], |
|||
|
|||
} |
|||
}, |
|||
methods: { |
|||
filterMethod(query, item) { |
|||
return item.pinyin.indexOf(query) > -1 |
|||
}, |
|||
onSubmit() { |
|||
this.$message({ |
|||
message: '创建成功', |
|||
type: 'success' |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,53 +0,0 @@ |
|||
<template> |
|||
<div> |
|||
<h1>富文本编辑器</h1> |
|||
<div class="edit_container"> |
|||
<quill-editor |
|||
:options="editorOption" |
|||
@blur="onEditorBlur($event)" |
|||
@change="onEditorChange($event)" |
|||
@focus="onEditorFocus($event)" |
|||
ref="myQuillEditor" |
|||
v-model="content" |
|||
></quill-editor> |
|||
<el-button plain @click="saveHtml">保存</el-button> |
|||
</div> |
|||
<h1>markdown编辑器</h1> |
|||
<div class="edit"> |
|||
<mavon-editor v-model="model.content"></mavon-editor> |
|||
<el-button type="primary" size="small" @click="submit">发表</el-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'App', |
|||
data() { |
|||
return { |
|||
content: `<p>hello world</p>`, |
|||
editorOption: {}, |
|||
model:{ |
|||
content:'' |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
editor() { |
|||
return this.$refs.myQuillEditor.quill |
|||
} |
|||
}, |
|||
methods: { |
|||
// onEditorReady(editor) { // 准备编辑器 |
|||
|
|||
// }, |
|||
onEditorBlur() {}, // 失去焦点事件 |
|||
onEditorFocus() {}, // 获得焦点事件 |
|||
onEditorChange() {}, // 内容改变事件 |
|||
saveHtml() { |
|||
console.log(this.content) |
|||
}, // 保存方法 |
|||
submit(){} |
|||
} |
|||
} |
|||
</script> |
|||
@ -1,115 +0,0 @@ |
|||
// table 纯前端示例 |
|||
<template> |
|||
<div> |
|||
<el-table |
|||
:data="tableData" |
|||
@selection-change="handleSelectionChange" |
|||
border |
|||
ref="multipleTable" |
|||
stripe |
|||
style="width: 100%" |
|||
tooltip-effect="dark" |
|||
> |
|||
<el-table-column type="selection" width="55"></el-table-column> |
|||
<el-table-column label="日期" width="120"> |
|||
<template slot-scope="scope">{{ scope.row.date }}</template> |
|||
</el-table-column> |
|||
<el-table-column label="姓名" prop="name" width="120"></el-table-column> |
|||
<el-table-column label="年龄" prop="age" width="120"></el-table-column> |
|||
<el-table-column label="住址" prop="address" min-width="200" show-overflow-tooltip></el-table-column> |
|||
<el-table-column label="是否禁用" prop="switch" width="180"> |
|||
<template slot-scope="scope"> |
|||
<el-switch active-text="开启" inactive-text="禁用" v-model="scope.row.switch"></el-switch> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="按钮组" width="200"> |
|||
<template slot-scope="scope" > |
|||
<el-button type="text" size="small" @click="toggleSelection([scope.row])">按钮1</el-button> |
|||
<el-button type="text" size="small" @click="toggleSelection([scope.row])">按钮2</el-button> |
|||
<el-button type="text" size="small" @click="toggleSelection([scope.row])">按钮3</el-button> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<div style="margin-top: 20px"> |
|||
<el-button @click="toggleSelection([tableData[1], tableData[2]])">切换第二、第三行的选中状态</el-button> |
|||
<el-button @click="toggleSelection()">取消选择</el-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'Table', |
|||
data() { |
|||
return { |
|||
tableData: [ |
|||
{ |
|||
date: '2016-05-03', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:true |
|||
}, |
|||
{ |
|||
date: '2016-05-02', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:true |
|||
}, |
|||
{ |
|||
date: '2016-05-04', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:true |
|||
}, |
|||
{ |
|||
date: '2016-05-01', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:false |
|||
}, |
|||
{ |
|||
date: '2016-05-08', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:true |
|||
}, |
|||
{ |
|||
date: '2016-05-06', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:true |
|||
}, |
|||
{ |
|||
date: '2016-05-07', |
|||
name: '王小虎', |
|||
age: 12, |
|||
address: '上海市普陀区金沙江路 1518 弄', |
|||
switch:false |
|||
} |
|||
], |
|||
multipleSelection: [] |
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
toggleSelection(rows) { |
|||
if (rows) { |
|||
rows.forEach(row => { |
|||
this.$refs.multipleTable.toggleRowSelection(row) |
|||
}) |
|||
} else { |
|||
this.$refs.multipleTable.clearSelection() |
|||
} |
|||
}, |
|||
handleSelectionChange(val) { |
|||
this.multipleSelection = val |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue