Lihong@123456
5 years ago
1 changed files with 260 additions and 0 deletions
@ -0,0 +1,260 @@ |
|||||
|
<template> |
||||
|
<div class="dashboard-container"> |
||||
|
<!-- 类型管理页 --> |
||||
|
<!-- 头部搜索添加 --> |
||||
|
|
||||
|
<div class="filter-container"> |
||||
|
<el-input |
||||
|
v-model="searchCategory.name" |
||||
|
placeholder="名字" |
||||
|
class="filter-item" |
||||
|
style="width: 190px;margin-left:10px" |
||||
|
clearable |
||||
|
/> |
||||
|
<el-select |
||||
|
v-model="searchCategory.type" |
||||
|
placeholder="类型" |
||||
|
clearable |
||||
|
class="filter-item" |
||||
|
style="width: 190px;margin-left:10px" |
||||
|
value="1" |
||||
|
> |
||||
|
<el-option label="项目类别" value="0" /> |
||||
|
<el-option label="产业类别 " value="1" /> |
||||
|
</el-select> |
||||
|
<el-button |
||||
|
class="filter-item" |
||||
|
style="margin-left: 10px;" |
||||
|
type="primary" |
||||
|
icon="el-icon-search" |
||||
|
@click="Search" |
||||
|
>搜索</el-button> |
||||
|
<el-button |
||||
|
class="filter-item" |
||||
|
style="margin-left: 10px;" |
||||
|
type="primary" |
||||
|
icon="el-icon-edit" |
||||
|
@click="AddCategory" |
||||
|
>添加</el-button> |
||||
|
</div> |
||||
|
<!-- 类型列表 --> |
||||
|
<el-table |
||||
|
v-loading="listLoading" |
||||
|
:data="typemanage" |
||||
|
border |
||||
|
fit |
||||
|
highlight-current-row |
||||
|
style="width: 100%;" |
||||
|
> |
||||
|
<el-table-column label="名字" prop="id" align="center" width="500"> |
||||
|
<template slot-scope="{row}"> |
||||
|
<span>{{ row.name }}</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="产业类型" prop="title" align="center" width="500"> |
||||
|
<template slot-scope="{row}"> |
||||
|
<span>{{ row.type }}</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="操作" align="center" width="230" class-name="small-padding fixed-width"> |
||||
|
<template slot-scope="{row}"> |
||||
|
<el-button type="primary" size="mini" @click="handleUpdate(row)">修改</el-button> |
||||
|
<el-button size="mini" type="danger" @click="handleDelete(row.id)">删除</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<!-- 修改界面 --> |
||||
|
<el-dialog title="修改" :visible.sync="dialogFormVisible1"> |
||||
|
<el-form ref="dataForm" :model="temp" label-position="left" label-width="70px" style="width: 400px; margin-left:50px;"> |
||||
|
|
||||
|
<el-form-item label="名字" prop="name" style="width: 180%"> |
||||
|
<el-input v-model="temp.name" /> |
||||
|
</el-form-item> |
||||
|
|
||||
|
<el-form-item label="类型"> |
||||
|
<el-select |
||||
|
v-model="temp.type" |
||||
|
placeholder="请选类型" |
||||
|
style="width: 400px;" |
||||
|
> |
||||
|
<el-option label="项目类别" value="0" /> |
||||
|
<el-option label="产业类别 " value="1" /> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
|
||||
|
</el-form> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="dialogFormVisible1 = false"> |
||||
|
取消 |
||||
|
</el-button> |
||||
|
<el-button type="primary" @click="Commitupdate(temp.id)"> |
||||
|
提交 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
<!-- 添加表格 --> |
||||
|
<el-dialog title="添加表格" :visible.sync="dialogFormVisible"> |
||||
|
<el-form |
||||
|
ref="dataForm" |
||||
|
:model="addCategory" |
||||
|
label-position="left" |
||||
|
label-width="70px" |
||||
|
style="width: 400px; margin-left:50px;" |
||||
|
> |
||||
|
<el-form-item label="名字" prop="name" style="width: 100%"> |
||||
|
<el-input v-model="addCategory.name" clearable /> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="类型"> |
||||
|
<el-select |
||||
|
v-model="addCategory.type" |
||||
|
placeholder="请选类型" |
||||
|
style="width: 400px;" |
||||
|
> |
||||
|
<el-option label="项目类别" value="0" /> |
||||
|
<el-option label="产业类别 " value="1" /> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<div slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="dialogFormVisible = false">取 消</el-button> |
||||
|
<el-button type="primary" @click="CommitAdd">提 交</el-button> |
||||
|
</div> |
||||
|
</el-dialog> |
||||
|
<pagination v-show="total>0" :total="total" :page.sync="data.pageNum" :limit.sync="data.pageSize" @pagination="getList" /> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from 'vuex' |
||||
|
import * as api from '@/api/typemanage' |
||||
|
import Pagination from '@/components/Pagination' // secondary package based on el-pagination |
||||
|
export default { |
||||
|
name: 'Typemanage', |
||||
|
components: { Pagination }, |
||||
|
data() { |
||||
|
return { |
||||
|
dialogFormVisible: false, |
||||
|
dialogFormVisible1: false, |
||||
|
form: { |
||||
|
name: '', |
||||
|
region: '' |
||||
|
}, |
||||
|
total: 0, |
||||
|
typemanage: [], |
||||
|
data: { |
||||
|
name: '', |
||||
|
pageNum: 1, |
||||
|
pageSize: 20, |
||||
|
type: '' |
||||
|
}, |
||||
|
temp: {}, |
||||
|
addCategory: { |
||||
|
name: '', |
||||
|
type: '' |
||||
|
}, |
||||
|
updateCategory: { |
||||
|
name: '', |
||||
|
type: '' |
||||
|
}, |
||||
|
searchCategory: { |
||||
|
name: '', |
||||
|
type: '' |
||||
|
}, |
||||
|
formLabelWidth: '120px', |
||||
|
policyStatus: '类型', |
||||
|
status: { 类型一: 0, 类型二: 1 } |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapGetters(['name']) |
||||
|
}, |
||||
|
created() { |
||||
|
this.getList() |
||||
|
}, |
||||
|
methods: { |
||||
|
async getList() { |
||||
|
const that = this |
||||
|
that.listLoading = false |
||||
|
await api.TypeManage(that.data).then((res) => { |
||||
|
that.typemanage = res.list |
||||
|
that.total = res.total - 0 |
||||
|
|
||||
|
setTimeout(() => { |
||||
|
that.listLoading = false |
||||
|
}, 1000) |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
async Search() { |
||||
|
const that = this |
||||
|
await api.CategoryDetail(that.searchCategory).then((res) => { |
||||
|
that.typemanage = res.list |
||||
|
that.total = res.total - 0 |
||||
|
that.listLoading = false |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
handleUpdate(row) { |
||||
|
const that = this |
||||
|
that.temp = Object.assign({}, row) |
||||
|
that.dialogFormVisible1 = true |
||||
|
}, |
||||
|
|
||||
|
async handleDelete(id) { |
||||
|
const that = this |
||||
|
await api.CategoryDelete(id).then((res) => { |
||||
|
that.getList() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
AddCategory() { |
||||
|
const that = this |
||||
|
for (const key in that.addCategory) { |
||||
|
that.addCategory[key] = '' |
||||
|
} |
||||
|
that.dialogFormVisible = true |
||||
|
}, |
||||
|
|
||||
|
async CommitAdd() { |
||||
|
const that = this |
||||
|
for (const key in that.addCategory) { |
||||
|
if (that.addCategory[key] === '') { |
||||
|
alert(key + '不能为空') |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
await api.addCategory(that.addCategory).then((res) => { |
||||
|
that.dialogFormVisible = false |
||||
|
that.getList() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
async Commitupdate() { |
||||
|
const that = this |
||||
|
for (const key in that.temp) { |
||||
|
if (that.temp[key] === '') { |
||||
|
alert(key + '不能为空') |
||||
|
return |
||||
|
} |
||||
|
} |
||||
|
await api.CategoryUpdate(that.temp).then((res) => { |
||||
|
that.dialogFormVisible1 = false |
||||
|
that.getList() |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.dashboard { |
||||
|
&-container { |
||||
|
margin: 30px; |
||||
|
} |
||||
|
&-text { |
||||
|
font-size: 30px; |
||||
|
line-height: 46px; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue