91 lines
2.7 KiB
Vue
91 lines
2.7 KiB
Vue
<template>
|
|
<div class="main-wrapper">
|
|
<div class="main-container">
|
|
<ul class="fix">
|
|
<li v-for="item in typeData" class="fl">
|
|
<type-set-box :type="{ name: item.name, id: item.id }" :active="item.active" @active="activeSave" @edit="editSave" @remove="removeSave" />
|
|
</li>
|
|
</ul>
|
|
<br />
|
|
<br />
|
|
<Tooltip content="查看代码">
|
|
<Button icon="md-code" @click="showCode({ name: '字段管理', url: 'field.vue' })"></Button>
|
|
</Tooltip>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import myConfirm from "../components/myConfirm";
|
|
import TypeSetBox from "../components/type_set_box.vue";
|
|
|
|
export default {
|
|
components: { TypeSetBox },
|
|
data() {
|
|
return {
|
|
typeData: [
|
|
{
|
|
id: 1,
|
|
name: "矿泉水",
|
|
active: true, //是否启用
|
|
},
|
|
{
|
|
id: 2,
|
|
name: "矿泉水",
|
|
active: true,
|
|
},
|
|
{
|
|
id: 3,
|
|
name: "矿泉水",
|
|
active: true,
|
|
},
|
|
{
|
|
id: 4,
|
|
name: "矿泉水矿泉水矿泉水矿泉水矿泉水",
|
|
active: true,
|
|
},
|
|
{
|
|
id: 5,
|
|
name: "矿泉水",
|
|
active: false,
|
|
},
|
|
],
|
|
};
|
|
},
|
|
created() {},
|
|
methods: {
|
|
activeSave(id) {
|
|
console.log(id);
|
|
var typeFind = this.typeData.find(x => x.id == id);
|
|
myConfirm({
|
|
title: "修改状态",
|
|
msg: "确定修改该物品状态吗？",
|
|
info: (!typeFind.active ? "启用" : "停用") + "状态",
|
|
onOk: () => {
|
|
typeFind.active = !typeFind.active;
|
|
this.$Message.success("操作成功！");
|
|
},
|
|
onCancel: () => {
|
|
this.$Message.info("取消操作！");
|
|
},
|
|
});
|
|
},
|
|
editSave(id, name) {
|
|
this.$Message.success("修改成功！");
|
|
},
|
|
removeSave(id) {
|
|
myConfirm({
|
|
msg: "确定删除该物品吗？",
|
|
onOk: () => {
|
|
let index = this.typeData.findIndex(x => x.id == id);
|
|
this.typeData.splice(index, 1);
|
|
this.$Message.success("删除成功!");
|
|
},
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
</style> |