|
|
@@ -1,117 +1,105 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
-
|
|
|
- <avue-crud
|
|
|
- ref="crud"
|
|
|
- :page="page"
|
|
|
- :data="dataList"
|
|
|
- :table-loading="dataListLoading"
|
|
|
- :option="tableOption"
|
|
|
- >
|
|
|
- <template slot-scope="scope" slot="menuLeft" >
|
|
|
- <el-button v-if="isAuth('prod:category:save')"
|
|
|
- type="primary"
|
|
|
- icon="el-icon-plus"
|
|
|
- size="small"
|
|
|
- @click="addOrUpdateHandle()">新增</el-button>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template slot-scope="scope" slot="status">
|
|
|
- <el-tag v-if="scope.row.status === 1" size="small" type="success">正常</el-tag>
|
|
|
- <el-tag v-else size="small" type="warning">下线</el-tag>
|
|
|
- </template>
|
|
|
-
|
|
|
- <template slot-scope="scope" slot="menu">
|
|
|
- <el-button v-if="isAuth('prod:category:update')"
|
|
|
- type="primary"
|
|
|
- size="small"
|
|
|
- @click="addOrUpdateHandle(scope.row.categoryId)">修改</el-button>
|
|
|
- <el-button v-if="isAuth('prod:category:delete')"
|
|
|
- type="danger"
|
|
|
- size="small"
|
|
|
- @click="deleteHandle(scope.row.categoryId)">删除</el-button>
|
|
|
- </template>
|
|
|
+ <avue-crud ref="crud" :page="page" :data="dataList" :table-loading="dataListLoading" :option="tableOption"
|
|
|
+ @on-load="getDataList" @row-update="updateItem" @row-del="deleteItem" @row-save="addItem">
|
|
|
</avue-crud>
|
|
|
- <!-- 弹窗, 新增 / 修改 -->
|
|
|
- <add-or-update v-if="addOrUpdateVisible"
|
|
|
- ref="addOrUpdate"
|
|
|
- @refreshDataList="getDataList"></add-or-update>
|
|
|
-</div>
|
|
|
</template>
|
|
|
|
|
|
-<script>
|
|
|
-import AddOrUpdate from './category-add-or-update'
|
|
|
+<script lang="ts">
|
|
|
+import Vue from 'vue'
|
|
|
import { tableOption } from '@/crud/prod/category'
|
|
|
+import { httpx, AxiosPromise, AxiosResponse } from "@/utils/httpx"
|
|
|
+import { ceil, clone } from 'lodash'
|
|
|
+import { ICategory, IPage } from '@/utils/vo'
|
|
|
|
|
|
-export default {
|
|
|
- data () {
|
|
|
+export default Vue.extend({
|
|
|
+ data() {
|
|
|
return {
|
|
|
dataForm: {},
|
|
|
- dataList: [],
|
|
|
+ dataList: [] as ICategory[],
|
|
|
dataListLoading: false,
|
|
|
addOrUpdateVisible: false,
|
|
|
resourcesUrl: process.env.VUE_APP_RESOURCES_URL,
|
|
|
- tableOption
|
|
|
+ tableOption,
|
|
|
+ page: {
|
|
|
+ total: 1,
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ } as IPage
|
|
|
}
|
|
|
},
|
|
|
- components: {
|
|
|
- AddOrUpdate
|
|
|
- },
|
|
|
- activated () {
|
|
|
- this.getDataList()
|
|
|
- },
|
|
|
methods: {
|
|
|
// 获取数据列表
|
|
|
- getDataList () {
|
|
|
+ getDataList(page?: IPage, params: Partial<ICategory> = { name: "" }, done?: Function) {
|
|
|
this.dataListLoading = true
|
|
|
- this.$http({
|
|
|
- url: this.$http.adornUrl('/prod/category/table'),
|
|
|
- method: 'get',
|
|
|
- params: this.$http.adornParams()
|
|
|
- }).then(({ data }) => {
|
|
|
- // this.dataList = treeDataTranslate(data, 'categoryId', 'parentId')
|
|
|
- this.dataList = data
|
|
|
+ if (page) { this.page = page }
|
|
|
+ return httpx.post('/goodsTypes/queryGoodsTypeList', {
|
|
|
+ name: params.name,
|
|
|
+ limit: page?.pageSize || this.page.pageSize,
|
|
|
+ page: page?.currentPage || this.page.currentPage,
|
|
|
+ }).then(({ data: { goodsTypeList: items, total } }: AxiosResponse<{ goodsTypeList: ICategory[], total: number }>) => {
|
|
|
+ this.dataList = items
|
|
|
+ this.page.total = total
|
|
|
+ if (done) { done() }
|
|
|
+ }).finally(() => {
|
|
|
this.dataListLoading = false
|
|
|
})
|
|
|
},
|
|
|
- // 新增 / 修改
|
|
|
- addOrUpdateHandle (id) {
|
|
|
- this.addOrUpdateVisible = true
|
|
|
- this.$nextTick(() => {
|
|
|
- this.$refs.addOrUpdate.init(id)
|
|
|
+
|
|
|
+ addItem({ name }: { name: string }, done?: Function, loading?: Function) {
|
|
|
+ // 新增项所在的页（应该是最后一页吧）
|
|
|
+ let newpage = clone(this.page)
|
|
|
+ newpage.total += 1
|
|
|
+ newpage.currentPage = ceil(newpage.total / newpage.pageSize)
|
|
|
+ return this.AddOrUpdateItem({ name }, done, loading, newpage)
|
|
|
+ },
|
|
|
+
|
|
|
+ updateItem(data: ICategory, index?: number, done?: Function, loading?: Function) {
|
|
|
+ // 修改项更新后所在的页（不应该放在最后吧）
|
|
|
+ // TODO: 告诉后端查询时按照id排序
|
|
|
+ let newpage = clone(this.page)
|
|
|
+ newpage.currentPage = ceil(newpage.total / newpage.pageSize)
|
|
|
+ return this.AddOrUpdateItem(data, done, loading, newpage)
|
|
|
+ },
|
|
|
+
|
|
|
+ AddOrUpdateItem({ id, name, adminId = 0 }: Partial<ICategory> & { name: string }, done?: Function, loading?: Function, newpage?: IPage) {
|
|
|
+ let request: AxiosPromise
|
|
|
+ if (id !== undefined) {
|
|
|
+ request = httpx.post("/goodsTypes/updateGoodsType", {
|
|
|
+ id, name, adminId
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ request = httpx.post("/goodsTypes/addGoodsType", {
|
|
|
+ name, adminId
|
|
|
+ })
|
|
|
+ }
|
|
|
+ return request.then(({ data }) => {
|
|
|
+ this.getDataList(newpage)
|
|
|
+ this.$message({
|
|
|
+ message: '操作成功',
|
|
|
+ type: 'success',
|
|
|
+ duration: 1000,
|
|
|
+ })
|
|
|
+ if (done) { done() }
|
|
|
+ if (loading) { loading() }
|
|
|
})
|
|
|
},
|
|
|
- // 删除
|
|
|
- deleteHandle (id) {
|
|
|
- this.$confirm(`确定进行删除操作?`, '提示', {
|
|
|
+
|
|
|
+ deleteItem({ id }: ICategory) {
|
|
|
+ return this.$confirm(`确定进行删除操作?`, '提示', {
|
|
|
confirmButtonText: '确定',
|
|
|
cancelButtonText: '取消',
|
|
|
type: 'warning'
|
|
|
}).then(() => {
|
|
|
- this.$http({
|
|
|
- url: this.$http.adornUrl(`/prod/category/${id}`),
|
|
|
- method: 'delete',
|
|
|
- data: this.$http.adornData()
|
|
|
- }).then(({ data }) => {
|
|
|
+ httpx.post("/goodsTypes/deleteGoodsType", { id }).then(({ data }) => {
|
|
|
+ this.getDataList()
|
|
|
this.$message({
|
|
|
message: '操作成功',
|
|
|
type: 'success',
|
|
|
- duration: 1500,
|
|
|
- onClose: () => {
|
|
|
- this.getDataList()
|
|
|
- }
|
|
|
+ duration: 1000
|
|
|
})
|
|
|
})
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-</script>
|
|
|
-<style lang="scss">
|
|
|
-.mod-category {
|
|
|
- img {
|
|
|
- height: 80px;
|
|
|
- width: 200px;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
|
|
+})
|
|
|
+</script>
|
furffico