|
|
|
@ -9,33 +9,36 @@ |
|
|
|
</el-breadcrumb> |
|
|
|
</div> |
|
|
|
<div class="container banner_title"> |
|
|
|
<div class="banner_title_item"> |
|
|
|
<img src="../../../assets/img/photo.png" alt="" class="photo"> |
|
|
|
<p>图片库</p> |
|
|
|
</div> |
|
|
|
<div class="banner_title_item"> |
|
|
|
<img src="../../../assets/img/preview.png" alt="" class="preview"> |
|
|
|
<p>效果预览</p> |
|
|
|
</div> |
|
|
|
<div class="banner_title_item"> |
|
|
|
<img src="../../../assets/img/photo.png" alt="" class="photo"> |
|
|
|
<p>图片库</p> |
|
|
|
</div> |
|
|
|
<div class="banner_title_item"> |
|
|
|
<img src="../../../assets/img/preview.png" alt="" class="preview"> |
|
|
|
<p>效果预览</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="container banner_content"> |
|
|
|
<div class="banner_num"> |
|
|
|
<span class="banner_num_span">图片数量：</span> |
|
|
|
<el-select placeholder="请选择图片数量" class="handle-select mr10"> |
|
|
|
<el-input placeholder="请输入图片数量" v-model.number="banner_num"></el-input> |
|
|
|
<!-- <el-select placeholder="请选择图片数量" class="handle-select mr10"> |
|
|
|
<el-option key="1" label="广东省" value="广东省"></el-option> |
|
|
|
<el-option key="2" label="湖南省" value="湖南省"></el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div class="banner_num"> |
|
|
|
<span class="banner_num_span">图片1：</span> |
|
|
|
<el-input placeholder="请输入图片名称"></el-input> |
|
|
|
<el-input placeholder="请选择图片路径" class="banner_num_input"></el-input> |
|
|
|
<span class="banner_num_span1">上传图片</span> |
|
|
|
<span class="banner_num_span1">打开图片库</span> |
|
|
|
<span class="banner_num_span1">上移</span> |
|
|
|
<span class="banner_num_span1">下移</span> |
|
|
|
</el-select> --> |
|
|
|
</div> |
|
|
|
<div class="banner_num"> |
|
|
|
<template v-if="banner_num !=''"> |
|
|
|
<div class="banner_num" v-for="(item,index) in banner_num" :key="index"> |
|
|
|
<span class="banner_num_span">图片{{index+1}}：</span> |
|
|
|
<el-input placeholder="请输入图片名称"></el-input> |
|
|
|
<el-input placeholder="请选择图片路径" class="banner_num_input"></el-input> |
|
|
|
<span class="banner_num_span1">上传图片</span> |
|
|
|
<span class="banner_num_span1">打开图片库</span> |
|
|
|
<span class="banner_num_span1">上移</span> |
|
|
|
<span class="banner_num_span1">下移</span> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<!-- <div class="banner_num"> |
|
|
|
<span class="banner_num_span">图片2：</span> |
|
|
|
<el-input placeholder="请输入图片名称"></el-input> |
|
|
|
<el-input placeholder="请选择图片路径" class="banner_num_input"></el-input> |
|
|
|
@ -52,23 +55,8 @@ |
|
|
|
<span class="banner_num_span1">打开图片库</span> |
|
|
|
<span class="banner_num_span1">上移</span> |
|
|
|
<span class="banner_num_span1">下移</span> |
|
|
|
</div> |
|
|
|
</div> --> |
|
|
|
</div> |
|
|
|
<!-- 编辑弹出框 --> |
|
|
|
<el-dialog title="编辑" :visible.sync="editVisible" width="30%"> |
|
|
|
<el-form ref="form" :model="form" label-width="70px"> |
|
|
|
<el-form-item label="用户名"> |
|
|
|
<el-input v-model="form.name"></el-input> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="地址"> |
|
|
|
<el-input v-model="form.address"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<el-button @click="editVisible = false">取 消</el-button> |
|
|
|
<el-button type="primary" @click="saveEdit">确 定</el-button> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -84,49 +72,12 @@ export default { |
|
|
|
pageIndex: 1, |
|
|
|
pageSize: 10 |
|
|
|
}, |
|
|
|
banner_num:'', |
|
|
|
tableData: [], |
|
|
|
multipleSelection: [], |
|
|
|
delList: [], |
|
|
|
editVisible: false, |
|
|
|
pageTotal: 0, |
|
|
|
form: {}, |
|
|
|
idx: -1, |
|
|
|
id: -1, |
|
|
|
pickerOptions: { |
|
|
|
shortcuts: [ |
|
|
|
{ |
|
|
|
text: "最近一周", |
|
|
|
onClick(picker) { |
|
|
|
const end = new Date(); |
|
|
|
const start = new Date(); |
|
|
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); |
|
|
|
picker.$emit("pick", [start, end]); |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
text: "最近一个月", |
|
|
|
onClick(picker) { |
|
|
|
const end = new Date(); |
|
|
|
const start = new Date(); |
|
|
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30); |
|
|
|
picker.$emit("pick", [start, end]); |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
text: "最近三个月", |
|
|
|
onClick(picker) { |
|
|
|
const end = new Date(); |
|
|
|
const start = new Date(); |
|
|
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90); |
|
|
|
picker.$emit("pick", [start, end]); |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
}, |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.getData(); |
|
|
|
// this.getData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
// 获取 easy-mock 的模拟数据 |
|
|
|
@ -134,47 +85,8 @@ export default { |
|
|
|
fetchData(this.query).then(res => { |
|
|
|
// console.log(res); |
|
|
|
this.tableData = res.list; |
|
|
|
this.pageTotal = res.pageTotal || 50; |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 触发搜索按钮 |
|
|
|
handleSearch() { |
|
|
|
this.$set(this.query, 'pageIndex', 1); |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
// 删除操作 |
|
|
|
handleDelete(index, row) { |
|
|
|
// 二次确认删除 |
|
|
|
this.$confirm('确定要删除吗？', '提示', { |
|
|
|
type: 'warning' |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
this.$message.success('删除成功'); |
|
|
|
this.tableData.splice(index, 1); |
|
|
|
}) |
|
|
|
.catch(() => {}); |
|
|
|
}, |
|
|
|
// 多选操作 |
|
|
|
handleSelectionChange(val) { |
|
|
|
this.multipleSelection = val; |
|
|
|
}, |
|
|
|
// 编辑操作 |
|
|
|
handleEdit(index, row) { |
|
|
|
this.idx = index; |
|
|
|
this.form = row; |
|
|
|
this.editVisible = true; |
|
|
|
}, |
|
|
|
// 保存编辑 |
|
|
|
saveEdit() { |
|
|
|
this.editVisible = false; |
|
|
|
this.$message.success(`修改第 ${this.idx + 1} 行成功`); |
|
|
|
this.$set(this.tableData, this.idx, this.form); |
|
|
|
}, |
|
|
|
// 分页导航 |
|
|
|
handlePageChange(val) { |
|
|
|
this.$set(this.query, 'pageIndex', val); |
|
|
|
this.getData(); |
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
</script> |
|
|
|
@ -194,6 +106,7 @@ export default { |
|
|
|
text-decoration: underline; |
|
|
|
display: inline-block; |
|
|
|
margin-right: 20px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.banner_num_input{ |
|
|
|
width: 300px !important; |
|
|
|
|
