代码拉取完成,页面将自动刷新
同步操作将从 smallwei/avue-doc 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
export const getList = (data) => {
return request({
url:'/xxxx',
method: 'post',
data: data
})
}
export const del = (id) => request.delete('/xxxx', {
params: {
id
}
})
export const add = (data) => request({
url: '/xxxx',
method: 'post',
data: data
})
export const update = (data) => request({
url: '/xxxx',
method: 'put',
data: data
})
export default (safe)=>{
console.log(safe) //vue的this对象
return {
index: true,
align: 'center',
headerAlign: 'center',
border: true,
stripe: true,
column: [{
label: "名称(name)",
prop: "name",
search: true,
rules: [{
required: true,
message: "请输入名称(name)",
trigger: "blur"
}]
}, {
label: "值(value)",
prop: "value",
search: true,
rules: [{
required: true,
message: "请输入值(value)",
trigger: "blur"
}]
}, {
label: "参数(code)",
prop: "code",
search: true,
rules: [{
required: true,
message: "请输入参数(code)",
trigger: "blur"
}]
}, {
label: '备注',
prop: 'note'
}],
}
}
<template>
<avue-crud ref="crud"
:option="option"
:page.sync="page"
:table-loading="loading"
@on-load="getList"
@row-update="rowUpdate"
@row-save="rowSave"
@row-del="rowDel"
@refresh-change="refreshChange"
@search-reset="searchChange"
@search-change="searchChange"
v-model="form"
:data="data">
</avue-crud>
</template>
<script>
import { mapGetters } from "vuex";
import { getList, update, add, del } from '@/temp-api.js'
import option from '@/temp-option.js'
export default {
data () {
return {
page: {},
form: {},
params: {},
loading: false,
data: [],
option: option(this)
}
},
created () {
},
computed: {
...mapGetters(['userInfo'])
},
methods: {
getList () {
this.loading = true;
const data = Object.assign({
pageNum: this.page.currentPage,
pageSize: this.page.pageSize,
}, this.params)
this.data = [];
getList(data).then(res => {
const data = res.data.data
this.loading = false;
this.page.total = data.total;
const result = data.list;
this.data = result;
})
},
rowSave (row, done, loading) {
add(Object.assign({
createUser: this.userInfo.name
}, row)).then(() => {
this.$message.success('新增成功')
done();
this.getList();
}).catch(() => {
loading()
})
},
rowUpdate (row, index, done, loading) {
update(Object.assign({
updateUser: this.userInfo.name
}, row)).then(() => {
this.$message.success('修改成功')
done()
this.getList();
}).catch(() => {
loading()
})
},
rowDel (row) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
return del(row.id)
}).then(() => {
this.$message.success('删除成功')
this.getList();
})
},
searchChange (params, done) {
if (done) done();
this.params = params;
this.page.currentPage = 1;
this.getList();
this.$message.success('搜索成功')
},
refreshChange () {
this.getList();
this.$message.success('刷新成功')
}
}
}
</script>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。