Commit 9634ca70 authored by Your Name's avatar Your Name

展板分类删除提示

parent 7b19e994
<template>
<div class="listPage H100">
<div class="search-container">
<el-form
:inline="true"
:model="form"
ref="form"
onsubmit="return false;"
>
<el-form-item >
<el-input
placeholder="请输入分类名称"
v-model="form.nameOrCode"
@keyup.enter.native="onSearch"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-date-picker
value-format="yyyy-MM-dd"
v-model="form.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button
type="primary"
@click="onSearch"
>查询</el-button
>
<el-button @click="Reset">重置</el-button
>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>可通过创建时间、展板分类名称模糊搜索快速筛选展板分类信息,可对展板分类信息进行修改、删除。可新增视频分类。</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="addPermis()">新建展板分类</el-button>
</div>
<div class="party-table">
<el-table
border
style="width: 100%; height: 100%"
height="100%"
ref="multipleTable"
:data="tableData"
>
<el-table-column
type="index"
width="120"
label="序号"
><template slot-scope="scope">
<span>{{ (page._index - 1) * 10 + scope.$index + 1 }}</span>
</template></el-table-column>
<el-table-column label="展板分类名称" prop="name"></el-table-column>
<el-table-column
label="版权方"
prop="copyrightOwnerNames"
></el-table-column>
<el-table-column label="创建时间" prop="createTime"></el-table-column>
<el-table-column label="备注" prop="remarks"></el-table-column>
<el-table-column label="操作" header-align="center" align="center">
<template slot-scope="scope" width="220">
<div class="table-btn-group">
<el-tooltip content="修改" placement="top">
<el-button circle @click="openEdit(scope.row)">
<i class="icon-table icon-edit"></i>
</el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button circle @click="handleDelete(scope.row)">
<i class="icon-table icon-del"></i>
</el-button>
</el-tooltip>
</div>
</template>
</el-table-column>
</el-table>
</div>
<party-pagination :page="page" @changePage="handleCurrentChange" />
</div>
<!--新增弹框-->
<el-dialog
:title="type?'新建展板分类':'编辑展板分类'"
custom-class="party-dialog"
width="468px"
:visible.sync="FormVisible"
:before-close="close"
>
<div class="dialog-content">
<el-form
:model="classForm"
ref="classForm"
label-width="80px"
label-position="top"
:rules="rule"
id="ruleo"
class="party-form"
>
<el-form-item label="展板分类名称" prop="name">
<el-input oninput="value = value.trim()" v-model="classForm.name"></el-input>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input type="textarea" v-model="classForm.remarks"></el-input>
</el-form-item>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button size="mini" v-show="type" type="primary" @click="permisSave"
>确定</el-button
>
<el-button size="mini" v-show="!type" type="primary" @click="permisEdit"
>确定</el-button
>
<el-button size="mini" @click="close">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
export default {
components: { partyPagination },
data() {
return {
type: true,
page: { _index: 1, _size: 10, total: 0 },
tableData: [],
FormVisible: false,
formLabelWidth: "100px",
form: {
dateRange:[]
},
classForm: {},
rule: {
name: [
{ required: true, message: "请输入展板分类名称", trigger: "blur" },
{ min: 1, max: 20, message: "请输入1到20个字" },
],
remarks: [
{ min: 1, max: 100, message: "请输入1到100个字" },
],
},
value: "",
name: "",
};
},
computed: {},
mounted() {
this.onSearch();
},
methods: {
onSearch() {
this.page._index = 1;
this.getTableData();
},
// 获得数据接口
getTableData() {
let vm = this;
let param = {
_index: this.page._index,
_size: this.page._size,
nameOrCode:this.form.nameOrCode,
startDate: this.form.dateRange.length ? this.form.dateRange[0] : "",
endDate: this.form.dateRange.length ? this.form.dateRange[1] : "",
};
vm.$https(
{
url: "exhibitionBoardCat/getPageList",
method: "post",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
let data = res.data.data;
vm.page.total = data.total;
vm.tableData = data.records;
})
.catch(function (err) {
console.log(err);
});
},
// 分页
handleCurrentChange(val) {
this.page._index = val;
this.getTableData();
},
// 重置
Reset() {
this.form = { dateRange:[]};
this.onSearch();
},
// 添加
addPermis() {
this.FormVisible = true;
this.type = true;
this.classForm = {}
},
// 新建展板分类确认保存
permisSave() {
let _this = this;
_this.$refs.classForm.validate((valid) => {
if (valid) {
const params ={
name: this.classForm.name,
remarks: this.classForm.remarks,
}
_this
.$https(
{
url: "exhibitionBoardCat/save",
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(params)
)
.then(
(res) => {
if (res.data.resultCode === '200') {
_this.$message.success("新建成功!");
//跳回用户列表
_this.onSearch();
_this.close()
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
_this.$message({
type: "error",
message: error,
});
}
);
}
});
},
// 编辑展板分类确认保存
permisEdit() {
let _this = this;
_this.$refs.classForm.validate((valid) => {
if (valid) {
_this
.$https(
{
url: "exhibitionBoardCat/update",
method: "put",
authType: this.backToken,
},
_this.$qs.stringify(_this.classForm)
)
.then(
(res) => {
if (res.data.resultCode === '200') {
_this.$message.success("修改成功!");
//跳回用户列表
_this.onSearch();
_this.close()
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
_this.$message({
type: "error",
message: error,
});
}
);
}
});
},
// 关闭
close() {
this.FormVisible = false;
this.classForm = {}
this.$refs["classForm"].clearValidate();
this.$refs["classForm"].resetFields();
},
// 编辑弹框
openEdit(row) {
this.type = false;
this.FormVisible = true;
this.classForm = JSON.parse(JSON.stringify(row));
},
// 删除
handleDelete(row) {
let _this = this;
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
_this
.$https({
method: "delete",
url: "exhibitionBoardCat/delete/" + row.id,
authType: this.backToken,
})
.then(
(res) => {
this.$message({ type: "success", message: "删除成功!" });
_this.onSearch();
},
(error) => {
this.$message({
type: "error",
message: "删除失败!" + error.response.data,
});
}
);
})
.catch(() => {});
},
},
};
</script>
<style lang="less">
@import "../../../../style/table.less";
</style>
<template>
<div class="listPage H100">
<div class="search-container">
<el-form
:inline="true"
:model="form"
ref="form"
onsubmit="return false;"
>
<el-form-item >
<el-input
placeholder="请输入分类名称"
v-model="form.nameOrCode"
@keyup.enter.native="onSearch"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-date-picker
value-format="yyyy-MM-dd"
v-model="form.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
></el-date-picker>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button
type="primary"
@click="onSearch"
>查询</el-button
>
<el-button @click="Reset">重置</el-button
>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>可通过创建时间、展板分类名称模糊搜索快速筛选展板分类信息,可对展板分类信息进行修改、删除。可新增视频分类。</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="addPermis()">新建展板分类</el-button>
</div>
<div class="party-table">
<el-table
border
style="width: 100%; height: 100%"
height="100%"
ref="multipleTable"
:data="tableData"
>
<el-table-column
type="index"
width="120"
label="序号"
><template slot-scope="scope">
<span>{{ (page._index - 1) * 10 + scope.$index + 1 }}</span>
</template></el-table-column>
<el-table-column label="展板分类名称" prop="name"></el-table-column>
<el-table-column
label="版权方"
prop="copyrightOwnerNames"
></el-table-column>
<el-table-column label="创建时间" prop="createTime"></el-table-column>
<el-table-column label="备注" prop="remarks"></el-table-column>
<el-table-column label="操作" header-align="center" align="center">
<template slot-scope="scope" width="220">
<div class="table-btn-group">
<el-tooltip content="修改" placement="top">
<el-button circle @click="openEdit(scope.row)">
<i class="icon-table icon-edit"></i>
</el-button>
</el-tooltip>
<el-tooltip content="删除" placement="top">
<el-button circle @click="handleDelete(scope.row)">
<i class="icon-table icon-del"></i>
</el-button>
</el-tooltip>
</div>
</template>
</el-table-column>
</el-table>
</div>
<party-pagination :page="page" @changePage="handleCurrentChange" />
</div>
<!--新增弹框-->
<el-dialog
:title="type?'新建展板分类':'编辑展板分类'"
custom-class="party-dialog"
width="468px"
:visible.sync="FormVisible"
:before-close="close"
>
<div class="dialog-content">
<el-form
:model="classForm"
ref="classForm"
label-width="80px"
label-position="top"
:rules="rule"
id="ruleo"
class="party-form"
>
<el-form-item label="展板分类名称" prop="name">
<el-input oninput="value = value.trim()" v-model="classForm.name"></el-input>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input type="textarea" v-model="classForm.remarks"></el-input>
</el-form-item>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button size="mini" v-show="type" type="primary" @click="permisSave"
>确定</el-button
>
<el-button size="mini" v-show="!type" type="primary" @click="permisEdit"
>确定</el-button
>
<el-button size="mini" @click="close">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
export default {
components: { partyPagination },
data() {
return {
type: true,
page: { _index: 1, _size: 10, total: 0 },
tableData: [],
FormVisible: false,
formLabelWidth: "100px",
form: {
dateRange:[]
},
classForm: {},
rule: {
name: [
{ required: true, message: "请输入展板分类名称", trigger: "blur" },
{ min: 1, max: 20, message: "请输入1到20个字" },
],
remarks: [
{ min: 1, max: 100, message: "请输入1到100个字" },
],
},
value: "",
name: "",
};
},
computed: {},
mounted() {
this.onSearch();
},
methods: {
onSearch() {
this.page._index = 1;
this.getTableData();
},
// 获得数据接口
getTableData() {
let vm = this;
let param = {
_index: this.page._index,
_size: this.page._size,
nameOrCode:this.form.nameOrCode,
startDate: this.form.dateRange.length ? this.form.dateRange[0] : "",
endDate: this.form.dateRange.length ? this.form.dateRange[1] : "",
};
vm.$https(
{
url: "exhibitionBoardCat/getPageList",
method: "post",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
let data = res.data.data;
vm.page.total = data.total;
vm.tableData = data.records;
})
.catch(function (err) {
console.log(err);
});
},
// 分页
handleCurrentChange(val) {
this.page._index = val;
this.getTableData();
},
// 重置
Reset() {
this.form = { dateRange:[]};
this.onSearch();
},
// 添加
addPermis() {
this.FormVisible = true;
this.type = true;
this.classForm = {}
},
// 新建展板分类确认保存
permisSave() {
let _this = this;
_this.$refs.classForm.validate((valid) => {
if (valid) {
const params ={
name: this.classForm.name,
remarks: this.classForm.remarks,
}
_this
.$https(
{
url: "exhibitionBoardCat/save",
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(params)
)
.then(
(res) => {
if (res.data.resultCode === '200') {
_this.$message.success("新建成功!");
//跳回用户列表
_this.onSearch();
_this.close()
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
_this.$message({
type: "error",
message: error,
});
}
);
}
});
},
// 编辑展板分类确认保存
permisEdit() {
let _this = this;
_this.$refs.classForm.validate((valid) => {
if (valid) {
_this
.$https(
{
url: "exhibitionBoardCat/update",
method: "put",
authType: this.backToken,
},
_this.$qs.stringify(_this.classForm)
)
.then(
(res) => {
if (res.data.resultCode === '200') {
_this.$message.success("修改成功!");
//跳回用户列表
_this.onSearch();
_this.close()
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
_this.$message({
type: "error",
message: error,
});
}
);
}
});
},
// 关闭
close() {
this.FormVisible = false;
this.classForm = {}
this.$refs["classForm"].clearValidate();
this.$refs["classForm"].resetFields();
},
// 编辑弹框
openEdit(row) {
this.type = false;
this.FormVisible = true;
this.classForm = JSON.parse(JSON.stringify(row));
},
// 删除
handleDelete(row) {
let _this = this;
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
_this
.$https({
method: "delete",
url: "exhibitionBoardCat/delete/" + row.id,
authType: this.backToken,
})
.then(
(res) => {
if (res.data.resultCode ==="500"){
this.$message({
type: "error",
message: res.data.message,
});
}else {
this.$message({ type: "success", message: "删除成功!" });
_this.onSearch();
}
},
(error) => {
this.$message({
type: "error",
message: "删除失败!" + error.response.data,
});
}
);
})
.catch(() => {});
},
},
};
</script>
<style lang="less">
@import "../../../../style/table.less";
</style>
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