第一次提交
This commit is contained in:
wangxulei
228
web/src/views/404.vue
Normal file
228
web/src/views/404.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div class="wscn-http404-container">
|
||||
<div class="wscn-http404">
|
||||
<div class="pic-404">
|
||||
<img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404">
|
||||
<img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404">
|
||||
<img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404">
|
||||
<img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
|
||||
</div>
|
||||
<div class="bullshit">
|
||||
<div class="bullshit__oops">OOPS!</div>
|
||||
<div class="bullshit__info">All rights reserved
|
||||
<a style="color:#20a0ff" href="https://wallstreetcn.com" target="_blank">wallstreetcn</a>
|
||||
</div>
|
||||
<div class="bullshit__headline">{{ message }}</div>
|
||||
<div class="bullshit__info">Please check that the URL you entered is correct, or click the button below to return to the homepage.</div>
|
||||
<a href="" class="bullshit__return-home">Back to home</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'Page404',
|
||||
computed: {
|
||||
message() {
|
||||
return 'The webmaster said that you can not enter this page...'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.wscn-http404-container{
|
||||
transform: translate(-50%,-50%);
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 50%;
|
||||
}
|
||||
.wscn-http404 {
|
||||
position: relative;
|
||||
width: 1200px;
|
||||
padding: 0 50px;
|
||||
overflow: hidden;
|
||||
.pic-404 {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 600px;
|
||||
overflow: hidden;
|
||||
&__parent {
|
||||
width: 100%;
|
||||
}
|
||||
&__child {
|
||||
position: absolute;
|
||||
&.left {
|
||||
width: 80px;
|
||||
top: 17px;
|
||||
left: 220px;
|
||||
opacity: 0;
|
||||
animation-name: cloudLeft;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
&.mid {
|
||||
width: 46px;
|
||||
top: 10px;
|
||||
left: 420px;
|
||||
opacity: 0;
|
||||
animation-name: cloudMid;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1.2s;
|
||||
}
|
||||
&.right {
|
||||
width: 62px;
|
||||
top: 100px;
|
||||
left: 500px;
|
||||
opacity: 0;
|
||||
animation-name: cloudRight;
|
||||
animation-duration: 2s;
|
||||
animation-timing-function: linear;
|
||||
animation-fill-mode: forwards;
|
||||
animation-delay: 1s;
|
||||
}
|
||||
@keyframes cloudLeft {
|
||||
0% {
|
||||
top: 17px;
|
||||
left: 220px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 33px;
|
||||
left: 188px;
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
top: 81px;
|
||||
left: 92px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 97px;
|
||||
left: 60px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes cloudMid {
|
||||
0% {
|
||||
top: 10px;
|
||||
left: 420px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 40px;
|
||||
left: 360px;
|
||||
opacity: 1;
|
||||
}
|
||||
70% {
|
||||
top: 130px;
|
||||
left: 180px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 160px;
|
||||
left: 120px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes cloudRight {
|
||||
0% {
|
||||
top: 100px;
|
||||
left: 500px;
|
||||
opacity: 0;
|
||||
}
|
||||
20% {
|
||||
top: 120px;
|
||||
left: 460px;
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
top: 180px;
|
||||
left: 340px;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
top: 200px;
|
||||
left: 300px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bullshit {
|
||||
position: relative;
|
||||
float: left;
|
||||
width: 300px;
|
||||
padding: 30px 0;
|
||||
overflow: hidden;
|
||||
&__oops {
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
line-height: 40px;
|
||||
color: #1482f0;
|
||||
opacity: 0;
|
||||
margin-bottom: 20px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__headline {
|
||||
font-size: 20px;
|
||||
line-height: 24px;
|
||||
color: #222;
|
||||
font-weight: bold;
|
||||
opacity: 0;
|
||||
margin-bottom: 10px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.1s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__info {
|
||||
font-size: 13px;
|
||||
line-height: 21px;
|
||||
color: grey;
|
||||
opacity: 0;
|
||||
margin-bottom: 30px;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.2s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
&__return-home {
|
||||
display: block;
|
||||
float: left;
|
||||
width: 110px;
|
||||
height: 36px;
|
||||
background: #1482f0;
|
||||
border-radius: 100px;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
opacity: 0;
|
||||
font-size: 14px;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
animation-name: slideUp;
|
||||
animation-duration: 0.5s;
|
||||
animation-delay: 0.3s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
@keyframes slideUp {
|
||||
0% {
|
||||
transform: translateY(60px);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
270
web/src/views/article/category.vue
Normal file
270
web/src/views/article/category.vue
Normal file
@@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="分类名称"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
@change="changeStatus($event, scope)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="分类名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入分类名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户组状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import { getCategory as getList } from '@/api/article'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
title: '',
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
menus: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
},
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
changeStatus(value, scope) {
|
||||
setTimeout(() => {
|
||||
this.list[scope.$index].status = value
|
||||
this.$message({
|
||||
message: '更新成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
454
web/src/views/article/index.vue
Normal file
454
web/src/views/article/index.vue
Normal file
@@ -0,0 +1,454 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-date-picker
|
||||
v-model="listQuery.created_at"
|
||||
size="small"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="margin-bottom: 10px;vertical-align: middle;"
|
||||
:editable="false"
|
||||
/>
|
||||
<el-select
|
||||
v-model="listQuery.category"
|
||||
size="small"
|
||||
placeholder="选择分类"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 150px;margin-left: 10px;"
|
||||
>
|
||||
<el-option label="新闻" :value="'新闻'" />
|
||||
<el-option label="公告" :value="'公告'" />
|
||||
<el-option label="动态" :value="'动态'" />
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="listQuery.status"
|
||||
size="small"
|
||||
placeholder="选择状态"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 150px;margin-left: 10px;"
|
||||
>
|
||||
<el-option label="正常" :value="1" />
|
||||
<el-option label="禁用" :value="0" />
|
||||
</el-select>
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
width="150"
|
||||
label="文章封面"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<img :src="scope.row.icon" height="50">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="文章名称"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="文章分类"
|
||||
width="120"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.category }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="阅读量"
|
||||
width="120"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.read }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="评论量"
|
||||
width="120"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.comment }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="发布时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.created_at }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="作者"
|
||||
width="120"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.author }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
@change="changeStatus($event, scope)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
width="960px"
|
||||
destroy-on-close
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="文章封面">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="uploadUrl"
|
||||
:show-file-list="false"
|
||||
:on-success="handleAvatarSuccess"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
>
|
||||
<img v-if="temp.icon" :src="temp.icon" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon" />
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="文章名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入文章名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="文章分类">
|
||||
<el-radio-group v-model="temp.category">
|
||||
<el-radio label="新闻" />
|
||||
<el-radio label="公告" />
|
||||
<el-radio label="动态" />
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="文章正文">
|
||||
<tinymce v-model="temp.content" :height="300" :width="600" />
|
||||
</el-form-item>
|
||||
<el-form-item label="阅读量">
|
||||
<el-input-number v-model="temp.read" :precision="0" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="评论量">
|
||||
<el-input-number v-model="temp.comment" :precision="0" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="作者">
|
||||
<el-input v-model="temp.author" placeholder="请输入作者" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户组状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import Tinymce from '@/components/Tinymce'
|
||||
import { getList } from '@/api/article'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
icon: '',
|
||||
title: '',
|
||||
category: [],
|
||||
content: '',
|
||||
read: '',
|
||||
comment: '',
|
||||
created_at: '',
|
||||
author: '',
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination,
|
||||
Tinymce
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
menus: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
created_at: undefined,
|
||||
category: undefined,
|
||||
status: undefined,
|
||||
keyword: undefined
|
||||
},
|
||||
uploadUrl: '',
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleAvatarSuccess(res, file) {
|
||||
this.temp.site_logo = URL.createObjectURL(file.raw)
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
if (!this.uploadUrl) {
|
||||
this.$message.error('请设置正确的图片上传地址!')
|
||||
return false
|
||||
}
|
||||
const isJPG = file.type === 'image/*'
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
if (!isJPG) {
|
||||
this.$message.error('只能上传图片格式!')
|
||||
}
|
||||
if (!isLt2M) {
|
||||
this.$message.error('上传图片大小不能超过 2MB!')
|
||||
}
|
||||
return isJPG && isLt2M
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
created_at: undefined,
|
||||
category: undefined,
|
||||
status: undefined,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
changeStatus(value, scope) {
|
||||
setTimeout(() => {
|
||||
this.list[scope.$index].status = value
|
||||
this.$message({
|
||||
message: '更新成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-upload {
|
||||
border: 1px dashed #d9d9d9 !important;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.el-icon-plus.avatar-uploader-icon {
|
||||
border: 1px dashed #d9d9d9 !important;
|
||||
border-radius: 6px;
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
line-height: 128px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.avatar-uploader {
|
||||
height: 128px;
|
||||
|
||||
img {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
352
web/src/views/banner/index.vue
Normal file
352
web/src/views/banner/index.vue
Normal file
@@ -0,0 +1,352 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
width="150"
|
||||
label="轮播图"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<img :src="scope.row.icon" height="50">
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="名称"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="链接地址"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.link }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
@change="changeStatus($event, scope)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="轮播图">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="uploadUrl"
|
||||
:show-file-list="false"
|
||||
:on-success="handleAvatarSuccess"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
>
|
||||
<img v-if="temp.icon" :src="temp.icon" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon" />
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址">
|
||||
<el-input v-model="temp.link" placeholder="请输入链接地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import { getList } from '@/api/banner'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
title: '',
|
||||
icon: '',
|
||||
link: '',
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
menus: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
},
|
||||
uploadUrl: '',
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleAvatarSuccess(res, file) {
|
||||
this.temp.site_logo = URL.createObjectURL(file.raw)
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
if (!this.uploadUrl) {
|
||||
this.$message.error('请设置正确的图片上传地址!')
|
||||
return false
|
||||
}
|
||||
const isJPG = file.type === 'image/*'
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
if (!isJPG) {
|
||||
this.$message.error('只能上传图片格式!')
|
||||
}
|
||||
if (!isLt2M) {
|
||||
this.$message.error('上传图片大小不能超过 2MB!')
|
||||
}
|
||||
return isJPG && isLt2M
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
changeStatus(value, scope) {
|
||||
setTimeout(() => {
|
||||
this.list[scope.$index].status = value
|
||||
this.$message({
|
||||
message: '更新成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-upload {
|
||||
border: 1px dashed #d9d9d9 !important;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.el-icon-plus.avatar-uploader-icon {
|
||||
border: 1px dashed #d9d9d9 !important;
|
||||
border-radius: 6px;
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
line-height: 128px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.avatar-uploader {
|
||||
height: 128px;
|
||||
|
||||
img {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
132
web/src/views/business/card/addCard.vue
Normal file
132
web/src/views/business/card/addCard.vue
Normal file
@@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="会员卡名" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="会员卡名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡编号" prop="cardNo" class="is-required">
|
||||
<el-input v-model="temp.cardNo" placeholder="卡编号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="预设开卡金" prop="cardAmount" class="is-required">
|
||||
<el-input v-model="temp.cardAmount" placeholder="预设开卡金" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="预设赠送金" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="预设赠送金" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="最低开卡金额" prop="buildCardAmount" class="is-required">
|
||||
<el-input v-model="temp.buildCardAmount" placeholder="最低开卡金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡折扣" prop="cardDiscount" class="is-required">
|
||||
<el-input v-model="temp.cardDiscount" placeholder="卡折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡提成" prop="cardPushPercent" class="is-required">
|
||||
<el-input v-model="temp.cardPushPercent" placeholder="卡提成" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="工本费用" prop="todos" class="is-required">
|
||||
<el-input v-model="temp.todos" placeholder="工本费用" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="cardStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.cardStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addCard} from "@/api/business/card/card";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import DeptSelect from "@/views/common/system/deptSelect";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: {DeptSelect},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
cardName:'',
|
||||
cardNo:'',
|
||||
cardAmount:'',
|
||||
giveAmount:'',
|
||||
buildCardAmount:'',
|
||||
cardDiscount:'',
|
||||
cardPushPercent:'',
|
||||
todos:'',
|
||||
cardStatus:0,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addCard(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
getDept(e){
|
||||
this.temp.shopName = e.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
333
web/src/views/business/card/cardList.vue
Normal file
333
web/src/views/business/card/cardList.vue
Normal file
@@ -0,0 +1,333 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员卡名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡编号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="预设开卡金"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="预设赠送金"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.giveAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="最低开卡金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.buildCardAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡折扣"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardDiscount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡提成"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardPushPercent }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="工本费用"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.todos }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1下架"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1删除"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.deleted }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCardPage,deleteCard} from "@/api/business/card/card";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/card/addCard";
|
||||
import editForm from "@/views/business/card/editCard";
|
||||
|
||||
export default {
|
||||
name: 'card',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getCardPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteCard(scope.row.cardId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
128
web/src/views/business/card/editCard.vue
Normal file
128
web/src/views/business/card/editCard.vue
Normal file
@@ -0,0 +1,128 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="会员卡名" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="会员卡名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡编号" prop="cardNo" class="is-required">
|
||||
<el-input v-model="temp.cardNo" placeholder="卡编号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="预设开卡金" prop="cardAmount" class="is-required">
|
||||
<el-input v-model="temp.cardAmount" placeholder="预设开卡金" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="预设赠送金" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="预设赠送金" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="最低开卡金额" prop="buildCardAmount" class="is-required">
|
||||
<el-input v-model="temp.buildCardAmount" placeholder="最低开卡金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡折扣" prop="cardDiscount" class="is-required">
|
||||
<el-input v-model="temp.cardDiscount" placeholder="卡折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡提成" prop="cardPushPercent" class="is-required">
|
||||
<el-input v-model="temp.cardPushPercent" placeholder="卡提成" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="工本费用" prop="todos" class="is-required">
|
||||
<el-input v-model="temp.todos" placeholder="工本费用" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="cardStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.cardStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editCard } from "@/api/business/card/card";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
cardId:'',
|
||||
cardName:'',
|
||||
cardNo:'',
|
||||
cardAmount:'',
|
||||
giveAmount:'',
|
||||
buildCardAmount:'',
|
||||
cardDiscount:'',
|
||||
cardPushPercent:'',
|
||||
todos:'',
|
||||
cardStatus:0,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editCard(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
1000
web/src/views/business/cashier/cashierDesk.vue
Normal file
1000
web/src/views/business/cashier/cashierDesk.vue
Normal file
File diff suppressed because it is too large
Load Diff
53
web/src/views/business/cashier/chooseSell.vue
Normal file
53
web/src/views/business/cashier/chooseSell.vue
Normal file
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
append-to-body
|
||||
top="2vh"
|
||||
width="60%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:80vh">
|
||||
<pending-sell-list ref="pendingSellListRef" @ok="getCheckedsell"/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import pendingSellList from "@/views/business/cashier/pendingSellList";
|
||||
export default {
|
||||
name: "chooseSell",
|
||||
components: {pendingSellList},
|
||||
props: {
|
||||
sellList: Array,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
temp:{}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
//并获取最新值
|
||||
this.$refs.pendingSellListRef.fetchData()
|
||||
},
|
||||
getCheckedsell(sell){
|
||||
this.$emit('ok', sell)
|
||||
this.handleCancel()
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
},
|
||||
submit(){
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
56
web/src/views/business/cashier/chooseServer.vue
Normal file
56
web/src/views/business/cashier/chooseServer.vue
Normal file
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
append-to-body
|
||||
top="2vh"
|
||||
width="60%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:80vh">
|
||||
<server-list ref="serverListRef" @ok="getCheckedsell"/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import serverList from "@/views/business/cashier/serverList";
|
||||
export default {
|
||||
name: "chooseServer",
|
||||
components: {serverList},
|
||||
props: {
|
||||
sellList: Array,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
temp:{},
|
||||
scope:{}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
//并获取最新值
|
||||
this.$nextTick(() => {
|
||||
this.$refs.serverListRef.fetchData()
|
||||
})
|
||||
},
|
||||
getCheckedsell(serverList){
|
||||
this.$emit('ok', serverList)
|
||||
this.handleCancel()
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
},
|
||||
submit(){
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
161
web/src/views/business/cashier/payType.vue
Normal file
161
web/src/views/business/cashier/payType.vue
Normal file
@@ -0,0 +1,161 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- :close-on-click-modal="false"-->
|
||||
|
||||
<el-dialog
|
||||
append-to-body
|
||||
top="15vh"
|
||||
width="35%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:40vh;text-align: center;">
|
||||
|
||||
<div style="text-align: left;">
|
||||
<h2> 应付金额：<span class="price-text">{{totalPrice}}</span></h2>
|
||||
<h2> 实付金额：<span class="price-text">{{realTotalPrice}}</span></h2>
|
||||
<h2> 仍需支付：<span class="price-text">{{app.Subtr(totalPrice,realTotalPrice)}}</span></h2>
|
||||
</div>
|
||||
<div style="width:100%;"
|
||||
v-for="(item,index) in payTypeList"
|
||||
:key="item.payType">
|
||||
|
||||
<el-input
|
||||
style="text-align: center;width: 70%;margin-bottom: 10px;"
|
||||
placeholder="请输入金额"
|
||||
@click.native="inputClick(item,payTypeList,index)"
|
||||
v-model="item.amount">
|
||||
|
||||
<span slot="prefix" style="line-height: 40px;text-align: right;width: 80px;display: inline-block;">{{item.payName}} </span>
|
||||
|
||||
<span slot="suffix" style="line-height: 40px;text-align: right;width: 200px;display: inline-block;" v-if="app.isNotEmpty(memberCard.memberCardId) && item.payType == '1'">
|
||||
会员卡总余额：<span class="price-text">{{app.getFloatStr(memberCardAmount)}}</span>
|
||||
</span>
|
||||
</el-input>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<slot name="button2"></slot>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {accAdd,error,isNotEmpty} from "@/utils";
|
||||
|
||||
export default {
|
||||
name: "payType",
|
||||
props: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
temp:{},
|
||||
menu: '',
|
||||
totalPrice:'',
|
||||
memberCard:{amount:0,giveAmount:0},
|
||||
payTypeList:[
|
||||
{payType:"1",payName:"会员卡支付",amount:""},
|
||||
{payType:"2",payName:"扫码支付",amount:""},
|
||||
{payType:"3",payName:"现金支付",amount:""},
|
||||
{payType:"888",payName:"优惠",amount:""},
|
||||
]
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
realTotalPrice(){
|
||||
let realTotalPrice = 0;
|
||||
for(let pay of this.payTypeList){
|
||||
if(pay.amount){
|
||||
realTotalPrice = accAdd(pay.amount,realTotalPrice);
|
||||
}
|
||||
}
|
||||
return realTotalPrice;
|
||||
},
|
||||
memberCardAmount(){
|
||||
let memberCardAmount = 0;
|
||||
if(isNotEmpty(this.memberCard.memberCardId)){
|
||||
memberCardAmount = accAdd(this.memberCard.amount,this.memberCard.giveAmount);
|
||||
}
|
||||
return memberCardAmount;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(totalPrice,memberCard,menu) {
|
||||
this.menu = menu
|
||||
// 打印应付金额和会员卡信息
|
||||
console.log('应付金额' + totalPrice)
|
||||
console.log('当前会员卡' + memberCard)
|
||||
// 设置应付金额
|
||||
this.totalPrice = totalPrice
|
||||
// 根据会员卡是否存在进行不同操作
|
||||
if(isNotEmpty(memberCard.memberCardId)){
|
||||
// 存在会员卡，设置会员卡信息
|
||||
this.memberCard = memberCard
|
||||
if(menu == '2' || menu == '3'){
|
||||
this.payTypeList.splice(0, 1)
|
||||
}
|
||||
} else {
|
||||
// 不存在会员卡，调整支付类型列表
|
||||
this.payTypeList.splice(0, 1)
|
||||
}
|
||||
// 显示对话框
|
||||
this.dialogVisible = true
|
||||
},
|
||||
//首次输入金额时自动填充
|
||||
inputClick(pay, payList,index) {
|
||||
let flag = true;
|
||||
for (let i = 0; i < payList.length; i++) {
|
||||
if (isNotEmpty(payList[i].amount)) {
|
||||
flag = false;
|
||||
break;
|
||||
}
|
||||
}
|
||||
let needPay = this.totalPrice;
|
||||
|
||||
if (needPay > 0 && flag) {
|
||||
if(index==0 && this.menu == '1' && isNotEmpty(this.memberCard.memberCardId)){
|
||||
//证明是卡金支付
|
||||
//如果应付金额大于卡金总余额 则卡金这一栏仅填写卡金余额
|
||||
if(needPay>this.memberCardAmount){
|
||||
pay.amount = this.memberCardAmount
|
||||
}else{
|
||||
pay.amount = needPay;
|
||||
}
|
||||
}else{
|
||||
pay.amount = needPay;
|
||||
}
|
||||
}
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
this.totalPrice = this.$options.data().totalPrice
|
||||
this.menu = this.$options.data().menu
|
||||
this.memberCard = this.$options.data().memberCard
|
||||
this.payTypeList = this.$options.data().payTypeList
|
||||
},
|
||||
submit(){
|
||||
if(this.totalPrice == this.realTotalPrice){
|
||||
let payList = this.payTypeList.filter(item => item.amount > 0)
|
||||
this.$emit('ok', payList)
|
||||
this.handleCancel()
|
||||
}else{
|
||||
error('应付金额不等于实际金额~')
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
::v-deep .el-input--prefix .el-input__inner{
|
||||
padding-left: 90px !important;
|
||||
}
|
||||
</style>
|
||||
289
web/src/views/business/cashier/pendingSellList.vue
Normal file
289
web/src/views/business/cashier/pendingSellList.vue
Normal file
@@ -0,0 +1,289 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container" style="margin-bottom: 10px;">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<el-row :gutter="24" class="row-container">
|
||||
|
||||
<el-table
|
||||
ref="productTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="80%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
@selection-change="getSelection"
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
align="center"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="手机号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberPhone }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="下单时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<div class="div-border" style="height: 29%;margin-top:15px;">
|
||||
<el-alert
|
||||
type="warning"
|
||||
:closable="false">
|
||||
<template slot="title">
|
||||
已选择的条目：{{productList.length}}个
|
||||
<el-button style="margin-left: 15px;"
|
||||
@click="chooseDone"
|
||||
icon="el-icon-check"
|
||||
type="danger">选好了</el-button>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<div class="tag-view">
|
||||
<el-tag
|
||||
v-for="(tag,index) in productList"
|
||||
:key="tag.productId"
|
||||
closable
|
||||
effect="dark"
|
||||
@close="handleClose(tag,index)"
|
||||
>
|
||||
{{tag.memberName}}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {deleteProduct} from "@/api/business/product/product";
|
||||
import {deepClone,success} from "@/utils";
|
||||
import {deleteSelljson, getSelljsonPage} from "@/api/business/sellJson/sellJson";
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/product/addProduct";
|
||||
import editForm from "@/views/business/product/editProduct";
|
||||
import {error} from "@/utils";
|
||||
|
||||
export default {
|
||||
name: 'productList',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: '',
|
||||
pendingStatus:0
|
||||
},
|
||||
defaultProps: {
|
||||
id: 'categoryId',
|
||||
label: 'categoryName',
|
||||
},
|
||||
temp: {},
|
||||
productList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleClose(tag,index){
|
||||
this.productList.splice(index,1);
|
||||
//取消选中状态
|
||||
this.$refs.productTable.toggleRowSelection(tag, false);
|
||||
},
|
||||
chooseDone(){
|
||||
if(this.productList.length==0){
|
||||
error('还没有选择订单')
|
||||
return false
|
||||
}
|
||||
this.$emit('ok', this.productList[0])
|
||||
|
||||
const table = this.$refs.productTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
|
||||
},
|
||||
handleRowClick(row) {
|
||||
//先删除所选中的 只选当前行
|
||||
const table = this.$refs.productTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
|
||||
this.$refs.productTable.toggleRowSelection(row)
|
||||
},
|
||||
getSelection(e){
|
||||
this.productList = e
|
||||
},
|
||||
handleNodeClick(e){
|
||||
this.listQuery.categoryId = e.categoryId
|
||||
this.fetchData()
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSelljsonPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open(this.listQuery.categoryId)
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteSelljson(scope.row.jsonId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tag-view /deep/ .el-tag {
|
||||
margin: 10px;
|
||||
}
|
||||
</style>
|
||||
271
web/src/views/business/cashier/serverList.vue
Normal file
271
web/src/views/business/cashier/serverList.vue
Normal file
@@ -0,0 +1,271 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container" style="margin-bottom: 10px;">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<el-row :gutter="24" class="row-container">
|
||||
|
||||
<el-table
|
||||
ref="productTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="80%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
@selection-change="getSelection"
|
||||
>
|
||||
|
||||
|
||||
<el-table-column
|
||||
align="center"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="工号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员名称"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员手机号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverPhone }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="入职时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.joinTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
|
||||
<div class="div-border" style="height: 29%;margin-top:15px;">
|
||||
<el-alert
|
||||
type="warning"
|
||||
:closable="false">
|
||||
<template slot="title">
|
||||
已选择的条目：{{productList.length}}个
|
||||
<el-button style="margin-left: 15px;"
|
||||
@click="chooseDone"
|
||||
icon="el-icon-check"
|
||||
type="danger">选好了
|
||||
</el-button>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<div class="tag-view">
|
||||
<el-tag
|
||||
v-for="(tag,index) in productList"
|
||||
:key="tag.serverId"
|
||||
closable
|
||||
effect="dark"
|
||||
@close="handleClose(tag,index)"
|
||||
>
|
||||
{{tag.serverName}}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getServerPage, deleteServer} from "@/api/business/server/server";
|
||||
import {deepClone, error, success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/server/addServer";
|
||||
import editForm from "@/views/business/server/editServer";
|
||||
|
||||
export default {
|
||||
name: 'serverList',
|
||||
components: {addForm, editForm, Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
productList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
getSelection(e) {
|
||||
this.productList = e
|
||||
},
|
||||
chooseDone() {
|
||||
if (this.productList.length == 0) {
|
||||
error('还没有选择订单')
|
||||
return false
|
||||
}
|
||||
this.$emit('ok', this.productList)
|
||||
|
||||
const table = this.$refs.productTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
},
|
||||
handleRowClick(row) {
|
||||
//先删除所选中的 只选当前行
|
||||
// const table = this.$refs.productTable;
|
||||
// const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
// rows.forEach(row => {
|
||||
// table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
// });
|
||||
|
||||
this.$refs.productTable.toggleRowSelection(row)
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getServerPage(this.listQuery).then(response => {
|
||||
const {records, total} = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add() {
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk() {
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk() {
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res => {
|
||||
if (res) {
|
||||
deleteServer(scope.row.serverId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tag-view /deep/ .el-tag {
|
||||
margin: 10px;
|
||||
}
|
||||
</style>
|
||||
98
web/src/views/business/category/addCategory.vue
Normal file
98
web/src/views/business/category/addCategory.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="分类名" prop="categoryName" class="is-required">
|
||||
<el-input v-model="temp.categoryName" placeholder="分类名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="categoryStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.categoryStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addCategory} from "@/api/business/category/category";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import DeptSelect from "@/views/common/system/deptSelect";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: {DeptSelect},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
categoryName:'',
|
||||
categoryStatus:0,
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addCategory(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
getDept(e){
|
||||
console.log(e)
|
||||
this.temp.shopName = e.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
249
web/src/views/business/category/categoryList.vue
Normal file
249
web/src/views/business/category/categoryList.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="分类名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.categoryName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1禁用"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.categoryStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCategoryPage,deleteCategory} from "@/api/business/category/category";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/category/addCategory";
|
||||
import editForm from "@/views/business/category/editCategory";
|
||||
|
||||
export default {
|
||||
name: 'category',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getCategoryPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteCategory(scope.row.categoryId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
104
web/src/views/business/category/editCategory.vue
Normal file
104
web/src/views/business/category/editCategory.vue
Normal file
@@ -0,0 +1,104 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="分类名" prop="categoryName" class="is-required">
|
||||
<el-input v-model="temp.categoryName" placeholder="分类名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="categoryStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.categoryStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editCategory } from "@/api/business/category/category";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import DeptSelect from "@/views/common/system/deptSelect";
|
||||
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
components: {DeptSelect},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
categoryId:'',
|
||||
categoryName:'',
|
||||
categoryStatus:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editCategory(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
},
|
||||
getDept(e){
|
||||
console.log(e)
|
||||
this.temp.shopName = e.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
156
web/src/views/business/detailServer/addSellDetailServer.vue
Normal file
156
web/src/views/business/detailServer/addSellDetailServer.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="详单对应服务人员记录id" prop="detailServerId" class="is-required">
|
||||
<el-input v-model="temp.detailServerId" placeholder="详单对应服务人员记录id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="详单id" prop="sellDetailId" class="is-required">
|
||||
<el-input v-model="temp.sellDetailId" placeholder="详单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员" prop="serverId" class="is-required">
|
||||
<el-input v-model="temp.serverId" placeholder="服务人员" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员" prop="serverName" class="is-required">
|
||||
<el-input v-model="temp.serverName" placeholder="服务人员" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成" prop="serverPushMoney" class="is-required">
|
||||
<el-input v-model="temp.serverPushMoney" placeholder="提成" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="业绩" prop="serverGrade" class="is-required">
|
||||
<el-input v-model="temp.serverGrade" placeholder="业绩" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addSellDetailServer} from "@/api/business/detailServer/detailServer";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
detailServerId:'',
|
||||
sellId:'',
|
||||
sellDetailId:'',
|
||||
serverId:'',
|
||||
serverName:'',
|
||||
serverPushMoney:'',
|
||||
serverGrade:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
remark:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addSellDetailServer(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
343
web/src/views/business/detailServer/detailServerList.vue
Normal file
343
web/src/views/business/detailServer/detailServerList.vue
Normal file
@@ -0,0 +1,343 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="详单对应服务人员记录id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.detailServerId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="订单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="详单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellDetailId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverPushMoney }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="业绩"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverGrade }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="备注"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.remark }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getSellDetailServerPage,deleteSellDetailServer} from "@/api/business/detailServer/detailServer";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/detailServer/addSellDetailServer";
|
||||
import editForm from "@/views/business/detailServer/editSellDetailServer";
|
||||
|
||||
export default {
|
||||
name: 'detailServer',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSellDetailServerPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteSellDetailServer(scope.row.detailServerId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
157
web/src/views/business/detailServer/editSellDetailServer.vue
Normal file
157
web/src/views/business/detailServer/editSellDetailServer.vue
Normal file
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="详单对应服务人员记录id" prop="detailServerId" class="is-required">
|
||||
<el-input v-model="temp.detailServerId" placeholder="详单对应服务人员记录id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="详单id" prop="sellDetailId" class="is-required">
|
||||
<el-input v-model="temp.sellDetailId" placeholder="详单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员" prop="serverId" class="is-required">
|
||||
<el-input v-model="temp.serverId" placeholder="服务人员" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员" prop="serverName" class="is-required">
|
||||
<el-input v-model="temp.serverName" placeholder="服务人员" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成" prop="serverPushMoney" class="is-required">
|
||||
<el-input v-model="temp.serverPushMoney" placeholder="提成" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="业绩" prop="serverGrade" class="is-required">
|
||||
<el-input v-model="temp.serverGrade" placeholder="业绩" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editSellDetailServer } from "@/api/business/detailServer/detailServer";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
detailServerId:'',
|
||||
sellId:'',
|
||||
sellDetailId:'',
|
||||
serverId:'',
|
||||
serverName:'',
|
||||
serverPushMoney:'',
|
||||
serverGrade:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
remark:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editSellDetailServer(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
131
web/src/views/business/file/addFile.vue
Normal file
131
web/src/views/business/file/addFile.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="文件id" prop="fileId" class="is-required">
|
||||
<el-input v-model="temp.fileId" placeholder="文件id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="上级id" prop="parentId" class="is-required">
|
||||
<el-input v-model="temp.parentId" placeholder="上级id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件仓库（oss仓库）" prop="fileBucket" class="is-required">
|
||||
<el-input v-model="temp.fileBucket" placeholder="文件仓库（oss仓库）" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件名称" prop="fileName" class="is-required">
|
||||
<el-input v-model="temp.fileName" placeholder="文件名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件后缀" prop="fileSuffix" class="is-required">
|
||||
<el-input v-model="temp.fileSuffix" placeholder="文件后缀" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件大小kb" prop="fileSizeKb" class="is-required">
|
||||
<el-input v-model="temp.fileSizeKb" placeholder="文件大小kb" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件唯一标识id" prop="finalName" class="is-required">
|
||||
<el-input v-model="temp.finalName" placeholder="文件唯一标识id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="存储路径" prop="filePath" class="is-required">
|
||||
<el-input v-model="temp.filePath" placeholder="存储路径" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0文件夹 1文件" prop="fileType" class="is-required">
|
||||
<el-input v-model="temp.fileType" placeholder="0文件夹 1文件" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="存放的系统路径" prop="fileSysPath" class="is-required">
|
||||
<el-input v-model="temp.fileSysPath" placeholder="存放的系统路径" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addFile} from "@/api/business/file/file";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
fileId:'',
|
||||
parentId:'',
|
||||
fileBucket:'',
|
||||
fileName:'',
|
||||
fileSuffix:'',
|
||||
fileSizeKb:'',
|
||||
finalName:'',
|
||||
filePath:'',
|
||||
fileType:'',
|
||||
fileSysPath:'',
|
||||
createTime:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addFile(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
132
web/src/views/business/file/editFile.vue
Normal file
132
web/src/views/business/file/editFile.vue
Normal file
@@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="文件id" prop="fileId" class="is-required">
|
||||
<el-input v-model="temp.fileId" placeholder="文件id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="上级id" prop="parentId" class="is-required">
|
||||
<el-input v-model="temp.parentId" placeholder="上级id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件仓库（oss仓库）" prop="fileBucket" class="is-required">
|
||||
<el-input v-model="temp.fileBucket" placeholder="文件仓库（oss仓库）" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件名称" prop="fileName" class="is-required">
|
||||
<el-input v-model="temp.fileName" placeholder="文件名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件后缀" prop="fileSuffix" class="is-required">
|
||||
<el-input v-model="temp.fileSuffix" placeholder="文件后缀" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件大小kb" prop="fileSizeKb" class="is-required">
|
||||
<el-input v-model="temp.fileSizeKb" placeholder="文件大小kb" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="文件唯一标识id" prop="finalName" class="is-required">
|
||||
<el-input v-model="temp.finalName" placeholder="文件唯一标识id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="存储路径" prop="filePath" class="is-required">
|
||||
<el-input v-model="temp.filePath" placeholder="存储路径" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0文件夹 1文件" prop="fileType" class="is-required">
|
||||
<el-input v-model="temp.fileType" placeholder="0文件夹 1文件" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="存放的系统路径" prop="fileSysPath" class="is-required">
|
||||
<el-input v-model="temp.fileSysPath" placeholder="存放的系统路径" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editFile } from "@/api/business/file/file";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
fileId:'',
|
||||
parentId:'',
|
||||
fileBucket:'',
|
||||
fileName:'',
|
||||
fileSuffix:'',
|
||||
fileSizeKb:'',
|
||||
finalName:'',
|
||||
filePath:'',
|
||||
fileType:'',
|
||||
fileSysPath:'',
|
||||
createTime:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editFile(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
293
web/src/views/business/file/fileList.vue
Normal file
293
web/src/views/business/file/fileList.vue
Normal file
@@ -0,0 +1,293 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="文件id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="上级id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.parentId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="文件仓库（oss仓库）"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileBucket }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="文件名称"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="文件后缀"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileSuffix }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="文件大小kb"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileSizeKb }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="文件唯一标识id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.finalName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="存储路径"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.filePath }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0文件夹 1文件"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="存放的系统路径"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.fileSysPath }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getFilePage,deleteFile} from "@/api/business/file/file";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/file/addFile";
|
||||
import editForm from "@/views/business/file/editFile";
|
||||
|
||||
export default {
|
||||
name: 'file',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getFilePage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteFile(scope.row.fileId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
112
web/src/views/business/member/addMember.vue
Normal file
112
web/src/views/business/member/addMember.vue
Normal file
@@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="会员姓名" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员姓名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="手机号" prop="memberPhone" class="is-required">
|
||||
<el-input v-model="temp.memberPhone" placeholder="手机号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input type="textarea"
|
||||
:rows="2" v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费密码" prop="payPassword" >
|
||||
<el-input v-model="temp.payPassword" placeholder="消费密码" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
import {addMember} from "@/api/business/member/member";
|
||||
import {getDeptList} from "@/api/system/dept/dept";
|
||||
import {setRequiredFields,getSelectObj} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
memberPhone:'',
|
||||
remark:'',
|
||||
payPassword:'',
|
||||
shopName:'',
|
||||
shopId:'',
|
||||
createTime:'',
|
||||
},
|
||||
deptList:[]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
getDeptList().then(response => {
|
||||
this.deptList = response.data
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addMember(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
handleSelect(e){
|
||||
console.log(e)
|
||||
let obj = getSelectObj(e,this.deptList,"deptId")
|
||||
console.log(obj)
|
||||
this.temp.shopName = obj.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
124
web/src/views/business/member/editMember.vue
Normal file
124
web/src/views/business/member/editMember.vue
Normal file
@@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="会员姓名" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员姓名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="手机号" prop="memberPhone" class="is-required">
|
||||
<el-input v-model="temp.memberPhone" placeholder="手机号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费密码" prop="payPassword" class="is-required">
|
||||
<el-input v-model="temp.payPassword" placeholder="消费密码" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <el-select v-model="temp.shopId" placeholder="请选择" @change="handleSelect">-->
|
||||
<!-- <el-option-->
|
||||
<!-- v-for="item in deptList"-->
|
||||
<!-- :key="item.deptId"-->
|
||||
<!-- :label="item.deptName"-->
|
||||
<!-- :value="item.deptId">-->
|
||||
<!-- <span style="float: left">{{ item.deptName }}</span>-->
|
||||
<!-- <span style="float: right; color: #8492a6; font-size: 13px">{{ item.deptNo }}</span>-->
|
||||
<!-- </el-option>-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </el-form-item>-->
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editMember } from "@/api/business/member/member";
|
||||
import {getDeptList} from "@/api/system/dept/dept";
|
||||
import {setRequiredFields,getSelectObj} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
memberPhone:'',
|
||||
remark:'',
|
||||
payPassword:'',
|
||||
shopName:'',
|
||||
shopId:'',
|
||||
createTime:'',
|
||||
},
|
||||
deptList:[]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
getDeptList().then(response => {
|
||||
this.deptList = response.data
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editMember(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
},
|
||||
handleSelect(e){
|
||||
console.log(e)
|
||||
let obj = getSelectObj(e,this.deptList,"deptId")
|
||||
console.log(obj)
|
||||
this.temp.shopName = obj.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
245
web/src/views/business/member/memberList.vue
Normal file
245
web/src/views/business/member/memberList.vue
Normal file
@@ -0,0 +1,245 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="会员姓名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="手机号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberPhone }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="备注"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.remark }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="消费密码"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.payPassword }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<!-- <el-button-->
|
||||
<!-- type="danger"-->
|
||||
<!-- icon="el-icon-delete"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="del(scope)"-->
|
||||
<!-- >-->
|
||||
<!-- 删除-->
|
||||
<!-- </el-button>-->
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getMemberPage,deleteMember} from "@/api/business/member/member";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination/index'
|
||||
import addForm from "@/views/business/member/addMember";
|
||||
import editForm from "@/views/business/member/editMember";
|
||||
|
||||
export default {
|
||||
name: 'member',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getMemberPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteMember(scope.row.memberId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
181
web/src/views/business/memberCard/addMemberCard.vue
Normal file
181
web/src/views/business/memberCard/addMemberCard.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="会员卡id" prop="memberCardId" class="is-required">
|
||||
<el-input v-model="temp.memberCardId" placeholder="会员卡id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡项ID" prop="cardId" class="is-required">
|
||||
<el-input v-model="temp.cardId" placeholder="卡项ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡号" prop="cardNo" class="is-required">
|
||||
<el-input v-model="temp.cardNo" placeholder="卡号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡名称" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="卡名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="余额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="余额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="赠送金额" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="赠送金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品折扣" prop="discount" class="is-required">
|
||||
<el-input v-model="temp.discount" placeholder="商品折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="开卡金额" prop="buildCardAmount" class="is-required">
|
||||
<el-input v-model="temp.buildCardAmount" placeholder="开卡金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成比例" prop="pushMoney" class="is-required">
|
||||
<el-input v-model="temp.pushMoney" placeholder="提成比例" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="cardStatus" class="is-required">
|
||||
<el-input v-model="temp.cardStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="乐观锁字段" prop="version" class="is-required">
|
||||
<el-input v-model="temp.version" placeholder="乐观锁字段" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addMemberCard} from "@/api/business/memberCard/memberCard";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
memberCardId:'',
|
||||
memberId:'',
|
||||
cardId:'',
|
||||
cardNo:'',
|
||||
cardName:'',
|
||||
amount:'',
|
||||
giveAmount:'',
|
||||
discount:'',
|
||||
buildCardAmount:'',
|
||||
pushMoney:'',
|
||||
cardStatus:'',
|
||||
deleted:'',
|
||||
version:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addMemberCard(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
182
web/src/views/business/memberCard/editMemberCard.vue
Normal file
182
web/src/views/business/memberCard/editMemberCard.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="会员卡id" prop="memberCardId" class="is-required">
|
||||
<el-input v-model="temp.memberCardId" placeholder="会员卡id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡项ID" prop="cardId" class="is-required">
|
||||
<el-input v-model="temp.cardId" placeholder="卡项ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡号" prop="cardNo" class="is-required">
|
||||
<el-input v-model="temp.cardNo" placeholder="卡号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡名称" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="卡名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="余额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="余额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="赠送金额" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="赠送金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品折扣" prop="discount" class="is-required">
|
||||
<el-input v-model="temp.discount" placeholder="商品折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="开卡金额" prop="buildCardAmount" class="is-required">
|
||||
<el-input v-model="temp.buildCardAmount" placeholder="开卡金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成比例" prop="pushMoney" class="is-required">
|
||||
<el-input v-model="temp.pushMoney" placeholder="提成比例" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="cardStatus" class="is-required">
|
||||
<el-input v-model="temp.cardStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="乐观锁字段" prop="version" class="is-required">
|
||||
<el-input v-model="temp.version" placeholder="乐观锁字段" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editMemberCard } from "@/api/business/memberCard/memberCard";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
memberCardId:'',
|
||||
memberId:'',
|
||||
cardId:'',
|
||||
cardNo:'',
|
||||
cardName:'',
|
||||
amount:'',
|
||||
giveAmount:'',
|
||||
discount:'',
|
||||
buildCardAmount:'',
|
||||
pushMoney:'',
|
||||
cardStatus:'',
|
||||
deleted:'',
|
||||
version:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editMemberCard(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
393
web/src/views/business/memberCard/memberCardList.vue
Normal file
393
web/src/views/business/memberCard/memberCardList.vue
Normal file
@@ -0,0 +1,393 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="会员卡id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡项ID"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡名称"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="余额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.amount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="赠送金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.giveAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品折扣"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.discount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="开卡金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.buildCardAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成比例"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pushMoney }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1取消"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1删除"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.deleted }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="乐观锁字段"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.version }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getMemberCardPage,deleteMemberCard} from "@/api/business/memberCard/memberCard";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/memberCard/addMemberCard";
|
||||
import editForm from "@/views/business/memberCard/editMemberCard";
|
||||
|
||||
export default {
|
||||
name: 'memberCard',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getMemberCardPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteMemberCard(scope.row.memberCardId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
156
web/src/views/business/operationLog/addOperationLog.vue
Normal file
156
web/src/views/business/operationLog/addOperationLog.vue
Normal file
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="日志id" prop="operId" class="is-required">
|
||||
<el-input v-model="temp.operId" placeholder="日志id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求模块" prop="operModule" class="is-required">
|
||||
<el-input v-model="temp.operModule" placeholder="请求模块" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作类型" prop="operType" class="is-required">
|
||||
<el-input v-model="temp.operType" placeholder="操作类型" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作描述" prop="operDesc" class="is-required">
|
||||
<el-input v-model="temp.operDesc" placeholder="操作描述" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作方法" prop="operMethod" class="is-required">
|
||||
<el-input v-model="temp.operMethod" placeholder="操作方法" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求参数" prop="oprrRequestParam" class="is-required">
|
||||
<el-input v-model="temp.oprrRequestParam" placeholder="请求参数" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="响应参数" prop="operResponseParam" class="is-required">
|
||||
<el-input v-model="temp.operResponseParam" placeholder="响应参数" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作人姓名" prop="operUserId" class="is-required">
|
||||
<el-input v-model="temp.operUserId" placeholder="操作人姓名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作人ID" prop="operUserName" class="is-required">
|
||||
<el-input v-model="temp.operUserName" placeholder="操作人ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作ip" prop="operIp" class="is-required">
|
||||
<el-input v-model="temp.operIp" placeholder="操作ip" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求url" prop="operUrl" class="is-required">
|
||||
<el-input v-model="temp.operUrl" placeholder="请求url" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作机构id" prop="operDeptId" class="is-required">
|
||||
<el-input v-model="temp.operDeptId" placeholder="操作机构id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="机构名" prop="operDeptName" class="is-required">
|
||||
<el-input v-model="temp.operDeptName" placeholder="机构名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员名" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员名" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addOperationLog} from "@/api/business/operationLog/operationLog";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
operId:'',
|
||||
operModule:'',
|
||||
operType:'',
|
||||
operDesc:'',
|
||||
operMethod:'',
|
||||
oprrRequestParam:'',
|
||||
operResponseParam:'',
|
||||
operUserId:'',
|
||||
operUserName:'',
|
||||
operIp:'',
|
||||
operUrl:'',
|
||||
operDeptId:'',
|
||||
operDeptName:'',
|
||||
createTime:'',
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addOperationLog(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
157
web/src/views/business/operationLog/editOperationLog.vue
Normal file
157
web/src/views/business/operationLog/editOperationLog.vue
Normal file
@@ -0,0 +1,157 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="日志id" prop="operId" class="is-required">
|
||||
<el-input v-model="temp.operId" placeholder="日志id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求模块" prop="operModule" class="is-required">
|
||||
<el-input v-model="temp.operModule" placeholder="请求模块" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作类型" prop="operType" class="is-required">
|
||||
<el-input v-model="temp.operType" placeholder="操作类型" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作描述" prop="operDesc" class="is-required">
|
||||
<el-input v-model="temp.operDesc" placeholder="操作描述" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作方法" prop="operMethod" class="is-required">
|
||||
<el-input v-model="temp.operMethod" placeholder="操作方法" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求参数" prop="oprrRequestParam" class="is-required">
|
||||
<el-input v-model="temp.oprrRequestParam" placeholder="请求参数" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="响应参数" prop="operResponseParam" class="is-required">
|
||||
<el-input v-model="temp.operResponseParam" placeholder="响应参数" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作人姓名" prop="operUserId" class="is-required">
|
||||
<el-input v-model="temp.operUserId" placeholder="操作人姓名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作人ID" prop="operUserName" class="is-required">
|
||||
<el-input v-model="temp.operUserName" placeholder="操作人ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作ip" prop="operIp" class="is-required">
|
||||
<el-input v-model="temp.operIp" placeholder="操作ip" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="请求url" prop="operUrl" class="is-required">
|
||||
<el-input v-model="temp.operUrl" placeholder="请求url" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="操作机构id" prop="operDeptId" class="is-required">
|
||||
<el-input v-model="temp.operDeptId" placeholder="操作机构id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="机构名" prop="operDeptName" class="is-required">
|
||||
<el-input v-model="temp.operDeptName" placeholder="机构名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员名" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员名" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editOperationLog } from "@/api/business/operationLog/operationLog";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
operId:'',
|
||||
operModule:'',
|
||||
operType:'',
|
||||
operDesc:'',
|
||||
operMethod:'',
|
||||
oprrRequestParam:'',
|
||||
operResponseParam:'',
|
||||
operUserId:'',
|
||||
operUserName:'',
|
||||
operIp:'',
|
||||
operUrl:'',
|
||||
operDeptId:'',
|
||||
operDeptName:'',
|
||||
createTime:'',
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editOperationLog(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
326
web/src/views/business/operationLog/operationLogList.vue
Normal file
326
web/src/views/business/operationLog/operationLogList.vue
Normal file
@@ -0,0 +1,326 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作ip"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operIp }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="请求模块"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operModule }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作类型"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作描述"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operDesc }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作方法"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operMethod }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- <el-table-column-->
|
||||
<!-- label="请求参数"-->
|
||||
<!-- width="160"-->
|
||||
<!-- align="center"-->
|
||||
<!-- >-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- {{ scope.row.oprrRequestParam }}-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
|
||||
<el-table-column
|
||||
label="操作人姓名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operUserId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作人ID"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operUserName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="请求url"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operUrl }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="操作机构id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operDeptId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="机构名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.operDeptName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label=""
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getOperationLogPage,deleteOperationLog} from "@/api/business/operationLog/operationLog";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/operationLog/addOperationLog";
|
||||
import editForm from "@/views/business/operationLog/editOperationLog";
|
||||
|
||||
export default {
|
||||
name: 'operationLog',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getOperationLogPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteOperationLog(scope.row.operationLogId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
242
web/src/views/business/product/addProduct.vue
Normal file
242
web/src/views/business/product/addProduct.vue
Normal file
@@ -0,0 +1,242 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="3vh"
|
||||
height="80%"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="分类" prop="categoryId" class="is-required">
|
||||
<category-select v-model="temp.categoryId" @changeSelect="getCategory"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名" prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品金额" prop="productAmount" class="is-required">
|
||||
<el-input v-model="temp.productAmount" placeholder="商品金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品会员金额" prop="productMemberAmount" class="is-required">
|
||||
<el-input v-model="temp.productMemberAmount" placeholder="商品会员金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品图片" prop="productImage" class="is-required">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="''"
|
||||
:show-file-list="false"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
>
|
||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 140px;height: 140px;">
|
||||
<div style="width: 140px;height: 140px;display: flex;justify-content: center;align-items: center;border: 1px solid #eee;" v-else>
|
||||
<i class="el-icon-plus avatar-uploader-icon" ></i>
|
||||
</div>
|
||||
</el-upload>
|
||||
<x-cropper ref="iscropper"/>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item label="库存管理" prop="stockControl" class="is-required">
|
||||
<el-radio-group v-model="temp.stockControl" size="small">
|
||||
<el-radio-button label="0">关闭</el-radio-button>
|
||||
<el-radio-button label="1">开启</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-if="temp.stockControl==1" label="初始化库存数量" prop="productCount" class="is-required">
|
||||
<el-input v-model="temp.productCount" placeholder="初始化库存数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成方式" prop="pushType" class="is-required">
|
||||
<el-radio-group v-model="temp.pushType" size="small">
|
||||
<el-radio-button label="0">固定金额</el-radio-button>
|
||||
<el-radio-button label="1">比例</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成金额" v-if="temp.pushType==0" prop="pushAmount" class="is-required">
|
||||
<el-input v-model="temp.pushAmount" placeholder="提成金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成比例" v-if="temp.pushType==1" prop="pushPercent" class="is-required">
|
||||
<el-input v-model="temp.pushPercent" placeholder="提成比例" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="productStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.productStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request'
|
||||
import {addProduct} from "@/api/business/product/product";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import CategorySelect from "@/views/common/business/categorySelect";
|
||||
import XCropper from "@/views/common/XCropper";
|
||||
import DeptSelect from "@/views/common/system/deptSelect";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: {DeptSelect, XCropper, CategorySelect},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
productId:'',
|
||||
categoryId:'',
|
||||
categoryName:'',
|
||||
productName:'',
|
||||
productAmount:'',
|
||||
productMemberAmount:'',
|
||||
productImage:'',
|
||||
productCount:'',
|
||||
pushAmount:'',
|
||||
pushPercent:'',
|
||||
stockControl:0,
|
||||
productStatus:0,
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(categoryId) {
|
||||
this.dialogVisible = true
|
||||
this.temp.categoryId = categoryId
|
||||
},
|
||||
beforeAvatarUpload(file){
|
||||
console.log("进入了文件上传")
|
||||
let _this = this
|
||||
return new Promise((resolve, reject) => {
|
||||
let types = ['image/jpeg', 'image/jpg', 'image/png'];
|
||||
// let width = 140;
|
||||
// let height = 140;
|
||||
const isJPG = types.includes(file.type)
|
||||
const isLt2M = file.size / 1024 / 1024 < 10
|
||||
if (!isJPG) {
|
||||
_this.$message.error('上传图片只能是 JPG 或 png格式!')
|
||||
reject()
|
||||
return
|
||||
}
|
||||
if (!isLt2M) {
|
||||
_this.$message.error('上传图片大小不能超过 10MB!')
|
||||
reject()
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
let _URL = window.URL || window.webkitURL;
|
||||
|
||||
console.log( _this.$refs.iscropper)
|
||||
//上传前对图片进行裁剪
|
||||
_this.$refs.iscropper.showModal({
|
||||
img: _URL.createObjectURL(file) , // 裁剪图片的地址
|
||||
autoCropWidth: 140, // 默认生成截图框宽度
|
||||
autoCropHeight: 140, // 默认生成截图框高度
|
||||
fixedBox:true,
|
||||
success: res => {
|
||||
//拿到裁剪后图片没有name 属性
|
||||
//file的name属性为只读 不能手动设置
|
||||
//创建一个新的图片对象 设置原始文件名
|
||||
const cloneFile = new File([res.img], file.name);
|
||||
|
||||
const formData = new FormData()
|
||||
// console.log(param.file)
|
||||
//通过 append 函数往formdata对象里传参，这里传的是后端需求的接口信息
|
||||
formData.append('file', cloneFile)
|
||||
formData.append('fileSavePath', "productImage")
|
||||
|
||||
//执行上传操作
|
||||
request({
|
||||
method: "post",
|
||||
url: "/upload",
|
||||
data: formData,
|
||||
headers: { "Content-Type": "multipart/form-data" },
|
||||
|
||||
}).then(response => {
|
||||
//请求成功
|
||||
_this.handleAvatarSuccess(response,cloneFile)
|
||||
})
|
||||
|
||||
resolve()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
handleAvatarSuccess(res,file) {
|
||||
|
||||
if(res.code == 200){
|
||||
this.imageUrl = URL.createObjectURL(file);
|
||||
this.temp.productImage = res.data.fileId
|
||||
}else{
|
||||
this.imageUrl = '';
|
||||
this.temp.productImg = ''
|
||||
}
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addProduct(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.imageUrl = '';
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
getCategory(e){
|
||||
console.log(e)
|
||||
this.temp.categoryName = e.categoryName
|
||||
},
|
||||
getDept(e){
|
||||
this.temp.shopName = e.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
243
web/src/views/business/product/editProduct.vue
Normal file
243
web/src/views/business/product/editProduct.vue
Normal file
@@ -0,0 +1,243 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="3vh"
|
||||
height="80%"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="分类" prop="categoryId" class="is-required">
|
||||
<category-select v-model="temp.categoryId" @changeSelect="getCategory"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名" prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品金额" prop="productAmount" class="is-required">
|
||||
<el-input v-model="temp.productAmount" placeholder="商品金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品会员金额" prop="productMemberAmount" class="is-required">
|
||||
<el-input v-model="temp.productMemberAmount" placeholder="商品会员金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品图片" prop="productImage" class="is-required">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="''"
|
||||
:show-file-list="false"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
>
|
||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 140px;height: 140px;">
|
||||
<div style="width: 140px;height: 140px;display: flex;justify-content: center;align-items: center;border: 1px solid #eee;" v-else>
|
||||
<i class="el-icon-plus avatar-uploader-icon" ></i>
|
||||
</div>
|
||||
</el-upload>
|
||||
<x-cropper ref="iscropper"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存管理" prop="stockControl" class="is-required">
|
||||
<el-radio-group v-model="temp.stockControl" size="small">
|
||||
<el-radio-button label="0">关闭</el-radio-button>
|
||||
<el-radio-button label="1">开启</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item v-if="temp.stockControl==1" label="库存数量" prop="productCount" class="is-required">
|
||||
<el-input v-model="temp.productCount" readonly placeholder="库存数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成方式" prop="pushType" class="is-required">
|
||||
<el-radio-group v-model="temp.pushType" size="small">
|
||||
<el-radio-button label="0">固定金额</el-radio-button>
|
||||
<el-radio-button label="1">比例</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成金额" v-if="temp.pushType==0" prop="pushAmount" class="is-required">
|
||||
<el-input v-model="temp.pushAmount" placeholder="提成金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="提成比例" v-if="temp.pushType==1" prop="pushPercent" class="is-required">
|
||||
<el-input v-model="temp.pushPercent" placeholder="提成比例" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="productStatus" class="is-required">
|
||||
<el-radio-group v-model="temp.productStatus" size="small">
|
||||
<el-radio-button label="0">正常</el-radio-button>
|
||||
<el-radio-button label="1">禁用</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="所属门店" prop="shopId" class="is-required">-->
|
||||
<!-- <dept-select v-model="temp.shopId" @changeSelect="getDept" style="width: 100%;"/>-->
|
||||
<!-- </el-form-item>-->
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from '@/utils/request'
|
||||
import { editProduct } from "@/api/business/product/product";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import CategorySelect from "@/views/common/business/categorySelect";
|
||||
import XCropper from "@/views/common/XCropper";
|
||||
import DeptSelect from "@/views/common/system/deptSelect";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
components: {DeptSelect, XCropper, CategorySelect},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
productId:'',
|
||||
categoryId:'',
|
||||
categoryName:'',
|
||||
productName:'',
|
||||
productAmount:'',
|
||||
productMemberAmount:'',
|
||||
productImage:'',
|
||||
productCount:'',
|
||||
pushAmount:'',
|
||||
pushPercent:'',
|
||||
productStatus:0,
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
pushType:0
|
||||
},
|
||||
imageUrl:''
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
if(this.temp.productImageUrl){
|
||||
this.imageUrl = this.baseUrl + this.temp.productImageUrl
|
||||
}
|
||||
this.dialogVisible = true
|
||||
},
|
||||
beforeAvatarUpload(file){
|
||||
console.log("进入了文件上传")
|
||||
let _this = this
|
||||
return new Promise((resolve, reject) => {
|
||||
let types = ['image/jpeg', 'image/jpg', 'image/png'];
|
||||
// let width = 140;
|
||||
// let height = 140;
|
||||
const isJPG = types.includes(file.type)
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
if (!isJPG) {
|
||||
_this.$message.error('上传图片只能是 JPG 或 png格式!')
|
||||
reject()
|
||||
}
|
||||
if (!isLt2M) {
|
||||
_this.$message.error('上传图片大小不能超过 2MB!')
|
||||
reject()
|
||||
}
|
||||
|
||||
|
||||
let _URL = window.URL || window.webkitURL;
|
||||
|
||||
console.log( _this.$refs.iscropper)
|
||||
//上传前对图片进行裁剪
|
||||
_this.$refs.iscropper.showModal({
|
||||
img: _URL.createObjectURL(file) , // 裁剪图片的地址
|
||||
autoCropWidth: 140, // 默认生成截图框宽度
|
||||
autoCropHeight: 140, // 默认生成截图框高度
|
||||
fixedBox:true,
|
||||
success: res => {
|
||||
//拿到裁剪后图片没有name 属性
|
||||
//file的name属性为只读 不能手动设置
|
||||
//创建一个新的图片对象 设置原始文件名
|
||||
const cloneFile = new File([res.img], file.name);
|
||||
|
||||
const formData = new FormData()
|
||||
// console.log(param.file)
|
||||
//通过 append 函数往formdata对象里传参，这里传的是后端需求的接口信息
|
||||
formData.append('file', cloneFile)
|
||||
formData.append('fileSavePath', "productImage")
|
||||
|
||||
//执行上传操作
|
||||
request({
|
||||
method: "post",
|
||||
url: "/upload",
|
||||
data: formData,
|
||||
headers: { "Content-Type": "multipart/form-data" },
|
||||
|
||||
}).then(response => {
|
||||
//请求成功
|
||||
_this.handleAvatarSuccess(response,cloneFile)
|
||||
})
|
||||
|
||||
resolve()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
handleAvatarSuccess(res,file) {
|
||||
|
||||
if(res.code == 200){
|
||||
this.imageUrl = URL.createObjectURL(file);
|
||||
this.temp.productImage = res.data.fileId
|
||||
}else{
|
||||
this.imageUrl = '';
|
||||
this.temp.productImg = ''
|
||||
}
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editProduct(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
},
|
||||
getCategory(e){
|
||||
console.log(e)
|
||||
this.temp.categoryName = e.categoryName
|
||||
},
|
||||
getDept(e){
|
||||
this.temp.shopName = e.deptName
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
360
web/src/views/business/product/productList.vue
Normal file
360
web/src/views/business/product/productList.vue
Normal file
@@ -0,0 +1,360 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-row :gutter="24" class="row-container">
|
||||
<el-col :span="4" style="height: 100%;">
|
||||
<el-tree
|
||||
default-expand-all
|
||||
:data="categoryList"
|
||||
node-key="categoryId"
|
||||
:props="defaultProps"
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }">
|
||||
<span :class="listQuery.categoryId==data.categoryId?'info-text':''" > {{ node.label }}</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-col>
|
||||
<el-col :span="20" style="height: 100%;">
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="分类名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.categoryName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品会员金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productMemberAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品图片"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.productImage" :src=" baseUrl + scope.row.productImageUrl" class="avatar" style="width: 40px;height: 40px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存数量"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productCount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pushAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成比例"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pushPercent }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1下架"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
v-hasPerms="'product:del'"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCategoryList} from "@/api/business/category/category";
|
||||
import {getProductPage,deleteProduct} from "@/api/business/product/product";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/product/addProduct";
|
||||
import editForm from "@/views/business/product/editProduct";
|
||||
|
||||
export default {
|
||||
name: 'product',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
categoryId: '',
|
||||
keyword: ''
|
||||
},
|
||||
defaultProps: {
|
||||
id: 'categoryId',
|
||||
label: 'categoryName',
|
||||
},
|
||||
temp: {},
|
||||
categoryList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
this.getCategoryList()
|
||||
},
|
||||
methods: {
|
||||
getCategoryList(){
|
||||
getCategoryList().then(res => {
|
||||
this.categoryList = res.data
|
||||
})
|
||||
},
|
||||
handleNodeClick(e){
|
||||
this.listQuery.categoryId = e.categoryId
|
||||
this.fetchData()
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getProductPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open(this.listQuery.categoryId)
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteProduct(scope.row.productId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
181
web/src/views/business/sell/addSell.vue
Normal file
181
web/src/views/business/sell/addSell.vue
Normal file
@@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单号" prop="sellNo" class="is-required">
|
||||
<el-input v-model="temp.sellNo" placeholder="订单号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="流水号" prop="serialNo" class="is-required">
|
||||
<el-input v-model="temp.serialNo" placeholder="流水号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员ID" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员名称" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费金额" prop="sellAmount" class="is-required">
|
||||
<el-input v-model="temp.sellAmount" placeholder="消费金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="实际入账" prop="realAmount" class="is-required">
|
||||
<el-input v-model="temp.realAmount" placeholder="实际入账" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1开卡 2续卡 3项目/商品" prop="sellType" class="is-required">
|
||||
<el-input v-model="temp.sellType" placeholder="1开卡 2续卡 3项目/商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="sellStatus" class="is-required">
|
||||
<el-input v-model="temp.sellStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="乐观锁字段" prop="version" class="is-required">
|
||||
<el-input v-model="temp.version" placeholder="乐观锁字段" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费后金额" prop="memberCardAfterAmount" class="is-required">
|
||||
<el-input v-model="temp.memberCardAfterAmount" placeholder="消费后金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="" prop="memberCardBeforeAmount" class="is-required">
|
||||
<el-input v-model="temp.memberCardBeforeAmount" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addSell} from "@/api/business/sell/sell";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellId:'',
|
||||
sellNo:'',
|
||||
serialNo:'',
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
sellAmount:'',
|
||||
realAmount:'',
|
||||
sellType:'',
|
||||
sellStatus:'',
|
||||
deleted:'',
|
||||
version:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
memberCardAfterAmount:'',
|
||||
memberCardBeforeAmount:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addSell(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
182
web/src/views/business/sell/editSell.vue
Normal file
182
web/src/views/business/sell/editSell.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单号" prop="sellNo" class="is-required">
|
||||
<el-input v-model="temp.sellNo" placeholder="订单号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="流水号" prop="serialNo" class="is-required">
|
||||
<el-input v-model="temp.serialNo" placeholder="流水号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员ID" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员名称" prop="memberName" class="is-required">
|
||||
<el-input v-model="temp.memberName" placeholder="会员名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费金额" prop="sellAmount" class="is-required">
|
||||
<el-input v-model="temp.sellAmount" placeholder="消费金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="实际入账" prop="realAmount" class="is-required">
|
||||
<el-input v-model="temp.realAmount" placeholder="实际入账" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1开卡 2续卡 3项目/商品" prop="sellType" class="is-required">
|
||||
<el-input v-model="temp.sellType" placeholder="1开卡 2续卡 3项目/商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="sellStatus" class="is-required">
|
||||
<el-input v-model="temp.sellStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="乐观锁字段" prop="version" class="is-required">
|
||||
<el-input v-model="temp.version" placeholder="乐观锁字段" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="消费后金额" prop="memberCardAfterAmount" class="is-required">
|
||||
<el-input v-model="temp.memberCardAfterAmount" placeholder="消费后金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="" prop="memberCardBeforeAmount" class="is-required">
|
||||
<el-input v-model="temp.memberCardBeforeAmount" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editSell } from "@/api/business/sell/sell";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellId:'',
|
||||
sellNo:'',
|
||||
serialNo:'',
|
||||
memberId:'',
|
||||
memberName:'',
|
||||
sellAmount:'',
|
||||
realAmount:'',
|
||||
sellType:'',
|
||||
sellStatus:'',
|
||||
deleted:'',
|
||||
version:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
memberCardAfterAmount:'',
|
||||
memberCardBeforeAmount:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editSell(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
473
web/src/views/business/sell/sellList.vue
Normal file
473
web/src/views/business/sell/sellList.vue
Normal file
@@ -0,0 +1,473 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
stripe
|
||||
@row-click="handleRowClick"
|
||||
row-key="sellId"
|
||||
ref="multipleTableRef"
|
||||
:expand-row-keys="expandedKeys"
|
||||
>
|
||||
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="scope">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="13">
|
||||
<el-table :data="scope.row.sellDetailList" stripe >
|
||||
<template v-if="scope.row.sellType == 1">
|
||||
<el-table-column>
|
||||
<template slot="header">
|
||||
<div class="info-text" style="text-align: center;">销售详情</div>
|
||||
</template>
|
||||
<el-table-column prop="productName" label="商品名称" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.productName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="count" label="数量" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.count }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="discount" label="折扣" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.discount?scope.row.discount:'-' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="amount" label="金额" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.amount }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="realAmount" label="实际金额" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.realAmount }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="serverList" width="380" label="服务人员信息" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span v-show="scope.row.detailServerList.length == 0">-</span>
|
||||
|
||||
<el-descriptions :column="3" class="server">
|
||||
<template v-for="item in scope.row.detailServerList">
|
||||
<el-descriptions-item label="服务人员">{{item.serverName}}</el-descriptions-item>
|
||||
<el-descriptions-item label="业绩">{{item.serverGrade}}</el-descriptions-item>
|
||||
<el-descriptions-item label="提成">{{item.serverPushMoney}}</el-descriptions-item>
|
||||
</template>
|
||||
</el-descriptions>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</template>
|
||||
|
||||
|
||||
<template v-if="scope.row.sellType == 2 || scope.row.sellType == 3">
|
||||
<el-table-column>
|
||||
<template slot="header">
|
||||
<div class="info-text" style="text-align: center;">充卡详情</div>
|
||||
</template>
|
||||
<el-table-column prop="productName" label="卡名" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.cardName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="amount" label="金额" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.amount }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="realAmount" label="赠送金额" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.giveAmount }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="serverList" width="380" label="服务人员信息" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span v-show="scope.row.detailServerList.length == 0">-</span>
|
||||
|
||||
<el-descriptions :column="3" class="server">
|
||||
<template v-for="item in scope.row.detailServerList">
|
||||
<el-descriptions-item label="服务人员">{{item.serverName}}</el-descriptions-item>
|
||||
<el-descriptions-item label="业绩">{{item.serverGrade}}</el-descriptions-item>
|
||||
<el-descriptions-item label="提成">{{item.serverPushMoney}}</el-descriptions-item>
|
||||
</template>
|
||||
</el-descriptions>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</template>
|
||||
|
||||
|
||||
</el-table>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-table :data="scope.row.sellPayList">
|
||||
<el-table-column>
|
||||
<template slot="header">
|
||||
<div class="info-text" style="text-align: center;">支付方式</div>
|
||||
</template>
|
||||
<el-table-column prop="payName" label="支付名称" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.payName }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="amount" label="支付金额" align="center">
|
||||
<template slot-scope="scope">
|
||||
<div style="text-align: center;">{{ scope.row.amount }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="订单号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="类型"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.sellType == 1">
|
||||
商品
|
||||
</span>
|
||||
|
||||
<span v-if="scope.row.sellType == 2">
|
||||
开卡
|
||||
</span>
|
||||
|
||||
<span v-if="scope.row.sellType == 3">
|
||||
续卡
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员信息"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<div class="info-text">
|
||||
<span>{{ scope.row.memberName?scope.row.memberName:'散客' }}</span><br/>
|
||||
<span v-if="app.isNotEmpty(scope.row.memberCardId)"> {{ scope.row.memberCardName }} ({{scope.row.memberCardNo}})</span>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="消费金额"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span class="price-text"> {{ scope.row.sellAmount }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="实际入账"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span class="price-text">{{ scope.row.realAmount }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-show="scope.row.sellStatus==0" class="info-text">正常</span>
|
||||
<span v-show="scope.row.sellStatus==1" class="price-text">销单</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="消费前金额"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardBeforeAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="消费前赠送金额"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardBeforeGiveAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="消费后金额"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardAfterAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="消费后赠送金额"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardAfterGiveAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="danger"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
销单
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getSellPage,deleteSell,cancelSell} from "@/api/business/sell/sell";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import prompt from "@/utils/prompt";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/sell/addSell";
|
||||
import editForm from "@/views/business/sell/editSell";
|
||||
|
||||
export default {
|
||||
name: 'sell',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
expandedKeys: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleRowClick(row, event, column) {
|
||||
console.log(this.expandedKeys)
|
||||
if (this.expandedKeys.length > 0 && this.expandedKeys[0] == row.sellId) {
|
||||
console.log('我被关闭了')
|
||||
// 关闭之前展开的项
|
||||
this.expandedKeys = []
|
||||
// this.$refs.multipleTableRef.toggleRowExpansion(row, false);
|
||||
}else{
|
||||
this.expandedKeys = [row.sellId];
|
||||
this.$refs.multipleTableRef.toggleRowExpansion(row);
|
||||
}
|
||||
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSellPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要销单吗？销单后余额和库存会发生改变！").then(res=>{
|
||||
if(res){
|
||||
prompt("请输入销单原因").then(res =>{
|
||||
if(res){
|
||||
cancelSell({
|
||||
sellId:scope.row.sellId,
|
||||
remark:res
|
||||
}).then(res => {
|
||||
console.log("销单成功")
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.demo-table-expand {
|
||||
font-size: 0;
|
||||
}
|
||||
.demo-table-expand label {
|
||||
width: 90px;
|
||||
color: #99a9bf;
|
||||
}
|
||||
.demo-table-expand .el-form-item {
|
||||
margin-right: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.el-form-item__label {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/deep/ .el-descriptions__body{
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
|
||||
/deep/ .el-table tr{
|
||||
background: transparent;
|
||||
}
|
||||
</style>
|
||||
191
web/src/views/business/sellDetail/addSellDetail.vue
Normal file
191
web/src/views/business/sellDetail/addSellDetail.vue
Normal file
@@ -0,0 +1,191 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="销售细单id" prop="sellDetailId" class="is-required">
|
||||
<el-input v-model="temp.sellDetailId" placeholder="销售细单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1开卡 2续卡 3项目 4商品" prop="sellType" class="is-required">
|
||||
<el-input v-model="temp.sellType" placeholder="1开卡 2续卡 3项目 4商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员卡id" prop="memberCardId" class="is-required">
|
||||
<el-input v-model="temp.memberCardId" placeholder="会员卡id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品ID" prop="productId" class="is-required">
|
||||
<el-input v-model="temp.productId" placeholder="商品ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名" prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品数量" prop="count" class="is-required">
|
||||
<el-input v-model="temp.count" placeholder="商品数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="折扣" prop="discount" class="is-required">
|
||||
<el-input v-model="temp.discount" placeholder="折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="实际金额" prop="realAmount" class="is-required">
|
||||
<el-input v-model="temp.realAmount" placeholder="实际金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡项ID" prop="cardId" class="is-required">
|
||||
<el-input v-model="temp.cardId" placeholder="卡项ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡名" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="卡名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="赠送金额" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="赠送金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="sellStatus" class="is-required">
|
||||
<el-input v-model="temp.sellStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addSellDetail} from "@/api/business/sellDetail/sellDetail";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellDetailId:'',
|
||||
memberId:'',
|
||||
sellId:'',
|
||||
sellType:'',
|
||||
memberCardId:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:'',
|
||||
discount:'',
|
||||
amount:'',
|
||||
realAmount:'',
|
||||
cardId:'',
|
||||
cardName:'',
|
||||
giveAmount:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
sellStatus:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addSellDetail(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
192
web/src/views/business/sellDetail/editSellDetail.vue
Normal file
192
web/src/views/business/sellDetail/editSellDetail.vue
Normal file
@@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="销售细单id" prop="sellDetailId" class="is-required">
|
||||
<el-input v-model="temp.sellDetailId" placeholder="销售细单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员id" prop="memberId" class="is-required">
|
||||
<el-input v-model="temp.memberId" placeholder="会员id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1开卡 2续卡 3项目 4商品" prop="sellType" class="is-required">
|
||||
<el-input v-model="temp.sellType" placeholder="1开卡 2续卡 3项目 4商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="会员卡id" prop="memberCardId" class="is-required">
|
||||
<el-input v-model="temp.memberCardId" placeholder="会员卡id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品ID" prop="productId" class="is-required">
|
||||
<el-input v-model="temp.productId" placeholder="商品ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名" prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品数量" prop="count" class="is-required">
|
||||
<el-input v-model="temp.count" placeholder="商品数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="折扣" prop="discount" class="is-required">
|
||||
<el-input v-model="temp.discount" placeholder="折扣" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="实际金额" prop="realAmount" class="is-required">
|
||||
<el-input v-model="temp.realAmount" placeholder="实际金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡项ID" prop="cardId" class="is-required">
|
||||
<el-input v-model="temp.cardId" placeholder="卡项ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="卡名" prop="cardName" class="is-required">
|
||||
<el-input v-model="temp.cardName" placeholder="卡名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="赠送金额" prop="giveAmount" class="is-required">
|
||||
<el-input v-model="temp.giveAmount" placeholder="赠送金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1取消" prop="sellStatus" class="is-required">
|
||||
<el-input v-model="temp.sellStatus" placeholder="0正常 1取消" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editSellDetail } from "@/api/business/sellDetail/sellDetail";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellDetailId:'',
|
||||
memberId:'',
|
||||
sellId:'',
|
||||
sellType:'',
|
||||
memberCardId:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:'',
|
||||
discount:'',
|
||||
amount:'',
|
||||
realAmount:'',
|
||||
cardId:'',
|
||||
cardName:'',
|
||||
giveAmount:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
sellStatus:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editSellDetail(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
413
web/src/views/business/sellDetail/sellDetailList.vue
Normal file
413
web/src/views/business/sellDetail/sellDetailList.vue
Normal file
@@ -0,0 +1,413 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="销售细单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellDetailId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="订单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="1开卡 2续卡 3项目 4商品"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="会员卡id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.memberCardId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品ID"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品数量"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.count }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="折扣"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.discount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.amount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="实际金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.realAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡项ID"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="卡名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.cardName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="赠送金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.giveAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1取消"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getSellDetailPage,deleteSellDetail} from "@/api/business/sellDetail/sellDetail";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/sellDetail/addSellDetail";
|
||||
import editForm from "@/views/business/sellDetail/editSellDetail";
|
||||
|
||||
export default {
|
||||
name: 'sellDetail',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSellDetailPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteSellDetail(scope.row.sellDetailId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
91
web/src/views/business/sellJson/addSelljson.vue
Normal file
91
web/src/views/business/sellJson/addSelljson.vue
Normal file
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="" prop="jsonId" class="is-required">
|
||||
<el-input v-model="temp.jsonId" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="获得下订单时的JSON" prop="sellJson" class="is-required">
|
||||
<el-input v-model="temp.sellJson" placeholder="获得下订单时的JSON" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addSelljson} from "@/api/business/sellJson/sellJson";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
jsonId:'',
|
||||
sellId:'',
|
||||
sellJson:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addSelljson(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
92
web/src/views/business/sellJson/editSelljson.vue
Normal file
92
web/src/views/business/sellJson/editSelljson.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="" prop="jsonId" class="is-required">
|
||||
<el-input v-model="temp.jsonId" placeholder="" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="订单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="订单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="获得下订单时的JSON" prop="sellJson" class="is-required">
|
||||
<el-input v-model="temp.sellJson" placeholder="获得下订单时的JSON" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editSelljson } from "@/api/business/sellJson/sellJson";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
jsonId:'',
|
||||
sellId:'',
|
||||
sellJson:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editSelljson(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
213
web/src/views/business/sellJson/sellJsonList.vue
Normal file
213
web/src/views/business/sellJson/sellJsonList.vue
Normal file
@@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label=""
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.jsonId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="订单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="获得下订单时的JSON"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellJson }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getSelljsonPage,deleteSelljson} from "@/api/business/sellJson/sellJson";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/sellJson/addSelljson";
|
||||
import editForm from "@/views/business/sellJson/editSelljson";
|
||||
|
||||
export default {
|
||||
name: 'sellJson',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSelljsonPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteSelljson(scope.row.sellJsonId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
101
web/src/views/business/sellPay/addSellpay.vue
Normal file
101
web/src/views/business/sellPay/addSellpay.vue
Normal file
@@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="支付id" prop="sellPayId" class="is-required">
|
||||
<el-input v-model="temp.sellPayId" placeholder="支付id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="销售单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="销售单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="支付方式名称" prop="payName" class="is-required">
|
||||
<el-input v-model="temp.payName" placeholder="支付方式名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1.卡金 2.扫码 3.现金 888.优惠 " prop="payType" class="is-required">
|
||||
<el-input v-model="temp.payType" placeholder="1.卡金 2.扫码 3.现金 888.优惠 " />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addSellpay} from "@/api/business/sellPay/sellPay";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellPayId:'',
|
||||
sellId:'',
|
||||
payName:'',
|
||||
payType:'',
|
||||
amount:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addSellpay(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
102
web/src/views/business/sellPay/editSellpay.vue
Normal file
102
web/src/views/business/sellPay/editSellpay.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="支付id" prop="sellPayId" class="is-required">
|
||||
<el-input v-model="temp.sellPayId" placeholder="支付id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="销售单id" prop="sellId" class="is-required">
|
||||
<el-input v-model="temp.sellId" placeholder="销售单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="支付方式名称" prop="payName" class="is-required">
|
||||
<el-input v-model="temp.payName" placeholder="支付方式名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="1.卡金 2.扫码 3.现金 888.优惠 " prop="payType" class="is-required">
|
||||
<el-input v-model="temp.payType" placeholder="1.卡金 2.扫码 3.现金 888.优惠 " />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editSellpay } from "@/api/business/sellPay/sellPay";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
sellPayId:'',
|
||||
sellId:'',
|
||||
payName:'',
|
||||
payType:'',
|
||||
amount:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editSellpay(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
233
web/src/views/business/sellPay/sellPayList.vue
Normal file
233
web/src/views/business/sellPay/sellPayList.vue
Normal file
@@ -0,0 +1,233 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="支付id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellPayId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="销售单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.sellId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="支付方式名称"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.payName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="1.卡金 2.扫码 3.现金 888.优惠 "
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.payType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.amount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getSellpayPage,deleteSellpay} from "@/api/business/sellPay/sellPay";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/sellPay/addSellpay";
|
||||
import editForm from "@/views/business/sellPay/editSellpay";
|
||||
|
||||
export default {
|
||||
name: 'sellPay',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getSellpayPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteSellpay(scope.row.sellPayId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
115
web/src/views/business/server/addServer.vue
Normal file
115
web/src/views/business/server/addServer.vue
Normal file
@@ -0,0 +1,115 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="工号" prop="serverNo" class="is-required">
|
||||
<el-input v-model="temp.serverNo" placeholder="工号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员名称" prop="serverName" class="is-required">
|
||||
<el-input v-model="temp.serverName" placeholder="服务人员名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员手机号" prop="serverPhone" class="is-required">
|
||||
<el-input v-model="temp.serverPhone" placeholder="服务人员手机号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="入职时间" prop="joinTime" class="is-required">
|
||||
<el-date-picker
|
||||
v-model="temp.joinTime"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="小程序密码" prop="miniappPassword" class="is-required">
|
||||
<el-input v-model="temp.miniappPassword" placeholder="小程序密码-" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addServer} from "@/api/business/server/server";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
serverId:'',
|
||||
serverNo:'',
|
||||
serverName:'',
|
||||
serverPhone:'',
|
||||
joinTime:'',
|
||||
miniappPassword:'',
|
||||
deleted:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addServer(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
117
web/src/views/business/server/editServer.vue
Normal file
117
web/src/views/business/server/editServer.vue
Normal file
@@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="工号" prop="serverNo" class="is-required">
|
||||
<el-input v-model="temp.serverNo" placeholder="工号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员名称" prop="serverName" class="is-required">
|
||||
<el-input v-model="temp.serverName" placeholder="服务人员名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="服务人员手机号" prop="serverPhone" class="is-required">
|
||||
<el-input v-model="temp.serverPhone" placeholder="服务人员手机号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="入职时间" prop="joinTime" class="is-required">
|
||||
<el-input v-model="temp.joinTime" placeholder="入职时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="小程序密码-" prop="miniappPassword" class="is-required">
|
||||
<el-input v-model="temp.miniappPassword" placeholder="小程序密码-" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editServer } from "@/api/business/server/server";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
serverId:'',
|
||||
serverNo:'',
|
||||
serverName:'',
|
||||
serverPhone:'',
|
||||
joinTime:'',
|
||||
miniappPassword:'',
|
||||
deleted:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editServer(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
254
web/src/views/business/server/serverList.vue
Normal file
254
web/src/views/business/server/serverList.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="工号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员名称"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="服务人员手机号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.serverPhone }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="入职时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.joinTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getServerPage,deleteServer} from "@/api/business/server/server";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/server/addServer";
|
||||
import editForm from "@/views/business/server/editServer";
|
||||
|
||||
export default {
|
||||
name: 'serverList',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getServerPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteServer(scope.row.serverId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
228
web/src/views/business/stock/addStock.vue
Normal file
228
web/src/views/business/stock/addStock.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="30%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-alert
|
||||
title="基本信息"
|
||||
type="info"
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
<div style="padding-top: 10px;">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="入库门店" style="wdith:100%;" prop="deptName" class="is-required">
|
||||
{{temp.deptName}}
|
||||
</el-form-item>
|
||||
<el-form-item label="入库方式" prop="stockInType" class="is-required">
|
||||
<el-select style="wdith:100%;" v-model="temp.stockInType" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark" >
|
||||
<el-input type="textarea" v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-alert
|
||||
title="入库商品"
|
||||
type="info"
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
<div style="width: 100%;padding-top: 10px">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-circle-plus-outline el-icon-size" @click="chooseProduct(scope.$index)" ></i>
|
||||
<i class="el-icon-delete el-icon-size" @click="deleteCon(scope.$index)" ></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="productName"
|
||||
label="商品名"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="count"
|
||||
label="数量">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
:key="scope.row.id"
|
||||
class="product-count"
|
||||
v-model="scope.row.count"
|
||||
@keyup.native="app.clearNoNum"
|
||||
placeholder="请输入数量"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<choose-product ref="chooseProductRef" @ok="getCheckedProducts"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addStock} from "@/api/business/stock/stock";
|
||||
import {setRequiredFields,isEmpty,accAdd,error,clearNoNum,getLoginUser} from "@/utils";
|
||||
import ChooseProduct from "@/views/business/stock/chooseProduct";
|
||||
const requiredFields = ['inStockType']
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: {ChooseProduct},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
options: [{
|
||||
value: 1,
|
||||
label: '采购入库'
|
||||
}, {
|
||||
value: 2,
|
||||
label: '其他入库'
|
||||
}],
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
remark:'',
|
||||
deptName:'',
|
||||
StockType: 1,
|
||||
},
|
||||
tableData: [{
|
||||
productNo:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:0,
|
||||
categoryName:'',
|
||||
amount:'',
|
||||
}],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deleteCon(index){
|
||||
if(this.tableData.length==1){
|
||||
this.tableData = this.$options.data().tableData
|
||||
}else{
|
||||
this.tableData.splice(index,1)
|
||||
}
|
||||
},
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
const loginUser = getLoginUser()
|
||||
this.temp.deptName = loginUser.deptName
|
||||
},
|
||||
getCheckedProducts(list){
|
||||
console.log('getCheckedProducts' + list)
|
||||
if(this.tableData.length==1&&isEmpty(this.tableData[0].name)){
|
||||
let obj = list[0];
|
||||
this.tableData[0] = {
|
||||
productId:obj.productId,
|
||||
productName:obj.productName,
|
||||
categoryName:obj.categoryName,
|
||||
amount:obj.amount,
|
||||
count:0,
|
||||
}
|
||||
list.splice(0,1);
|
||||
}
|
||||
|
||||
test:for(let i=list.length-1;i>=0;i--){
|
||||
let obj = list[i];
|
||||
for(let item of this.tableData){
|
||||
if(item.productId==obj.productId){
|
||||
item.count = accAdd(item.count,1);
|
||||
list.splice(i,1); //执行后aa.length会减一
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
let tableData = list.map(obj=>{
|
||||
return {
|
||||
productNo:obj.productNo,
|
||||
productId:obj.productId,
|
||||
productName:obj.productName,
|
||||
categoryName:obj.categoryName,
|
||||
amount:obj.amount,
|
||||
count:0,
|
||||
}
|
||||
})
|
||||
this.tableData = this.tableData.concat(tableData);
|
||||
},
|
||||
chooseProduct(){
|
||||
this.$refs.chooseProductRef.open()
|
||||
},
|
||||
submit() {
|
||||
if(this.tableData.length==0|isEmpty(this.tableData[0].productId)){
|
||||
error('请完善商品信息！');
|
||||
return false;
|
||||
}
|
||||
for(let item of this.tableData){
|
||||
if(item.count==0){
|
||||
error('请输入正确的数量！');
|
||||
return false;
|
||||
}
|
||||
}
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.temp.productList = this.tableData
|
||||
addStock(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.tableData = this.$options.data().tableData
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
onInput(){
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-icon-size{
|
||||
font-size: 24px;
|
||||
margin-left: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.product-count /deep/ input{
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
228
web/src/views/business/stock/addStockOut.vue
Normal file
228
web/src/views/business/stock/addStockOut.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="30%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-alert
|
||||
title="基本信息"
|
||||
type="info"
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
<div style="padding-top: 10px;">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="出库门店" style="wdith:100%;" prop="deptName" class="is-required">
|
||||
{{temp.deptName}}
|
||||
</el-form-item>
|
||||
<el-form-item label="出库方式" prop="stockInType" class="is-required">
|
||||
<el-select style="wdith:100%;" v-model="temp.stockInType" placeholder="请选择">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark" >
|
||||
<el-input type="textarea" v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-alert
|
||||
title="出库商品"
|
||||
type="info"
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
<div style="width: 100%;padding-top: 10px">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="120">
|
||||
<template slot-scope="scope">
|
||||
<i class="el-icon-circle-plus-outline el-icon-size" @click="chooseProduct(scope.$index)" ></i>
|
||||
<i class="el-icon-delete el-icon-size" @click="deleteCon(scope.$index)" ></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="productName"
|
||||
label="商品名"
|
||||
width="180">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
prop="count"
|
||||
label="数量">
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
:key="scope.row.id"
|
||||
class="product-count"
|
||||
v-model="scope.row.count"
|
||||
@keyup.native="app.clearNoNum"
|
||||
placeholder="请输入数量"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<choose-product ref="chooseProductRef" @ok="getCheckedProducts"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addStock} from "@/api/business/stock/stock";
|
||||
import {setRequiredFields,isEmpty,accAdd,error,clearNoNum,getLoginUser} from "@/utils";
|
||||
import ChooseProduct from "@/views/business/stock/chooseProduct";
|
||||
const requiredFields = ['inStockType']
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: {ChooseProduct},
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
options: [{
|
||||
value: 1,
|
||||
label: '损耗出库'
|
||||
}, {
|
||||
value: 2,
|
||||
label: '其他出库'
|
||||
}],
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
remark:'',
|
||||
deptName:'',
|
||||
StockType: 1,
|
||||
},
|
||||
tableData: [{
|
||||
productNo:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:0,
|
||||
categoryName:'',
|
||||
amount:'',
|
||||
}],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
deleteCon(index){
|
||||
if(this.tableData.length==1){
|
||||
this.tableData = this.$options.data().tableData
|
||||
}else{
|
||||
this.tableData.splice(index,1)
|
||||
}
|
||||
},
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
const loginUser = getLoginUser()
|
||||
this.temp.deptName = loginUser.deptName
|
||||
},
|
||||
getCheckedProducts(list){
|
||||
console.log('getCheckedProducts' + list)
|
||||
if(this.tableData.length==1&&isEmpty(this.tableData[0].name)){
|
||||
let obj = list[0];
|
||||
this.tableData[0] = {
|
||||
productId:obj.productId,
|
||||
productName:obj.productName,
|
||||
categoryName:obj.categoryName,
|
||||
amount:obj.amount,
|
||||
count:0,
|
||||
}
|
||||
list.splice(0,1);
|
||||
}
|
||||
|
||||
test:for(let i=list.length-1;i>=0;i--){
|
||||
let obj = list[i];
|
||||
for(let item of this.tableData){
|
||||
if(item.productId==obj.productId){
|
||||
item.count = accAdd(item.count,1);
|
||||
list.splice(i,1); //执行后aa.length会减一
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
let tableData = list.map(obj=>{
|
||||
return {
|
||||
productNo:obj.productNo,
|
||||
productId:obj.productId,
|
||||
productName:obj.productName,
|
||||
categoryName:obj.categoryName,
|
||||
amount:obj.amount,
|
||||
count:0,
|
||||
}
|
||||
})
|
||||
this.tableData = this.tableData.concat(tableData);
|
||||
},
|
||||
chooseProduct(){
|
||||
this.$refs.chooseProductRef.open()
|
||||
},
|
||||
submit() {
|
||||
if(this.tableData.length==0|isEmpty(this.tableData[0].productId)){
|
||||
error('请完善商品信息！');
|
||||
return false;
|
||||
}
|
||||
for(let item of this.tableData){
|
||||
if(item.count==0){
|
||||
error('请输入正确的数量！');
|
||||
return false;
|
||||
}
|
||||
}
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.temp.productList = this.tableData
|
||||
addStockOut(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.tableData = this.$options.data().tableData
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
},
|
||||
onInput(){
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-icon-size{
|
||||
font-size: 24px;
|
||||
margin-left: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.product-count /deep/ input{
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
53
web/src/views/business/stock/chooseProduct.vue
Normal file
53
web/src/views/business/stock/chooseProduct.vue
Normal file
@@ -0,0 +1,53 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
append-to-body
|
||||
top="2vh"
|
||||
width="80%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:80vh">
|
||||
<product-list @ok="getCheckedProducts"/>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Product from "@/views/business/product/productList";
|
||||
import ProductList from "@/views/business/stock/productList";
|
||||
export default {
|
||||
name: "chooseProduct",
|
||||
components: {ProductList, Product},
|
||||
props: {
|
||||
sellList: Array,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
temp:{}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
getCheckedProducts(productList){
|
||||
console.log(productList)
|
||||
this.$emit('ok', productList)
|
||||
this.handleCancel()
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
},
|
||||
submit(){
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
182
web/src/views/business/stock/editStock.vue
Normal file
182
web/src/views/business/stock/editStock.vue
Normal file
@@ -0,0 +1,182 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="库存单id" prop="stockId" class="is-required">
|
||||
<el-input v-model="temp.stockId" placeholder="库存单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存单表头" prop="stockTitle" class="is-required">
|
||||
<el-input v-model="temp.stockTitle" placeholder="库存单表头" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存单编号" prop="stockNo" class="is-required">
|
||||
<el-input v-model="temp.stockNo" placeholder="库存单编号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1审核完毕 2取消" prop="stockStatus" class="is-required">
|
||||
<el-input v-model="temp.stockStatus" placeholder="0正常 1审核完毕 2取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店id" prop="shopId" class="is-required">
|
||||
<el-input v-model="temp.shopId" placeholder="门店id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="门店名" prop="shopName" class="is-required">
|
||||
<el-input v-model="temp.shopName" placeholder="门店名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人id" prop="updateId" class="is-required">
|
||||
<el-input v-model="temp.updateId" placeholder="修改人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="审核人ID" prop="checkId" class="is-required">
|
||||
<el-input v-model="temp.checkId" placeholder="审核人ID" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="审核人姓名" prop="checkName" class="is-required">
|
||||
<el-input v-model="temp.checkName" placeholder="审核人姓名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="审核时间" prop="checkTime" class="is-required">
|
||||
<el-input v-model="temp.checkTime" placeholder="审核时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="类型 1入库 2出库" prop="stockType" class="is-required">
|
||||
<el-input v-model="temp.stockType" placeholder="类型 1入库 2出库" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="stockMoney" class="is-required">
|
||||
<el-input v-model="temp.stockMoney" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="入库类型" prop="stockInType" class="is-required">
|
||||
<el-input v-model="temp.stockInType" placeholder="入库类型" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="出库类型" prop="stockOutType" class="is-required">
|
||||
<el-input v-model="temp.stockOutType" placeholder="出库类型" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="乐观锁字段" prop="version" class="is-required">
|
||||
<el-input v-model="temp.version" placeholder="乐观锁字段" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1删除" prop="deleted" class="is-required">
|
||||
<el-input v-model="temp.deleted" placeholder="0正常 1删除" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editStock } from "@/api/business/stock/stock";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
stockId:'',
|
||||
stockTitle:'',
|
||||
stockNo:'',
|
||||
stockStatus:'',
|
||||
shopId:'',
|
||||
shopName:'',
|
||||
createName:'',
|
||||
createTime:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
updateId:'',
|
||||
checkId:'',
|
||||
checkName:'',
|
||||
checkTime:'',
|
||||
stockType:'',
|
||||
stockMoney:'',
|
||||
stockInType:'',
|
||||
stockOutType:'',
|
||||
version:'',
|
||||
deleted:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editStock(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
426
web/src/views/business/stock/productList.vue
Normal file
426
web/src/views/business/stock/productList.vue
Normal file
@@ -0,0 +1,426 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container" style="margin-bottom: 10px;">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-row :gutter="24" class="row-container">
|
||||
<el-col :span="4" style="height: 100%;">
|
||||
<el-tree
|
||||
default-expand-all
|
||||
:data="categoryList"
|
||||
node-key="categoryId"
|
||||
:props="defaultProps"
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }">
|
||||
<span :class="listQuery.categoryId==data.categoryId?'info-text':''" > {{ node.label }}</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-col>
|
||||
<el-col :span="20" style="height: 100%;">
|
||||
<el-table
|
||||
ref="productTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="80%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
@selection-change="getSelection"
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
align="center"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="分类名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.categoryName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品会员金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productMemberAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品图片"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<img v-if="scope.row.productImage" :src=" baseUrl + scope.row.productImageUrl" class="avatar" style="width: 40px;height: 40px;">
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存数量"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productCount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pushAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="提成比例"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.pushPercent }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1下架"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店名"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
v-hasPerms="'product:del'"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<div class="div-border" style="height: 29%;margin-top:15px;">
|
||||
<el-alert
|
||||
type="warning"
|
||||
:closable="false">
|
||||
<template slot="title">
|
||||
已选择的条目：{{productList.length}}个
|
||||
<el-button style="margin-left: 15px;"
|
||||
@click="chooseDone"
|
||||
icon="el-icon-check"
|
||||
type="danger">选好了</el-button>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<div class="tag-view">
|
||||
<el-tag
|
||||
v-for="(tag,index) in productList"
|
||||
:key="tag.productId"
|
||||
closable
|
||||
effect="dark"
|
||||
@close="handleClose(tag,index)"
|
||||
>
|
||||
{{tag.productName}}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCategoryList} from "@/api/business/category/category";
|
||||
import {getProductPage,deleteProduct} from "@/api/business/product/product";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/product/addProduct";
|
||||
import editForm from "@/views/business/product/editProduct";
|
||||
|
||||
export default {
|
||||
name: 'productList',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
categoryId: '',
|
||||
keyword: '',
|
||||
stockControl:1
|
||||
},
|
||||
defaultProps: {
|
||||
id: 'categoryId',
|
||||
label: 'categoryName',
|
||||
},
|
||||
temp: {},
|
||||
categoryList: [],
|
||||
productList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
this.getCategoryList()
|
||||
},
|
||||
methods: {
|
||||
handleClose(tag,index){
|
||||
this.productList.splice(index,1);
|
||||
//取消选中状态
|
||||
this.$refs.productTable.toggleRowSelection(tag, false);
|
||||
},
|
||||
getCategoryList(){
|
||||
getCategoryList().then(res => {
|
||||
this.categoryList = res.data
|
||||
})
|
||||
},
|
||||
chooseDone(){
|
||||
if(this.productList.length==0){
|
||||
error('还没有选择商品')
|
||||
return false
|
||||
}
|
||||
this.$emit('ok', this.productList)
|
||||
|
||||
const table = this.$refs.productTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
|
||||
},
|
||||
handleRowClick(row) {
|
||||
let obj = row
|
||||
this.$refs.productTable.toggleRowSelection(row)
|
||||
},
|
||||
getSelection(e){
|
||||
this.productList = e
|
||||
},
|
||||
handleNodeClick(e){
|
||||
this.listQuery.categoryId = e.categoryId
|
||||
this.fetchData()
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getProductPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open(this.listQuery.categoryId)
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteProduct(scope.row.productId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tag-view /deep/ .el-tag {
|
||||
margin: 10px;
|
||||
}
|
||||
</style>
|
||||
281
web/src/views/business/stock/stockList.vue
Normal file
281
web/src/views/business/stock/stockList.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
row-key="stockId"
|
||||
ref="stockTableRef"
|
||||
:expand-row-keys="expandedKeys"
|
||||
>
|
||||
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="scope">
|
||||
<el-table :data="scope.row.stockDetailVos" border>
|
||||
<el-table-column
|
||||
label="商品名称"
|
||||
prop="detailField1"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="detailScope">
|
||||
{{ detailScope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="入库数量"
|
||||
prop="detailField2"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="detailScope">
|
||||
{{ detailScope.row.count }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 可以根据实际的 stockDetailVos 中的属性继续添加更多列 -->
|
||||
</el-table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存单编号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存单标题"
|
||||
width="300"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockTitle }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="入库类型"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.stockInType==1">采购入库</span>
|
||||
<span v-if="scope.row.stockInType==2">其他入库</span>
|
||||
<span v-if="scope.row.stockInType==3">销单返回入库</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- <el-table-column-->
|
||||
<!-- fixed="right"-->
|
||||
<!-- label="操作"-->
|
||||
<!-- width="200"-->
|
||||
<!-- align="center"-->
|
||||
<!-- >-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- <el-button-group>-->
|
||||
<!-- <el-button-->
|
||||
<!-- type="primary"-->
|
||||
<!-- icon="el-icon-edit"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="edit(scope)"-->
|
||||
<!-- >-->
|
||||
<!-- 修改-->
|
||||
<!-- </el-button>-->
|
||||
<!-- <el-button-->
|
||||
<!-- type="danger"-->
|
||||
<!-- icon="el-icon-delete"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="del(scope)"-->
|
||||
<!-- >-->
|
||||
<!-- 删除-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </el-button-group>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getStockPage,deleteStock} from "@/api/business/stock/stock";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/stock/addStock";
|
||||
import editForm from "@/views/business/stock/editStock";
|
||||
|
||||
export default {
|
||||
name: 'stock',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: '',
|
||||
stockType: 1
|
||||
},
|
||||
temp: {},
|
||||
expandedKeys: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleRowClick(row, event, column) {
|
||||
if (this.expandedKeys.length > 0 && this.expandedKeys[0] === row.stockId) {
|
||||
this.expandedKeys = [];
|
||||
} else {
|
||||
this.expandedKeys = [row.stockId];
|
||||
}
|
||||
this.$refs.stockTableRef.toggleRowExpansion(row);
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getStockPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteStock(scope.row.stockId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
281
web/src/views/business/stock/stockOutList.vue
Normal file
281
web/src/views/business/stock/stockOutList.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
row-key="stockId"
|
||||
ref="stockTableRef"
|
||||
:expand-row-keys="expandedKeys"
|
||||
>
|
||||
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="scope">
|
||||
<el-table :data="scope.row.stockDetailVos" border>
|
||||
<el-table-column
|
||||
label="商品名称"
|
||||
prop="detailField1"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="detailScope">
|
||||
{{ detailScope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="出库数量"
|
||||
prop="detailField2"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="detailScope">
|
||||
{{ detailScope.row.count }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 可以根据实际的 stockDetailVos 中的属性继续添加更多列 -->
|
||||
</el-table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存单编号"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存单标题"
|
||||
width="300"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockTitle }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="门店"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.shopName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="出库类型"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-if="scope.row.stockOutType==1">损耗出库</span>
|
||||
<span v-if="scope.row.stockOutType==2">其他出库</span>
|
||||
<span v-if="scope.row.stockOutType==3">使用出库</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<!-- <el-table-column-->
|
||||
<!-- fixed="right"-->
|
||||
<!-- label="操作"-->
|
||||
<!-- width="200"-->
|
||||
<!-- align="center"-->
|
||||
<!-- >-->
|
||||
<!-- <template slot-scope="scope">-->
|
||||
<!-- <el-button-group>-->
|
||||
<!-- <el-button-->
|
||||
<!-- type="primary"-->
|
||||
<!-- icon="el-icon-edit"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="edit(scope)"-->
|
||||
<!-- >-->
|
||||
<!-- 修改-->
|
||||
<!-- </el-button>-->
|
||||
<!-- <el-button-->
|
||||
<!-- type="danger"-->
|
||||
<!-- icon="el-icon-delete"-->
|
||||
<!-- size="mini"-->
|
||||
<!-- @click="del(scope)"-->
|
||||
<!-- >-->
|
||||
<!-- 删除-->
|
||||
<!-- </el-button>-->
|
||||
<!-- </el-button-group>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getStockPage,deleteStock} from "@/api/business/stock/stock";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/stock/addStockOut";
|
||||
import editForm from "@/views/business/stock/editStock";
|
||||
|
||||
export default {
|
||||
name: 'stock',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: '',
|
||||
stockType: 2
|
||||
},
|
||||
temp: {},
|
||||
expandedKeys: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
handleRowClick(row, event, column) {
|
||||
if (this.expandedKeys.length > 0 && this.expandedKeys[0] === row.stockId) {
|
||||
this.expandedKeys = [];
|
||||
} else {
|
||||
this.expandedKeys = [row.stockId];
|
||||
}
|
||||
this.$refs.stockTableRef.toggleRowExpansion(row);
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getStockPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteStock(scope.row.stockId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
121
web/src/views/business/stockDetail/addStockDetail.vue
Normal file
121
web/src/views/business/stockDetail/addStockDetail.vue
Normal file
@@ -0,0 +1,121 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="库存详情id" prop="stockDetailId" class="is-required">
|
||||
<el-input v-model="temp.stockDetailId" placeholder="库存详情id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存单id" prop="stockId" class="is-required">
|
||||
<el-input v-model="temp.stockId" placeholder="库存单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品" prop="productId" class="is-required">
|
||||
<el-input v-model="temp.productId" placeholder="商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名 " prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名 " />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存数量" prop="count" class="is-required">
|
||||
<el-input v-model="temp.count" placeholder="库存数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1审核完毕 2取消" prop="stockStatus" class="is-required">
|
||||
<el-input v-model="temp.stockStatus" placeholder="0正常 1审核完毕 2取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="类型 1入库 2出库" prop="stockType" class="is-required">
|
||||
<el-input v-model="temp.stockType" placeholder="类型 1入库 2出库" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addStockDetail} from "@/api/business/stockDetail/stockDetail";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
stockDetailId:'',
|
||||
stockId:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:'',
|
||||
stockStatus:'',
|
||||
stockType:'',
|
||||
amount:'',
|
||||
createTime:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addStockDetail(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
122
web/src/views/business/stockDetail/editStockDetail.vue
Normal file
122
web/src/views/business/stockDetail/editStockDetail.vue
Normal file
@@ -0,0 +1,122 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="库存详情id" prop="stockDetailId" class="is-required">
|
||||
<el-input v-model="temp.stockDetailId" placeholder="库存详情id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存单id" prop="stockId" class="is-required">
|
||||
<el-input v-model="temp.stockId" placeholder="库存单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品" prop="productId" class="is-required">
|
||||
<el-input v-model="temp.productId" placeholder="商品" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="商品名 " prop="productName" class="is-required">
|
||||
<el-input v-model="temp.productName" placeholder="商品名 " />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="库存数量" prop="count" class="is-required">
|
||||
<el-input v-model="temp.count" placeholder="库存数量" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="0正常 1审核完毕 2取消" prop="stockStatus" class="is-required">
|
||||
<el-input v-model="temp.stockStatus" placeholder="0正常 1审核完毕 2取消" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="类型 1入库 2出库" prop="stockType" class="is-required">
|
||||
<el-input v-model="temp.stockType" placeholder="类型 1入库 2出库" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="金额" prop="amount" class="is-required">
|
||||
<el-input v-model="temp.amount" placeholder="金额" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editStockDetail } from "@/api/business/stockDetail/stockDetail";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
stockDetailId:'',
|
||||
stockId:'',
|
||||
productId:'',
|
||||
productName:'',
|
||||
count:'',
|
||||
stockStatus:'',
|
||||
stockType:'',
|
||||
amount:'',
|
||||
createTime:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editStockDetail(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
273
web/src/views/business/stockDetail/stockDetailList.vue
Normal file
273
web/src/views/business/stockDetail/stockDetailList.vue
Normal file
@@ -0,0 +1,273 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="库存详情id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockDetailId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存单id"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="商品名 "
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.productName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="库存数量"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.count }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="0正常 1审核完毕 2取消"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockStatus }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="类型 1入库 2出库"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.stockType }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="金额"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.amount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getStockDetailPage,deleteStockDetail} from "@/api/business/stockDetail/stockDetail";
|
||||
import {deepClone,success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/stockDetail/addStockDetail";
|
||||
import editForm from "@/views/business/stockDetail/editStockDetail";
|
||||
|
||||
export default {
|
||||
name: 'stockDetail',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getStockDetailPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteStockDetail(scope.row.stockDetailId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
207
web/src/views/common/TestChooseRadioList.vue
Normal file
207
web/src/views/common/TestChooseRadioList.vue
Normal file
@@ -0,0 +1,207 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container" style="margin-bottom: 10px;">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<el-row :gutter="24" class="row-container">
|
||||
|
||||
<el-table
|
||||
ref="chooseTable"
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="80%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
@row-click="handleRowClick"
|
||||
@selection-change="getSelection"
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
align="center"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<div class="div-border" style="height: 29%;margin-top:15px;">
|
||||
<el-alert
|
||||
type="warning"
|
||||
:closable="false">
|
||||
<template slot="title">
|
||||
已选择的条目：{{chooseList.length}}个
|
||||
<el-button style="margin-left: 15px;"
|
||||
@click="chooseDone"
|
||||
icon="el-icon-check"
|
||||
type="danger">选好了</el-button>
|
||||
</template>
|
||||
</el-alert>
|
||||
|
||||
<div class="tag-view">
|
||||
<el-tag
|
||||
v-for="(tag,index) in chooseList"
|
||||
:key="tag.serverId"
|
||||
closable
|
||||
effect="dark"
|
||||
@close="handleClose(tag,index)"
|
||||
>
|
||||
{{tag.serverName}}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getServerPage,deleteServer} from "@/api/business/server/server";
|
||||
import {deepClone, error, success} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/business/server/addServer";
|
||||
import editForm from "@/views/business/server/editServer";
|
||||
|
||||
export default {
|
||||
name: 'serverList',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
chooseList:[]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
getSelection(e){
|
||||
this.chooseList = e
|
||||
},
|
||||
chooseDone(){
|
||||
if(this.chooseList.length==0){
|
||||
error('还没有选择订单')
|
||||
return false
|
||||
}
|
||||
this.$emit('ok', this.chooseList[0])
|
||||
|
||||
const table = this.$refs.chooseTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
},
|
||||
handleRowClick(row) {
|
||||
//先删除所选中的 只选当前行
|
||||
const table = this.$refs.chooseTable;
|
||||
const rows = table.store.states.data; // 获取表格所有行的数据（不同组件获取方式可能不同）
|
||||
rows.forEach(row => {
|
||||
table.toggleRowSelection(row, false); // 调用toggleRowSelection方法，第二个参数传false表示取消选中
|
||||
});
|
||||
|
||||
this.$refs.chooseTable.toggleRowSelection(row)
|
||||
},
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getServerPage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteServer(scope.row.serverId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
51
web/src/views/common/TestDialog.vue
Normal file
51
web/src/views/common/TestDialog.vue
Normal file
@@ -0,0 +1,51 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
append-to-body
|
||||
top="5vh"
|
||||
width="80%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:80vh">
|
||||
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<slot name="button2"></slot>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "DialogRemark",
|
||||
props: {
|
||||
sellList: Array,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
temp:{}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
},
|
||||
submit(){
|
||||
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
254
web/src/views/common/XCropper.vue
Normal file
254
web/src/views/common/XCropper.vue
Normal file
@@ -0,0 +1,254 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
title="图片剪裁"
|
||||
:visible.sync="dialogVisiblex"
|
||||
:close-on-press-escape="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
width="1000px"
|
||||
>
|
||||
<div class="cropper-content">
|
||||
<div class="cropper" style="text-align:center">
|
||||
<vueCropper
|
||||
ref="cropper"
|
||||
:img="option.img"
|
||||
:outputSize="option.outputSize"
|
||||
:outputType="option.outputType"
|
||||
:info="option.info"
|
||||
:canScale="option.canScale"
|
||||
:autoCrop="option.autoCrop"
|
||||
:autoCropWidth="option.autoCropWidth"
|
||||
:autoCropHeight="option.autoCropHeight"
|
||||
:fixedBox="option.fixedBox"
|
||||
:fixed="option.fixed"
|
||||
:fixedNumber="option.fixedNumber"
|
||||
:canMove="option.canMove"
|
||||
:canMoveBox="option.canMoveBox"
|
||||
:original="option.original"
|
||||
:centerBox="option.centerBox"
|
||||
:infoTrue="option.infoTrue"
|
||||
:full="option.full"
|
||||
:enlarge="option.enlarge"
|
||||
:mode="option.mode"
|
||||
>
|
||||
</vueCropper>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer class="dialog-footer">
|
||||
<el-button @click="dialogVisiblex = false">取消</el-button>
|
||||
<el-button type="primary" @click="finish" :loading="loading"
|
||||
>确认</el-button
|
||||
>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VueCropper from "vue-cropper/src/vue-cropper.vue"
|
||||
|
||||
export default {
|
||||
components: {VueCropper},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
dialogVisiblex: false,
|
||||
loading: false,
|
||||
option: {
|
||||
img: '', // 裁剪图片的地址 url 地址, base64, blob
|
||||
outputSize: 1, // 裁剪生成图片的质量
|
||||
outputType: 'png', // 裁剪生成图片的格式 jpeg, png, webp
|
||||
info: true, // 裁剪框的大小信息
|
||||
canScale: true, // 图片是否允许滚轮缩放
|
||||
autoCrop: true, // 是否默认生成截图框
|
||||
autoCropWidth: 345, // 默认生成截图框宽度
|
||||
autoCropHeight: 245, // 默认生成截图框高度
|
||||
fixedBox: true, // 固定截图框大小 不允许改变
|
||||
fixed: true, // 是否开启截图框宽高固定比例
|
||||
fixedNumber: [1, 1], // 截图框的宽高比例 [ 宽度 , 高度 ]
|
||||
canMove: true, // 上传图片是否可以移动
|
||||
canMoveBox: true, // 截图框能否拖动
|
||||
original: false, // 上传图片按照原始比例渲染
|
||||
centerBox: true, // 截图框是否被限制在图片里面
|
||||
infoTrue: true, // true 为展示真实输出图片宽高 false 展示看到的截图框宽高
|
||||
full: true, // 是否输出原图比例的截图
|
||||
enlarge: '1', // 图片根据截图框输出比例倍数
|
||||
mode: 'contain' // 图片默认渲染方式 contain , cover, 100px, 100% auto
|
||||
},
|
||||
unimgurl: '',
|
||||
success: () => {} // 回调方法
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {},
|
||||
activated() {},
|
||||
methods: {
|
||||
showModal(obj) {
|
||||
|
||||
console.log(obj)
|
||||
if (obj.img) {
|
||||
this.option.img = obj.img
|
||||
}
|
||||
//裁剪生成图片的质量
|
||||
if (obj.outputSize) {
|
||||
this.option.outputSize = obj.outputSize
|
||||
} else {
|
||||
this.option.outputSize = 1
|
||||
}
|
||||
//裁剪生成图片的格式
|
||||
if (obj.outputType) {
|
||||
this.option.outputType = obj.outputType
|
||||
} else {
|
||||
this.option.outputType = 'png'
|
||||
}
|
||||
//裁剪框的大小信息
|
||||
if (obj.info) {
|
||||
this.option.info = obj.info
|
||||
} else {
|
||||
this.option.info = true
|
||||
}
|
||||
//图片是否允许滚轮缩放
|
||||
if (obj.canScale) {
|
||||
this.option.canScale = obj.canScale
|
||||
} else {
|
||||
this.option.canScale = true
|
||||
}
|
||||
//是否默认生成截图框
|
||||
if (obj.autoCrop) {
|
||||
this.option.autoCrop = obj.autoCrop
|
||||
} else {
|
||||
this.option.autoCrop = true
|
||||
}
|
||||
//默认生成截图框宽度
|
||||
if (obj.autoCropWidth) {
|
||||
this.option.autoCropWidth = obj.autoCropWidth
|
||||
} else {
|
||||
this.option.autoCropWidth = 375
|
||||
}
|
||||
//默认生成截图框高度
|
||||
if (obj.autoCropHeight) {
|
||||
this.option.autoCropHeight = obj.autoCropHeight
|
||||
} else {
|
||||
this.option.autoCropHeight = 245
|
||||
}
|
||||
//固定截图框大小 不允许改变
|
||||
if (obj.fixedBox) {
|
||||
this.option.fixedBox = obj.fixedBox
|
||||
} else {
|
||||
this.option.fixedBox = false
|
||||
}
|
||||
//是否开启截图框宽高固定比例
|
||||
if (obj.fixed) {
|
||||
this.option.fixed = obj.fixed
|
||||
} else {
|
||||
this.option.fixed = true
|
||||
}
|
||||
//截图框的宽高比例
|
||||
if (obj.fixedNumber) {
|
||||
this.option.fixedNumber = obj.fixedNumber
|
||||
} else {
|
||||
this.option.fixedNumber = [this.option.autoCropWidth, this.option.autoCropHeight]
|
||||
}
|
||||
//上传图片是否可以移动
|
||||
if (obj.canMove) {
|
||||
this.option.canMove = obj.canMove
|
||||
} else {
|
||||
this.option.canMove = true
|
||||
}
|
||||
//截图框能否拖动
|
||||
if (obj.canMoveBox) {
|
||||
this.option.canMoveBox = obj.canMoveBox
|
||||
} else {
|
||||
this.option.canMoveBox = true
|
||||
}
|
||||
//上传图片按照原始比例渲染
|
||||
if (obj.original) {
|
||||
this.option.original = obj.original
|
||||
} else {
|
||||
this.option.original = false
|
||||
}
|
||||
//截图框是否被限制在图片里面
|
||||
if (obj.centerBox) {
|
||||
this.option.centerBox = obj.centerBox
|
||||
} else {
|
||||
this.option.centerBox = true
|
||||
}
|
||||
//true 为展示真实输出图片宽高 false 展示看到的截图框宽高
|
||||
if (obj.infoTrue) {
|
||||
this.option.infoTrue = obj.infoTrue
|
||||
} else {
|
||||
this.option.infoTrue = true
|
||||
}
|
||||
//是否输出原图比例的截图
|
||||
if (obj.full) {
|
||||
this.option.full = obj.full
|
||||
} else {
|
||||
this.option.full = true
|
||||
}
|
||||
//图片根据截图框输出比例倍数
|
||||
if (obj.enlarge) {
|
||||
this.option.enlarge = obj.enlarge
|
||||
} else {
|
||||
this.option.enlarge = '1'
|
||||
}
|
||||
//图片默认渲染方式
|
||||
if (obj.mode) {
|
||||
this.option.mode = obj.mode
|
||||
} else {
|
||||
this.option.mode = 'contain'
|
||||
}
|
||||
if (obj.success) {
|
||||
this.success = obj.success
|
||||
} else {
|
||||
this.success = () => {}
|
||||
}
|
||||
console.log("打开")
|
||||
this.dialogVisiblex = true
|
||||
},
|
||||
finish() {
|
||||
// 获取截图的数据
|
||||
let that = this
|
||||
this.$refs.cropper.getCropBlob(data => {
|
||||
that.unimgurl = data
|
||||
that.confirm()
|
||||
})
|
||||
},
|
||||
confirm() {
|
||||
this.success({
|
||||
img: this.unimgurl
|
||||
})
|
||||
this.dialogVisiblex = false
|
||||
},
|
||||
cancel() {
|
||||
this.dialogVisiblex = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
<style lang="scss">
|
||||
.real_info_class {
|
||||
.el-checkbox__input .el-checkbox__inner {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
.file-image {
|
||||
width: 320px;
|
||||
height: 320px;
|
||||
font-size: 14px;
|
||||
border: 1px solid #cccccc;
|
||||
margin: 15px 0;
|
||||
}
|
||||
|
||||
/* 截图 */
|
||||
/* .cropper-content {} */
|
||||
.cropper {
|
||||
width: 960px;
|
||||
height: 606px;
|
||||
}
|
||||
</style>
|
||||
59
web/src/views/common/business/categorySelect.vue
Normal file
59
web/src/views/common/business/categorySelect.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<el-select v-model="categoryId" :placeholder="placeholder" @change="changeCategory">
|
||||
<el-option
|
||||
v-for="item in categoryList"
|
||||
:key="item.categoryId"
|
||||
:label="item.categoryName"
|
||||
:value="item.categoryId">
|
||||
<span >{{ item.categoryName }}</span>
|
||||
<!-- <span style="float: right; color: #8492a6; font-size: 13px">{{ item.deptNo }} {{deptId}}</span>-->
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCategoryList} from "@/api/business/category/category";
|
||||
import { getSelectObj } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'categorySelect',
|
||||
model: {
|
||||
prop: 'defaultId', //指定自己的v-model属性接受数值
|
||||
event: 'changeDefaultId'//指定自己的event1事件回送数据给父组件
|
||||
},
|
||||
props: {
|
||||
defaultId: String,
|
||||
placeholder: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
categoryId: this.defaultId,
|
||||
categoryList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchCategoryList()
|
||||
},
|
||||
watch:{
|
||||
defaultId(newVal,oldVal){
|
||||
this.categoryId = newVal
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
fetchCategoryList(){
|
||||
getCategoryList().then(response=>{
|
||||
this.categoryList = response.data
|
||||
})
|
||||
},
|
||||
changeCategory(e){
|
||||
const category = getSelectObj(e,this.categoryList,'categoryId')
|
||||
this.$emit('changeDefaultId',e)
|
||||
this.$emit('changeSelect',category)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
80
web/src/views/common/system/UpdatePassword.vue
Normal file
80
web/src/views/common/system/UpdatePassword.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :close-on-click-modal="false"
|
||||
append-to-body
|
||||
top="20vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div" style="height:25vh">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
:rules="rules"
|
||||
>
|
||||
<el-form-item label="旧密码" prop="password" class="is-required">
|
||||
<el-input type="text" class="pw" @keyup.native="app.clearChinese" v-model="temp.password" placeholder="请输入旧密码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="新密码" prop="newPassword" class="is-required">
|
||||
<el-input type="text" class="pw" @keyup.native="app.clearChinese" v-model="temp.newPassword" placeholder="请输入新密码" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
<slot name="button2"></slot>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import formValid from "@/utils/formValidate";
|
||||
import {updatePassword} from "@/api/system/user/user";
|
||||
|
||||
const requiredFields = [
|
||||
'password','newPassword'
|
||||
]
|
||||
export default {
|
||||
name: "UpdatePassword",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp:{
|
||||
password:'',
|
||||
newPassword:''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
handleCancel(){
|
||||
this.dialogVisible = false
|
||||
this.temp = this.$options.data().temp
|
||||
},
|
||||
submit(){
|
||||
formValid(this).then(res=>{
|
||||
if(res){
|
||||
updatePassword(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
82
web/src/views/common/system/deptCascader.vue
Normal file
82
web/src/views/common/system/deptCascader.vue
Normal file
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<el-cascader
|
||||
ref="deptCascader"
|
||||
filterable
|
||||
:show-all-levels="false"
|
||||
v-model="deptId"
|
||||
:options="deptTree"
|
||||
:props="{ expandTrigger: 'hover',checkStrictly: true,value : 'deptId', label : 'deptName' }"
|
||||
@change="handleChange"
|
||||
></el-cascader>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDeptTree } from '@/api/system/dept/dept'
|
||||
import { regroupCascaderData,isEmpty } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'deptCascader',
|
||||
model: {
|
||||
prop: 'defaultId', //指定自己的v-model属性接受数值
|
||||
event: 'changeDefaultId'//指定自己的event1事件回送数据给父组件
|
||||
},
|
||||
props: {
|
||||
defaultId: String,
|
||||
placeholder: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
deptId: [],
|
||||
deptTree: [],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick( async () => {
|
||||
if(this.deptTree.length==0){
|
||||
this.deptTree = (await getDeptTree()).data
|
||||
}
|
||||
if(isEmpty(this.defaultId)){
|
||||
this.deptId = []
|
||||
}else{
|
||||
let cascaderData = regroupCascaderData(this.defaultId,this.deptTree,
|
||||
"deptName",
|
||||
"deptId",
|
||||
"children")
|
||||
this.deptId = cascaderData['arr']
|
||||
}
|
||||
})
|
||||
},
|
||||
watch:{
|
||||
defaultId(newVal,oldVal){
|
||||
if(newVal){
|
||||
let cascaderData = regroupCascaderData(newVal,this.deptTree,
|
||||
"deptName",
|
||||
"deptId",
|
||||
"children")
|
||||
this.deptId = cascaderData['arr']
|
||||
}else{
|
||||
this.deptId = []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleChange(e){
|
||||
console.log(e)
|
||||
// console.log(e, this.$refs.deptCascader.getCheckedNodes()[0].pathLabels);
|
||||
let checkedNode = this.$refs.deptCascader.getCheckedNodes()[0]
|
||||
let checkedNodeValue = checkedNode.value
|
||||
this.$emit('changeDefaultId',checkedNodeValue)
|
||||
this.$emit('changeDept',checkedNode)
|
||||
},
|
||||
fetchData(){
|
||||
getDeptTree().then(response=>{
|
||||
this.deptTree = response.data
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
59
web/src/views/common/system/deptSelect.vue
Normal file
59
web/src/views/common/system/deptSelect.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<el-select v-model="deptId" :placeholder="placeholder" @change="changeDept">
|
||||
<el-option
|
||||
v-for="item in deptList"
|
||||
:key="item.deptId"
|
||||
:label="item.deptName"
|
||||
:value="item.deptId">
|
||||
<span style="float: left">{{ item.deptName }}</span>
|
||||
<span style="float: right; color: #8492a6; font-size: 13px">{{ item.deptNo }} {{deptId}}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDeptList } from '@/api/system/dept/dept'
|
||||
import { getSelectObj } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'deptSelect',
|
||||
model: {
|
||||
prop: 'defaultId', //指定自己的v-model属性接受数值
|
||||
event: 'changeDefaultId'//指定自己的event1事件回送数据给父组件
|
||||
},
|
||||
props: {
|
||||
defaultId: String,
|
||||
placeholder: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
deptId: this.defaultId,
|
||||
deptList: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchDeptList()
|
||||
},
|
||||
watch:{
|
||||
defaultId(newVal,oldVal){
|
||||
this.deptId = newVal
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
fetchDeptList(){
|
||||
getDeptList().then(response=>{
|
||||
this.deptList = response.data
|
||||
})
|
||||
},
|
||||
changeDept(e){
|
||||
const dept = getSelectObj(e,this.deptList,'deptId')
|
||||
this.$emit('changeDefaultId',e)
|
||||
this.$emit('changeSelect',dept)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
80
web/src/views/common/system/menuCascader.vue
Normal file
80
web/src/views/common/system/menuCascader.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<template>
|
||||
<el-cascader
|
||||
ref="deptCascader"
|
||||
filterable
|
||||
:show-all-levels="false"
|
||||
v-model="menuId"
|
||||
:options="menuTree"
|
||||
:props="{ expandTrigger: 'hover',checkStrictly: true,value : 'menuId', label : 'menuTitle' }"
|
||||
@change="handleChange"
|
||||
></el-cascader>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getMenuTree } from '@/api/system/menu/menu'
|
||||
import { regroupCascaderData,isEmpty } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'menuCascader',
|
||||
model: {
|
||||
prop: 'defaultId', //指定自己的v-model属性接受数值
|
||||
event: 'changeDefaultId'//指定自己的event1事件回送数据给父组件
|
||||
},
|
||||
props: {
|
||||
defaultId: String,
|
||||
placeholder: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menuId: [],
|
||||
menuTree: [],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick( async () => {
|
||||
if(this.menuTree.length==0){
|
||||
this.menuTree = (await getMenuTree()).data
|
||||
}
|
||||
if(isEmpty(this.defaultId)){
|
||||
this.menuId = []
|
||||
}else{
|
||||
let cascaderData = regroupCascaderData(this.defaultId,this.menuTree,
|
||||
"menuName",
|
||||
"menuId",
|
||||
"children")
|
||||
this.menuId = cascaderData['arr']
|
||||
}
|
||||
})
|
||||
},
|
||||
watch:{
|
||||
defaultId(newVal,oldVal){
|
||||
if(newVal){
|
||||
let cascaderData = regroupCascaderData(newVal,this.menuTree,
|
||||
"menuName",
|
||||
"menuId",
|
||||
"children")
|
||||
this.menuId = cascaderData['arr']
|
||||
}else{
|
||||
this.menuId = []
|
||||
}
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
handleChange(e){
|
||||
// console.log(e, this.$refs.deptCascader.getCheckedNodes()[0].pathLabels);
|
||||
let checkedNode = this.$refs.deptCascader.getCheckedNodes()[0]
|
||||
let checkedNodeValue = checkedNode.value
|
||||
this.$emit('changeDefaultId',checkedNodeValue)
|
||||
},
|
||||
fetchData(){
|
||||
getMenuTree().then(response=>{
|
||||
this.menuTree = response.data
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
56
web/src/views/common/system/role/roleSelect.vue
Normal file
56
web/src/views/common/system/role/roleSelect.vue
Normal file
@@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<el-select v-model="roleId" multiple :placeholder="placeholder" @change="changeRole">
|
||||
<el-option
|
||||
v-for="item in roleData"
|
||||
:key="item.roleId"
|
||||
:label="item.roleName"
|
||||
:value="item.roleId">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getRoleList} from '@/api/system/role/role'
|
||||
import { getSelectObj } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'roleSelect',
|
||||
model: {
|
||||
prop: 'defaultId', //指定自己的v-model属性接受数值
|
||||
event: 'changeDefaultId'//指定自己的event1事件回送数据给父组件
|
||||
},
|
||||
props: {
|
||||
defaultId: Array,
|
||||
placeholder: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
roleId: this.defaultId,
|
||||
roleData: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchData()
|
||||
},
|
||||
watch:{
|
||||
defaultId(newVal,oldVal){
|
||||
this.roleId = newVal
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
fetchData(){
|
||||
getRoleList().then(response=>{
|
||||
this.roleData = response.data
|
||||
})
|
||||
},
|
||||
changeRole(e){
|
||||
const role = getSelectObj(e,this.roleData,'roleId')
|
||||
this.$emit('changeDefaultId',e)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
141
web/src/views/common/system/role/settingMenu.vue
Normal file
141
web/src/views/common/system/role/settingMenu.vue
Normal file
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="70%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-tree
|
||||
ref="menuTree"
|
||||
:default-expanded-keys="expandArray"
|
||||
:data="menuData"
|
||||
show-checkbox
|
||||
node-key="menuId"
|
||||
check-strictly
|
||||
:props="defaultProps"
|
||||
>
|
||||
<span class="custom-tree-node" slot-scope="{ node, data }">
|
||||
<span>
|
||||
{{ data.menuTitle }}
|
||||
<el-tag v-show="data.type==0" size="mini">菜单</el-tag>
|
||||
<el-tag type="warning" v-show="data.type==1" size="mini">权限</el-tag>
|
||||
</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getMenuTree} from "@/api/system/menu/menu";
|
||||
import {getRoleMenu,editRoleMenu} from '@/api/system/role/role'
|
||||
|
||||
export default {
|
||||
name: "settingMenu",
|
||||
data() {
|
||||
return {
|
||||
menuData: [],
|
||||
expandArray: [],
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
roleId: '',
|
||||
},
|
||||
defaultProps:{
|
||||
id: 'menuId',
|
||||
label:'menuTitle',
|
||||
},
|
||||
checkedKeys:[]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.fetchMenuData()
|
||||
},
|
||||
methods: {
|
||||
fetchMenuData() {
|
||||
getMenuTree().then(response=>{
|
||||
this.menuData = response.data[0].children
|
||||
this.expandArray = this.menuData.map(item=>{
|
||||
return item.menuId
|
||||
})
|
||||
})
|
||||
},
|
||||
fetchRoleMenu(){
|
||||
|
||||
getRoleMenu(this.temp.roleId).then(response=>{
|
||||
this.checkedKeys = response.data
|
||||
|
||||
//不用传父级菜单 通过getHalfCheckedKeys方法获得一级菜单
|
||||
// this.$refs.menuTree.setCheckedKeys(this.checkedKeys);
|
||||
//多级菜单此方法失效 使用另外的方法
|
||||
|
||||
//循环调用 默认选中的树的数据
|
||||
this.$nextTick(() => {
|
||||
this.checkedKeys.forEach(value => {
|
||||
this.$refs.menuTree.setChecked(value, true, false);
|
||||
});
|
||||
})
|
||||
})
|
||||
},
|
||||
open(row) {
|
||||
this.checkedKeys = this.$options.data().checkedKeys
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
this.fetchRoleMenu()
|
||||
},
|
||||
submit() {
|
||||
//checkedKeys 只获取子节点数据 需要把两个结果相连
|
||||
let checkedKeys = this.$refs.menuTree.getCheckedKeys();
|
||||
let hafCheckedKeys = this.$refs.menuTree.getHalfCheckedKeys();
|
||||
const data = {
|
||||
roleId:this.temp.roleId,
|
||||
menuIdList:checkedKeys.concat(hafCheckedKeys)
|
||||
}
|
||||
editRoleMenu(data).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
//每次关闭弹窗去除历史选择
|
||||
this.$refs.menuTree.setCheckedKeys([])
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/*树形菜单子菜单 左对齐*/
|
||||
/deep/ .el-tree-node.is-expanded>.el-tree-node__children{
|
||||
display: flex;
|
||||
}
|
||||
/*/deep/ .el-tree-node__children .el-tree-node__content{*/
|
||||
/* float: left;*/
|
||||
/* margin: 6px;*/
|
||||
/*}*/
|
||||
/deep/ .custom-tree-node{
|
||||
font-size: 17px !important;
|
||||
}
|
||||
/deep/ .el-tree-node__content{
|
||||
margin: 2px;
|
||||
}
|
||||
/*/deep/ .el-tree-node__children{*/
|
||||
/* border-bottom:1px dashed #eee;*/
|
||||
/* padding-top: 5px;*/
|
||||
/* padding-bottom: 5px;*/
|
||||
/* margin-bottom: 10px;*/
|
||||
/*}*/
|
||||
</style>
|
||||
102
web/src/views/dashboard/components/BarChart.vue
Normal file
102
web/src/views/dashboard/components/BarChart.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div :class="className" :style="{height:height,width:width}" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
require('echarts/theme/macarons') // echarts theme
|
||||
import resize from './mixins/resize'
|
||||
|
||||
const animationDuration = 6000
|
||||
|
||||
export default {
|
||||
mixins: [resize],
|
||||
props: {
|
||||
className: {
|
||||
type: String,
|
||||
default: 'chart'
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '100%'
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '300px'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$el, 'macarons')
|
||||
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
||||
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
top: 10,
|
||||
left: '2%',
|
||||
right: '2%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [{
|
||||
type: 'category',
|
||||
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}],
|
||||
yAxis: [{
|
||||
type: 'value',
|
||||
axisTick: {
|
||||
show: false
|
||||
}
|
||||
}],
|
||||
series: [{
|
||||
name: 'pageA',
|
||||
type: 'bar',
|
||||
stack: 'vistors',
|
||||
barWidth: '60%',
|
||||
data: [79, 52, 200, 334, 390, 330, 220],
|
||||
animationDuration
|
||||
}, {
|
||||
name: 'pageB',
|
||||
type: 'bar',
|
||||
stack: 'vistors',
|
||||
barWidth: '60%',
|
||||
data: [80, 52, 200, 334, 390, 330, 220],
|
||||
animationDuration
|
||||
}, {
|
||||
name: 'pageC',
|
||||
type: 'bar',
|
||||
stack: 'vistors',
|
||||
barWidth: '60%',
|
||||
data: [30, 52, 200, 334, 390, 330, 220],
|
||||
animationDuration
|
||||
}]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
79
web/src/views/dashboard/components/PieChart.vue
Normal file
79
web/src/views/dashboard/components/PieChart.vue
Normal file
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div :class="className" :style="{height:height,width:width}" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
require('echarts/theme/macarons') // echarts theme
|
||||
import resize from './mixins/resize'
|
||||
|
||||
export default {
|
||||
mixins: [resize],
|
||||
props: {
|
||||
className: {
|
||||
type: String,
|
||||
default: 'chart'
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '100%'
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '300px'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$el, 'macarons')
|
||||
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b} : {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
left: 'center',
|
||||
bottom: '0',
|
||||
data: ['Industries', 'Technology', 'Forex', 'Gold', 'Forecasts']
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'WEEKLY WRITE ARTICLES',
|
||||
type: 'pie',
|
||||
roseType: 'radius',
|
||||
radius: [15, 95],
|
||||
center: ['50%', '38%'],
|
||||
data: [
|
||||
{ value: 320, name: 'Industries' },
|
||||
{ value: 240, name: 'Technology' },
|
||||
{ value: 149, name: 'Forex' },
|
||||
{ value: 100, name: 'Gold' },
|
||||
{ value: 59, name: 'Forecasts' }
|
||||
],
|
||||
animationEasing: 'cubicInOut',
|
||||
animationDuration: 2600
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
116
web/src/views/dashboard/components/RaddarChart.vue
Normal file
116
web/src/views/dashboard/components/RaddarChart.vue
Normal file
@@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<div :class="className" :style="{height:height,width:width}" />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import echarts from 'echarts'
|
||||
require('echarts/theme/macarons') // echarts theme
|
||||
import resize from './mixins/resize'
|
||||
|
||||
const animationDuration = 3000
|
||||
|
||||
export default {
|
||||
mixins: [resize],
|
||||
props: {
|
||||
className: {
|
||||
type: String,
|
||||
default: 'chart'
|
||||
},
|
||||
width: {
|
||||
type: String,
|
||||
default: '100%'
|
||||
},
|
||||
height: {
|
||||
type: String,
|
||||
default: '300px'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (!this.chart) {
|
||||
return
|
||||
}
|
||||
this.chart.dispose()
|
||||
this.chart = null
|
||||
},
|
||||
methods: {
|
||||
initChart() {
|
||||
this.chart = echarts.init(this.$el, 'macarons')
|
||||
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: { // 坐标轴指示器，坐标轴触发有效
|
||||
type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
|
||||
}
|
||||
},
|
||||
radar: {
|
||||
radius: '66%',
|
||||
center: ['50%', '42%'],
|
||||
splitNumber: 8,
|
||||
splitArea: {
|
||||
areaStyle: {
|
||||
color: 'rgba(127,95,132,.3)',
|
||||
opacity: 1,
|
||||
shadowBlur: 45,
|
||||
shadowColor: 'rgba(0,0,0,.5)',
|
||||
shadowOffsetX: 0,
|
||||
shadowOffsetY: 15
|
||||
}
|
||||
},
|
||||
indicator: [
|
||||
{ name: 'Sales', max: 10000 },
|
||||
{ name: 'Administration', max: 20000 },
|
||||
{ name: 'Information Technology', max: 20000 },
|
||||
{ name: 'Customer Support', max: 20000 },
|
||||
{ name: 'Development', max: 20000 },
|
||||
{ name: 'Marketing', max: 20000 }
|
||||
]
|
||||
},
|
||||
legend: {
|
||||
left: 'center',
|
||||
bottom: '0',
|
||||
data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
|
||||
},
|
||||
series: [{
|
||||
type: 'radar',
|
||||
symbolSize: 0,
|
||||
areaStyle: {
|
||||
normal: {
|
||||
shadowBlur: 13,
|
||||
shadowColor: 'rgba(0,0,0,.2)',
|
||||
shadowOffsetX: 0,
|
||||
shadowOffsetY: 10,
|
||||
opacity: 1
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: [5000, 7000, 12000, 11000, 15000, 14000],
|
||||
name: 'Allocated Budget'
|
||||
},
|
||||
{
|
||||
value: [4000, 9000, 15000, 15000, 13000, 11000],
|
||||
name: 'Expected Spending'
|
||||
},
|
||||
{
|
||||
value: [5500, 11000, 12000, 15000, 12000, 12000],
|
||||
name: 'Actual Spending'
|
||||
}
|
||||
],
|
||||
animationDuration: animationDuration
|
||||
}]
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
55
web/src/views/dashboard/components/mixins/resize.js
Normal file
55
web/src/views/dashboard/components/mixins/resize.js
Normal file
@@ -0,0 +1,55 @@
|
||||
import { debounce } from '@/utils'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
$_sidebarElm: null,
|
||||
$_resizeHandler: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$_resizeHandler = debounce(() => {
|
||||
if (this.chart) {
|
||||
this.chart.resize()
|
||||
}
|
||||
}, 100)
|
||||
this.$_initResizeEvent()
|
||||
this.$_initSidebarResizeEvent()
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$_destroyResizeEvent()
|
||||
this.$_destroySidebarResizeEvent()
|
||||
},
|
||||
// to fixed bug when cached by keep-alive
|
||||
// https://github.com/PanJiaChen/vue-element-admin/issues/2116
|
||||
activated() {
|
||||
this.$_initResizeEvent()
|
||||
this.$_initSidebarResizeEvent()
|
||||
},
|
||||
deactivated() {
|
||||
this.$_destroyResizeEvent()
|
||||
this.$_destroySidebarResizeEvent()
|
||||
},
|
||||
methods: {
|
||||
// use $_ for mixins properties
|
||||
// https://vuejs.org/v2/style-guide/index.html#Private-property-names-essential
|
||||
$_initResizeEvent() {
|
||||
window.addEventListener('resize', this.$_resizeHandler)
|
||||
},
|
||||
$_destroyResizeEvent() {
|
||||
window.removeEventListener('resize', this.$_resizeHandler)
|
||||
},
|
||||
$_sidebarResizeHandler(e) {
|
||||
if (e.propertyName === 'width') {
|
||||
this.$_resizeHandler()
|
||||
}
|
||||
},
|
||||
$_initSidebarResizeEvent() {
|
||||
this.$_sidebarElm = document.getElementsByClassName('sidebar-container')[0]
|
||||
this.$_sidebarElm && this.$_sidebarElm.addEventListener('transitionend', this.$_sidebarResizeHandler)
|
||||
},
|
||||
$_destroySidebarResizeEvent() {
|
||||
this.$_sidebarElm && this.$_sidebarElm.removeEventListener('transitionend', this.$_sidebarResizeHandler)
|
||||
}
|
||||
}
|
||||
}
|
||||
411
web/src/views/dashboard/index.vue
Normal file
411
web/src/views/dashboard/index.vue
Normal file
@@ -0,0 +1,411 @@
|
||||
<template>
|
||||
<div class="dashboard-container">
|
||||
<div class="dashboard-editor-container">
|
||||
<!-- <div>-->
|
||||
<!-- <a href="https://github.com/iimeepo/vue-admin-template" target="_blank" class="github-corner" aria-label="View source on Github">-->
|
||||
<!-- <svg-->
|
||||
<!-- width="80"-->
|
||||
<!-- height="80"-->
|
||||
<!-- viewBox="0 0 250 250"-->
|
||||
<!-- style="fill:#40c9c6; color:#fff;"-->
|
||||
<!-- aria-hidden="true"-->
|
||||
<!-- >-->
|
||||
<!-- <path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z" />-->
|
||||
<!-- <path-->
|
||||
<!-- d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"-->
|
||||
<!-- fill="currentColor"-->
|
||||
<!-- style="transform-origin: 130px 106px;"-->
|
||||
<!-- class="octo-arm"-->
|
||||
<!-- />-->
|
||||
<!-- <path-->
|
||||
<!-- d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z"-->
|
||||
<!-- fill="currentColor"-->
|
||||
<!-- class="octo-body"-->
|
||||
<!-- />-->
|
||||
<!-- </svg>-->
|
||||
<!-- </a>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<el-row :gutter="40" class="panel-group">
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-people">
|
||||
<i class="el-icon-user-solid" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">
|
||||
会员总数
|
||||
</div>
|
||||
<span class="card-panel-num">{{dashboardInfo.memberCount}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-message">
|
||||
<i class="el-icon-bank-card" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">
|
||||
会员卡总数
|
||||
</div>
|
||||
<span class="card-panel-num">{{dashboardInfo.memberCardCount}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-money">
|
||||
<i class="el-icon-shopping-cart-full" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">
|
||||
商品总数
|
||||
</div>
|
||||
<span class="card-panel-num">{{dashboardInfo.productCount}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="12" :sm="12" :lg="6" class="card-panel-col">
|
||||
<div class="card-panel">
|
||||
<div class="card-panel-icon-wrapper icon-shopping">
|
||||
<i class="el-icon-document" />
|
||||
</div>
|
||||
<div class="card-panel-description">
|
||||
<div class="card-panel-text">
|
||||
订单总数
|
||||
</div>
|
||||
<span class="card-panel-num">{{dashboardInfo.sellCount}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="60" style="margin-top: 50px;margin-bottom: 80px;">
|
||||
<el-col :xs="6" :sm="6" :lg="6" class="card-panel-col" style="text-align: center;">
|
||||
<el-button style="width: 240px;height: 70px;font-size: 20px;" type="danger" @click="$router.push('/cashier/cashierDesk')">收银台</el-button>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="6" :sm="6" :lg="6" class="card-panel-col" style="text-align: center;">
|
||||
<el-button style="width: 240px;height: 70px;font-size: 20px;" type="success" @click="$router.push('/sellList')">订单管理</el-button>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="6" :sm="6" :lg="6" class="card-panel-col" style="text-align: center;">
|
||||
<el-button style="width: 240px;height: 70px;font-size: 20px;" type="primary" @click="$router.push('/product/productList')">商品管理</el-button>
|
||||
</el-col>
|
||||
|
||||
<el-col :xs="6" :sm="6" :lg="6" class="card-panel-col" style="text-align: center;">
|
||||
<el-button style="width: 240px;height: 70px;font-size: 20px;" type="warning" @click="$router.push('/stockIn')">库存管理</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="16" class="dashboard-bottom">
|
||||
<el-col :xs="24" :sm="24" :lg="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>商品库存量排行</span>
|
||||
</div>
|
||||
<el-table
|
||||
:data="dashboardInfo.productStockRank"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column
|
||||
label="排名"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.$index+1 }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="productName"
|
||||
label="商品名"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="productCount"
|
||||
label="库存数"
|
||||
/>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :lg="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>商品收益排行</span>
|
||||
</div>
|
||||
<div class="block">
|
||||
<div class="progress-item" style="margin-bottom: 20px;" v-for="item in dashboardInfo.productSellProportion">
|
||||
<span>{{item.productName}}</span>
|
||||
<el-progress :percentage="item.percentage" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :lg="8">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>更新日志</span>
|
||||
</div>
|
||||
<div class="block">
|
||||
<el-timeline>
|
||||
<el-timeline-item
|
||||
v-for="(activity, index) in activities"
|
||||
:key="index"
|
||||
:icon="activity.icon"
|
||||
:type="activity.type"
|
||||
:color="activity.color"
|
||||
:size="activity.size"
|
||||
:timestamp="activity.timestamp"
|
||||
>
|
||||
{{ activity.content }}
|
||||
</el-timeline-item>
|
||||
</el-timeline>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import {getDashboardInfo} from "@/api/business/stats/stats";
|
||||
import BarChart from './components/BarChart'
|
||||
import PieChart from './components/PieChart'
|
||||
import RaddarChart from './components/RaddarChart'
|
||||
|
||||
export default {
|
||||
name: 'Dashboard',
|
||||
components: {
|
||||
BarChart,
|
||||
PieChart,
|
||||
RaddarChart
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dashboardInfo:{},
|
||||
activities: [{
|
||||
content: '第一个测试版本开发完成',
|
||||
timestamp: '2024-12-4 09:05:37',
|
||||
size: 'large',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-more'
|
||||
}
|
||||
, {
|
||||
content: '订单模块开发完成',
|
||||
timestamp: '2024-12-1 12:22:14',
|
||||
color: '#0bbd87'
|
||||
}, {
|
||||
content: '收银台模块开发完成',
|
||||
timestamp: '2024-11-28 14:35:28',
|
||||
size: 'large'
|
||||
}, {
|
||||
content: '库存模块开发完成',
|
||||
timestamp: '2024-11-20 19:16:42'
|
||||
}
|
||||
]
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'name'
|
||||
])
|
||||
},
|
||||
mounted() {
|
||||
this.getDashboardInfo()
|
||||
},
|
||||
methods:{
|
||||
getDashboardInfo(){
|
||||
getDashboardInfo().then(res => {
|
||||
this.dashboardInfo = res.data
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
::v-deep .el-progress__text{
|
||||
margin-left: 0px;
|
||||
}
|
||||
::v-deep .el-progress-bar{
|
||||
|
||||
width: 90%;
|
||||
margin-right:-25px;
|
||||
}
|
||||
|
||||
.dashboard-bottom{
|
||||
.box-card{
|
||||
min-height: 350px;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-editor-container {
|
||||
height: calc(100vh - 60px);
|
||||
padding: 32px;
|
||||
background-color: rgb(240, 242, 245);
|
||||
position: relative;
|
||||
|
||||
.github-corner {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
border: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.chart-wrapper {
|
||||
background: #fff;
|
||||
padding: 16px 16px 0;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
}
|
||||
|
||||
.panel-group {
|
||||
margin-top: 18px;
|
||||
|
||||
.card-panel-col {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.card-panel {
|
||||
height: 108px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: #666;
|
||||
background: #fff;
|
||||
box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
|
||||
border-color: rgba(0, 0, 0, .05);
|
||||
|
||||
&:hover {
|
||||
.card-panel-icon-wrapper {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.icon-people {
|
||||
background: #40c9c6;
|
||||
}
|
||||
|
||||
.icon-message {
|
||||
background: #36a3f7;
|
||||
}
|
||||
|
||||
.icon-money {
|
||||
background: #f4516c;
|
||||
}
|
||||
|
||||
.icon-shopping {
|
||||
background: #34bfa3
|
||||
}
|
||||
}
|
||||
|
||||
.icon-people {
|
||||
font-size: 48px;
|
||||
color: #40c9c6;
|
||||
}
|
||||
|
||||
.icon-message {
|
||||
font-size: 48px;
|
||||
color: #36a3f7;
|
||||
}
|
||||
|
||||
.icon-money {
|
||||
font-size: 48px;
|
||||
color: #f4516c;
|
||||
}
|
||||
|
||||
.icon-shopping {
|
||||
font-size: 48px;
|
||||
color: #34bfa3
|
||||
}
|
||||
|
||||
.card-panel-icon-wrapper {
|
||||
float: left;
|
||||
margin: 14px 0 0 14px;
|
||||
padding: 16px;
|
||||
transition: all 0.38s ease-out;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.card-panel-icon {
|
||||
float: left;
|
||||
font-size: 48px;
|
||||
}
|
||||
|
||||
.card-panel-description {
|
||||
float: right;
|
||||
font-weight: bold;
|
||||
margin: 26px;
|
||||
margin-left: 0px;
|
||||
|
||||
.card-panel-text {
|
||||
line-height: 18px;
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
font-size: 16px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.card-panel-num {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.github-corner:hover .octo-arm {
|
||||
animation: octocat-wave 560ms ease-in-out
|
||||
}
|
||||
|
||||
@keyframes octocat-wave {
|
||||
0%,
|
||||
100% {
|
||||
transform: rotate(0)
|
||||
}
|
||||
20%,
|
||||
60% {
|
||||
transform: rotate(-25deg)
|
||||
}
|
||||
40%,
|
||||
80% {
|
||||
transform: rotate(10deg)
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:500px) {
|
||||
.github-corner:hover .octo-arm {
|
||||
animation: none
|
||||
}
|
||||
.github-corner .octo-arm {
|
||||
animation: octocat-wave 560ms ease-in-out
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:550px) {
|
||||
.card-panel-description {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.card-panel-icon-wrapper {
|
||||
float: none !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0 !important;
|
||||
|
||||
.svg-icon {
|
||||
display: block;
|
||||
margin: 14px auto !important;
|
||||
float: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:1024px) {
|
||||
.chart-wrapper {
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
22
web/src/views/data/index.vue
Normal file
22
web/src/views/data/index.vue
Normal file
@@ -0,0 +1,22 @@
|
||||
<template>
|
||||
<div class="chart-container">
|
||||
<chart height="100%" width="100%" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Chart from '@/components/Charts/MixChart'
|
||||
|
||||
export default {
|
||||
name: 'MixChart',
|
||||
components: { Chart }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chart-container{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
}
|
||||
</style>
|
||||
282
web/src/views/link/index.vue
Normal file
282
web/src/views/link/index.vue
Normal file
@@ -0,0 +1,282 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="名称"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="链接地址"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.link }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
@change="changeStatus($event, scope)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="链接地址">
|
||||
<el-input v-model="temp.link" placeholder="请输入链接地址" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户组状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import { getList } from '@/api/link'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
title: '',
|
||||
link: '',
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
menus: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
},
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
changeStatus(value, scope) {
|
||||
setTimeout(() => {
|
||||
this.list[scope.$index].status = value
|
||||
this.$message({
|
||||
message: '更新成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
228
web/src/views/log/index.vue
Normal file
228
web/src/views/log/index.vue
Normal file
@@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-date-picker
|
||||
v-model="listQuery.created_at"
|
||||
size="small"
|
||||
type="datetimerange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
style="margin-bottom: 10px;vertical-align: middle;"
|
||||
:editable="false"
|
||||
/>
|
||||
<el-select
|
||||
v-model="listQuery.level"
|
||||
size="small"
|
||||
placeholder="选择日志级别"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 150px;margin-left: 10px;"
|
||||
>
|
||||
<el-option label="DEBUG" :value="'DEBUG'" />
|
||||
<el-option label="INFO" :value="'INFO'" />
|
||||
<el-option label="WARNING" :value="'WARNING'" />
|
||||
<el-option label="ERROR" :value="'ERROR'" />
|
||||
</el-select>
|
||||
<el-select
|
||||
v-model="listQuery.method"
|
||||
size="small"
|
||||
placeholder="选择请求方法"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 150px;margin-left: 10px;"
|
||||
>
|
||||
<el-option label="GET" :value="'GET'" />
|
||||
<el-option label="POST" :value="'POST'" />
|
||||
<el-option label="PUT" :value="'PUT'" />
|
||||
<el-option label="PATCH" :value="'PATCH'" />
|
||||
<el-option label="DELETE" :value="'DELETE'" />
|
||||
</el-select>
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
align="center"
|
||||
label="ID"
|
||||
width="95"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="行为描述"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="日志级别"
|
||||
width="120"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-tag :type="scope.row.level | levelFilter">{{ scope.row.level }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="请求方法"
|
||||
width="100"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.method }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="响应时间"
|
||||
width="100"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.time }} ms
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="IP地址"
|
||||
width="130"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.ip }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="操作人"
|
||||
width="100"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.author }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
label="操作时间"
|
||||
width="160"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.created_at }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import { getList } from '@/api/log'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination
|
||||
},
|
||||
filters: {
|
||||
levelFilter(level) {
|
||||
const levelMap = {
|
||||
'DEBUG': 'success',
|
||||
'INFO': '',
|
||||
'WARNING': 'warning',
|
||||
'ERROR': 'danger'
|
||||
}
|
||||
return levelMap[level]
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
created_at: undefined,
|
||||
status: undefined,
|
||||
level: undefined,
|
||||
method: undefined,
|
||||
keyword: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
created_at: undefined,
|
||||
status: undefined,
|
||||
level: undefined,
|
||||
method: undefined,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
237
web/src/views/login/index.vue
Normal file
237
web/src/views/login/index.vue
Normal file
@@ -0,0 +1,237 @@
|
||||
<template>
|
||||
<div class="login-container">
|
||||
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
|
||||
|
||||
<div class="title-container">
|
||||
<h3 class="title">Login Form</h3>
|
||||
</div>
|
||||
|
||||
<el-form-item prop="username">
|
||||
<span class="svg-container">
|
||||
<svg-icon icon-class="user" />
|
||||
</span>
|
||||
<el-input
|
||||
ref="username"
|
||||
v-model="loginForm.username"
|
||||
placeholder="Username"
|
||||
name="username"
|
||||
type="text"
|
||||
tabindex="1"
|
||||
auto-complete="on"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="password">
|
||||
<span class="svg-container">
|
||||
<svg-icon icon-class="password" />
|
||||
</span>
|
||||
<el-input
|
||||
:key="passwordType"
|
||||
ref="password"
|
||||
v-model="loginForm.password"
|
||||
:type="passwordType"
|
||||
placeholder="Password"
|
||||
name="password"
|
||||
tabindex="2"
|
||||
auto-complete="on"
|
||||
@keyup.enter.native="handleLogin"
|
||||
/>
|
||||
<span class="show-pwd" @click="showPwd">
|
||||
<svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
|
||||
</span>
|
||||
</el-form-item>
|
||||
|
||||
<el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
|
||||
|
||||
<div class="tips">
|
||||
<span style="margin-right:20px;">username: admin</span>
|
||||
<span> password: any</span>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { validUsername } from '@/utils/validate'
|
||||
|
||||
export default {
|
||||
name: 'Login',
|
||||
data() {
|
||||
const validateUsername = (rule, value, callback) => {
|
||||
if (!validUsername(value)) {
|
||||
callback(new Error('Please enter the correct user name'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
const validatePassword = (rule, value, callback) => {
|
||||
if (value.length < 6) {
|
||||
callback(new Error('The password can not be less than 6 digits'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
return {
|
||||
loginForm: {
|
||||
username: 'admin',
|
||||
password: '111111'
|
||||
},
|
||||
loginRules: {
|
||||
username: [{ required: true, trigger: 'blur', validator: validateUsername }],
|
||||
password: [{ required: true, trigger: 'blur', validator: validatePassword }]
|
||||
},
|
||||
loading: false,
|
||||
passwordType: 'password',
|
||||
redirect: undefined
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route: {
|
||||
handler: function(route) {
|
||||
this.redirect = route.query && route.query.redirect
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
showPwd() {
|
||||
if (this.passwordType === 'password') {
|
||||
this.passwordType = ''
|
||||
} else {
|
||||
this.passwordType = 'password'
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.$refs.password.focus()
|
||||
})
|
||||
},
|
||||
handleLogin() {
|
||||
this.$refs.loginForm.validate(valid => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
this.$store.dispatch('user/login', this.loginForm).then(() => {
|
||||
this.$router.push({ path: this.redirect || '/' })
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* 修复input 背景不协调 和光标变色 */
|
||||
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */
|
||||
|
||||
$bg:#283443;
|
||||
$light_gray:#fff;
|
||||
$cursor: #fff;
|
||||
|
||||
@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
|
||||
.login-container .el-input input {
|
||||
color: $cursor;
|
||||
}
|
||||
}
|
||||
|
||||
/* reset element-ui css */
|
||||
.login-container {
|
||||
.el-input {
|
||||
display: inline-block;
|
||||
height: 47px;
|
||||
width: 85%;
|
||||
|
||||
input {
|
||||
background: transparent;
|
||||
border: 0px;
|
||||
-webkit-appearance: none;
|
||||
border-radius: 0px;
|
||||
padding: 12px 5px 12px 15px;
|
||||
color: $light_gray;
|
||||
height: 47px;
|
||||
caret-color: $cursor;
|
||||
|
||||
&:-webkit-autofill {
|
||||
box-shadow: 0 0 0px 1000px $bg inset !important;
|
||||
-webkit-text-fill-color: $cursor !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.el-form-item {
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
background: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 5px;
|
||||
color: #454545;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$bg:#2d3a4b;
|
||||
$dark_gray:#889aa4;
|
||||
$light_gray:#eee;
|
||||
|
||||
.login-container {
|
||||
min-height: 100%;
|
||||
width: 100%;
|
||||
background-color: $bg;
|
||||
overflow: hidden;
|
||||
|
||||
.login-form {
|
||||
position: relative;
|
||||
width: 520px;
|
||||
max-width: 100%;
|
||||
padding: 160px 35px 0;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 14px;
|
||||
color: #fff;
|
||||
margin-bottom: 10px;
|
||||
|
||||
span {
|
||||
&:first-of-type {
|
||||
margin-right: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.svg-container {
|
||||
padding: 6px 5px 6px 15px;
|
||||
color: $dark_gray;
|
||||
vertical-align: middle;
|
||||
width: 30px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.title-container {
|
||||
position: relative;
|
||||
|
||||
.title {
|
||||
font-size: 26px;
|
||||
color: $light_gray;
|
||||
margin: 0px auto 40px auto;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.show-pwd {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 7px;
|
||||
font-size: 16px;
|
||||
color: $dark_gray;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
109
web/src/views/login/login.vue
Normal file
109
web/src/views/login/login.vue
Normal file
@@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<div class="login">
|
||||
<div class="container-login100">
|
||||
<div class="wrap-login100">
|
||||
<div class="login100-pic js-tilt" data-tilt>
|
||||
<img src="@/styles/login/img/img-01.png" alt="IMG">
|
||||
|
||||
<div style="text-align: center;font-weight: bold;margin-top: 30px;font-family: Poppins-Bold;font-size: 20px;">DD 会员管理系统</div>
|
||||
</div>
|
||||
|
||||
<form class="login100-form validate-form">
|
||||
<span class="login100-form-title" style="margin-top: 30px;">
|
||||
用户登陆
|
||||
</span>
|
||||
|
||||
<div class="wrap-input100 validate-input">
|
||||
<input class="input100" type="text" name="username" v-model="loginForm.username" placeholder="用户名">
|
||||
<span class="focus-input100"></span>
|
||||
<span class="symbol-input100">
|
||||
<i class="fa fa-user" aria-hidden="true"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="wrap-input100 validate-input">
|
||||
<input class="input100" type="password" name="password" v-model="loginForm.password" placeholder="密码">
|
||||
<span class="focus-input100"></span>
|
||||
<span class="symbol-input100">
|
||||
<i class="fa fa-lock" aria-hidden="true"></i>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
测试账号 ： demo 111111<br/>
|
||||
qq: 727869402<br/>
|
||||
vx: MAMBA_4EVER24
|
||||
<div class="container-login100-form-btn">
|
||||
<button type="button" class="login100-form-btn" @click="handleLogin">
|
||||
登陆
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="text-center p-t-12">
|
||||
<!-- <a class="txt2" href="javascript:">-->
|
||||
<!-- 忘记密码？-->
|
||||
<!-- </a>-->
|
||||
</div>
|
||||
|
||||
<div class="text-center p-t-136">
|
||||
<!-- <a class="txt2" href="#">-->
|
||||
<!-- 还没有账号？立即注册-->
|
||||
<!-- <i class="fa fa-long-arrow-right m-l-5" aria-hidden="true"></i>-->
|
||||
<!-- </a>-->
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<div style="margin: 0 auto;"> <a href="https://beian.miit.gov.cn" style="color: #57b846;">豫ICP备2023016213号</a></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {validUsername} from "@/utils/validate";
|
||||
import {error, isEmpty, isNotEmpty} from "@/utils/index"
|
||||
export default {
|
||||
name: "login",
|
||||
data() {
|
||||
return {
|
||||
loginForm: {
|
||||
username: 'demo',
|
||||
password: '111111'
|
||||
},
|
||||
redirect: undefined
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
$route: {
|
||||
handler: function(route) {
|
||||
this.redirect = route.query && route.query.redirect
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleLogin() {
|
||||
if(isNotEmpty(this.loginForm.username)&&isNotEmpty(this.loginForm.password)){
|
||||
this.loading = true
|
||||
this.$store.dispatch('user/login', this.loginForm).then(() => {
|
||||
this.$router.push({ path: this.redirect || '/' })
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
})
|
||||
}else{
|
||||
error('请完善登陆信息！')
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style scoped src="@/styles/login/css/font-awesome.min.css"/>
|
||||
<style scoped src="@/styles/login/css/main.css"/>
|
||||
<style scoped src="@/styles/login/css/util.css"/>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
267
web/src/views/menu/index.vue
Normal file
267
web/src/views/menu/index.vue
Normal file
@@ -0,0 +1,267 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
ref="tree"
|
||||
v-loading="listLoading"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
:data="list"
|
||||
row-key="id"
|
||||
default-expand-all
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}"
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="120"
|
||||
>
|
||||
<template slot-scope="scope">{{ scope.row.id }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
label="排序"
|
||||
width="80"
|
||||
>
|
||||
<template slot-scope="scope">{{ scope.row.sort }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="菜单名称"
|
||||
>
|
||||
<template slot-scope="scope">{{ scope.row.title }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="菜单标识"
|
||||
>
|
||||
<template slot-scope="scope">{{ scope.row.name }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="菜单路径"
|
||||
>
|
||||
<template slot-scope="scope">{{ scope.row.path }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
align="center"
|
||||
label="状态"
|
||||
width="100"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch :value="scope.row.status" :active-value="1" :inactive-value="0" @change="handleUpdateStatus(scope)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
align="center"
|
||||
label="操作"
|
||||
width="270"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="append(scope)"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="菜单排序">
|
||||
<el-input-number v-model="temp.sort" :precision="0" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="所属上级">
|
||||
<el-cascader
|
||||
v-model="temp.pid"
|
||||
:options="parents"
|
||||
:props="{ checkStrictly: true, emitPath: false, expandTrigger: 'hover', value: 'id', label: 'title' }"
|
||||
:show-all-levels="false"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入菜单名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单标识">
|
||||
<el-input v-model="temp.name" placeholder="请输入菜单标识" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单图标">
|
||||
<el-input v-model="temp.icon" placeholder="请输入菜单图标" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单路径">
|
||||
<el-input v-model="temp.path" placeholder="请输入菜单路径" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getList } from '@/api/menu'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
pid: '',
|
||||
sort: 0,
|
||||
title: '',
|
||||
name: '',
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
filterText: '',
|
||||
list: [],
|
||||
parents: [],
|
||||
defaultProps: {
|
||||
children: 'children',
|
||||
label: 'title'
|
||||
},
|
||||
listLoading: true,
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList().then(response => {
|
||||
this.list = response.data.list
|
||||
this.parents = [...[{
|
||||
id: '',
|
||||
title: '根目录'
|
||||
}], ...response.data.list]
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
append(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'append'
|
||||
const temp = deepClone(scope.row)
|
||||
this.temp.pid = temp.id
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
7
web/src/views/nested/menu1/index.vue
Normal file
7
web/src/views/nested/menu1/index.vue
Normal file
@@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="二级菜单">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
7
web/src/views/nested/menu1/menu1-1/index.vue
Normal file
7
web/src/views/nested/menu1/menu1-1/index.vue
Normal file
@@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="三级菜单" type="success">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
7
web/src/views/nested/menu1/menu1-2/index.vue
Normal file
7
web/src/views/nested/menu1/menu1-2/index.vue
Normal file
@@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="三级菜单" type="success">
|
||||
<router-view />
|
||||
</el-alert>
|
||||
</div>
|
||||
</template>
|
||||
5
web/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
Normal file
5
web/src/views/nested/menu1/menu1-2/menu1-2-1/index.vue
Normal file
@@ -0,0 +1,5 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="四级菜单" type="warning" />
|
||||
</div>
|
||||
</template>
|
||||
5
web/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
Normal file
5
web/src/views/nested/menu1/menu1-2/menu1-2-2/index.vue
Normal file
@@ -0,0 +1,5 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="四级菜单" type="warning" />
|
||||
</div>
|
||||
</template>
|
||||
5
web/src/views/nested/menu1/menu1-3/index.vue
Normal file
5
web/src/views/nested/menu1/menu1-3/index.vue
Normal file
@@ -0,0 +1,5 @@
|
||||
<template functional>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="三级菜单" type="success" />
|
||||
</div>
|
||||
</template>
|
||||
5
web/src/views/nested/menu2/index.vue
Normal file
5
web/src/views/nested/menu2/index.vue
Normal file
@@ -0,0 +1,5 @@
|
||||
<template>
|
||||
<div style="padding:30px;">
|
||||
<el-alert :closable="false" title="二级菜单" />
|
||||
</div>
|
||||
</template>
|
||||
12
web/src/views/redirect/index.vue
Normal file
12
web/src/views/redirect/index.vue
Normal file
@@ -0,0 +1,12 @@
|
||||
<script>
|
||||
export default {
|
||||
created() {
|
||||
const { params, query } = this.$route
|
||||
const { path } = params
|
||||
this.$router.replace({ path: '/' + path, query })
|
||||
},
|
||||
render: function(h) {
|
||||
return h() // avoid warning message
|
||||
}
|
||||
}
|
||||
</script>
|
||||
305
web/src/views/role/index.vue
Normal file
305
web/src/views/role/index.vue
Normal file
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
<el-table-column
|
||||
fixed
|
||||
label="ID"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.id }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="用户组名称"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.title }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="用户组标识"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.name }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="状态"
|
||||
width="80"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
:value="scope.row.status"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
@change="changeStatus($event, scope)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<el-dialog
|
||||
:visible.sync="dialogVisible"
|
||||
:title="dialogType === 'modify' ? '修改' : '新增'"
|
||||
>
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
label-position="right"
|
||||
>
|
||||
<el-form-item label="用户组名称">
|
||||
<el-input v-model="temp.title" placeholder="请输入用户组名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="用户组标识">
|
||||
<el-input v-model="temp.name" placeholder="请输入用户组标识" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菜单权限">
|
||||
<el-tree
|
||||
ref="tree"
|
||||
:data="menus"
|
||||
:props="defaultMenuProps"
|
||||
show-checkbox
|
||||
accordion
|
||||
node-key="id"
|
||||
class="permission-tree"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="用户组状态">
|
||||
<el-radio-group v-model="temp.status">
|
||||
<el-radio :label="0">禁用</el-radio>
|
||||
<el-radio :label="1">正常</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="text-align:right;">
|
||||
<el-button type="danger" @click="dialogVisible = false">
|
||||
取消
|
||||
</el-button>
|
||||
<el-button type="primary" @click="submit">
|
||||
确定
|
||||
</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination'
|
||||
import { getList } from '@/api/role'
|
||||
import { getList as getMenu } from '@/api/menu'
|
||||
import { deepClone } from '@/utils'
|
||||
|
||||
const _temp = {
|
||||
id: '',
|
||||
title: '',
|
||||
name: '',
|
||||
perm: [],
|
||||
status: 1
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Pagination
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
menus: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
},
|
||||
temp: Object.assign({}, _temp),
|
||||
dialogVisible: false,
|
||||
dialogType: 'create',
|
||||
loading: false,
|
||||
defaultMenuProps: {
|
||||
children: 'children',
|
||||
label: 'title'
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
this.fetchMenu()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = {
|
||||
page: 1,
|
||||
limit: 20,
|
||||
keyword: undefined
|
||||
}
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getList(this.listQuery).then(response => {
|
||||
this.list = response.data.items
|
||||
this.total = response.data.total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
fetchMenu() {
|
||||
getMenu().then(response => {
|
||||
this.menus = response.data.list
|
||||
})
|
||||
},
|
||||
resetTemp() {
|
||||
this.temp = Object.assign({}, _temp)
|
||||
},
|
||||
add() {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'create'
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
edit(scope) {
|
||||
this.resetTemp()
|
||||
this.dialogVisible = true
|
||||
this.dialogType = 'modify'
|
||||
this.temp = deepClone(scope.row)
|
||||
this.$nextTick(() => {
|
||||
this.$refs['dataForm'].clearValidate()
|
||||
})
|
||||
},
|
||||
changeStatus(value, scope) {
|
||||
setTimeout(() => {
|
||||
this.list[scope.$index].status = value
|
||||
this.$message({
|
||||
message: '更新成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
},
|
||||
del(scope) {
|
||||
this.$confirm('确认删除该条数据吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
setTimeout(() => {
|
||||
this.list.splice(scope.$index, 1)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
}, 300)
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.dialogVisible = false
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
155
web/src/views/site/index.vue
Normal file
155
web/src/views/site/index.vue
Normal file
@@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form
|
||||
ref="dataForm"
|
||||
v-loading="listLoading"
|
||||
:model="temp"
|
||||
label-width="120px"
|
||||
>
|
||||
<div class="form-container">
|
||||
<div class="form-container-body">
|
||||
<el-row>
|
||||
<el-col :md="18" :lg="18" :xl="18">
|
||||
<el-form-item label="关闭站点">
|
||||
<el-radio-group v-model="temp.is_close">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="开启验证码">
|
||||
<el-radio-group v-model="temp.enable_captcha">
|
||||
<el-radio :label="1">开启</el-radio>
|
||||
<el-radio :label="0">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="站点名称" prop="site_name">
|
||||
<el-input v-model="temp.site_name" placeholder="请输入站点名称" @keyup.enter.native="submit" />
|
||||
</el-form-item>
|
||||
<el-form-item label="站点logo">
|
||||
<el-upload
|
||||
class="avatar-uploader"
|
||||
:action="uploadUrl"
|
||||
:show-file-list="false"
|
||||
:on-success="handleAvatarSuccess"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
>
|
||||
<img v-if="temp.site_logo" :src="temp.site_logo" class="avatar">
|
||||
<i v-else class="el-icon-plus avatar-uploader-icon" />
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="SEO关键词">
|
||||
<el-input v-model="temp.keywords" placeholder="请输入SEO关键词" @keyup.enter.native="submit" />
|
||||
</el-form-item>
|
||||
<el-form-item label="SEO描述">
|
||||
<el-input v-model="temp.description" placeholder="请输入SEO描述" type="textarea" />
|
||||
</el-form-item>
|
||||
<el-form-item label="版权所有">
|
||||
<el-input v-model="temp.copyright" placeholder="请输入版权所有" @keyup.enter.native="submit" />
|
||||
</el-form-item>
|
||||
<el-form-item label="公司名称">
|
||||
<el-input v-model="temp.company" placeholder="请输入公司名称" @keyup.enter.native="submit" />
|
||||
</el-form-item>
|
||||
<el-form-item label="联系人">
|
||||
<el-input v-model="temp.contact" placeholder="请输入联系人" @keyup.enter.native="submit">
|
||||
<i slot="append" class="el-icon-user" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系QQ">
|
||||
<el-input v-model="temp.qq" placeholder="请输入联系电话" @keyup.enter.native="submit">
|
||||
<i slot="append" class="el-icon-phone-outline" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="电子邮件">
|
||||
<el-input v-model="temp.email" placeholder="请输入电子邮件" @keyup.enter.native="submit">
|
||||
<i slot="append" class="el-icon-document-copy" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系地址">
|
||||
<el-input v-model="temp.address" placeholder="请输入联系地址" @keyup.enter.native="submit">
|
||||
<i slot="append" class="el-icon-location" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div class="form-container-footer">
|
||||
<el-button type="primary" @click="submit">提交</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
const _temp = {
|
||||
is_close: 0,
|
||||
enable_captcha: 0,
|
||||
site_name: '逐影未来',
|
||||
site_logo: 'https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif?imageView2/1/w/146/h/146',
|
||||
keywords: '逐影未来',
|
||||
description: '逐影未来',
|
||||
copyright: '逐影未来',
|
||||
contact: '逐影未来',
|
||||
qq: '2264535745',
|
||||
email: '2264535745@qq.com',
|
||||
company: '逐影未来',
|
||||
address: ''
|
||||
}
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
listLoading: false,
|
||||
loading: false,
|
||||
uploadUrl: '',
|
||||
temp: Object.assign({}, _temp)
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getInfo()
|
||||
},
|
||||
methods: {
|
||||
handleAvatarSuccess(res, file) {
|
||||
this.temp.site_logo = URL.createObjectURL(file.raw)
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
if (!this.uploadUrl) {
|
||||
this.$message.error('请设置正确的图片上传地址!')
|
||||
return false
|
||||
}
|
||||
const isJPG = file.type === 'image/*'
|
||||
const isLt2M = file.size / 1024 / 1024 < 2
|
||||
if (!isJPG) {
|
||||
this.$message.error('只能上传图片格式!')
|
||||
}
|
||||
if (!isLt2M) {
|
||||
this.$message.error('上传图片大小不能超过 2MB!')
|
||||
}
|
||||
return isJPG && isLt2M
|
||||
},
|
||||
getInfo() {
|
||||
if (this.listLoading) {
|
||||
return false
|
||||
}
|
||||
this.listLoading = true
|
||||
setTimeout(() => {
|
||||
this.listLoading = false
|
||||
}, 100)
|
||||
},
|
||||
submit() {
|
||||
if (this.loading) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.$message({
|
||||
message: '提交成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.loading = false
|
||||
}, 300)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
138
web/src/views/system/dept/addDept.vue
Normal file
138
web/src/views/system/dept/addDept.vue
Normal file
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="15vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="机构名称" prop="deptName" class="is-required">
|
||||
<el-input v-model="temp.deptName" placeholder="机构名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="机构编号" prop="deptNo" class="is-required">
|
||||
<el-input v-model="temp.deptNo" placeholder="机构编号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="上级机构" prop="parentId" class="is-required">
|
||||
<DeptCascader ref="deptCascader" v-model="temp.parentId"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="省 - 市 - 县" prop="province" class="is-required">
|
||||
<el-cascader
|
||||
style="width: 80%;"
|
||||
size="large"
|
||||
:options="options"
|
||||
v-model="selectedOptions"
|
||||
:props="{ expandTrigger: 'hover' }"
|
||||
@change="handleChange"
|
||||
filterable
|
||||
>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item label="过期时间" prop="expireDate" class="is-required">
|
||||
<el-date-picker
|
||||
v-model="temp.expireDate"
|
||||
type="date"
|
||||
placeholder="选择到期时间"
|
||||
value-format="yyyy-MM-dd"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" >
|
||||
<el-input type="textarea" v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addDept,getDeptTree} from "@/api/system/dept/dept";
|
||||
import {setRequiredFields,regroupCascaderData} from "@/utils";
|
||||
import DeptSelect from '@/views/common/system/deptSelect'
|
||||
import DeptCascader from '@/views/common/system/deptCascader'
|
||||
const requiredFields = ['deptName','deptNo','parentId']
|
||||
import { regionData,codeToText } from 'element-china-area-data'
|
||||
|
||||
export default {
|
||||
name: "addForm",
|
||||
components: { DeptCascader, DeptSelect },
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
deptId:'',
|
||||
deptName:'',
|
||||
deptNo:'',
|
||||
parentId:'',
|
||||
expireDate:'',
|
||||
remark:'',
|
||||
},
|
||||
options: regionData,
|
||||
selectedOptions: []
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['deptCascader'].fetchData()
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addDept(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleChange (value) {
|
||||
this.temp.province = codeToText[value[0]]
|
||||
this.temp.city = codeToText[value[1]]
|
||||
this.temp.area = codeToText[value[2]]
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
234
web/src/views/system/dept/deptList.vue
Normal file
234
web/src/views/system/dept/deptList.vue
Normal file
@@ -0,0 +1,234 @@
|
||||
<template>
|
||||
<div class="app-container" id="app">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="tableData"
|
||||
style="width: 100%;margin-bottom: 20px;"
|
||||
row-key="deptId"
|
||||
border
|
||||
default-expand-all
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
||||
|
||||
<el-table-column
|
||||
label="机构名称"
|
||||
width="150"
|
||||
align="left"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.deptName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="机构编号"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.deptNo }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="上级机构"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.parentName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="过期时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.expireDate }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="备注"
|
||||
width="320"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.remark }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {deleteDept,getDeptTree} from "@/api/system/dept/dept";
|
||||
import { deepClone, success } from '@/utils'
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/system/dept/addDept";
|
||||
import editForm from "@/views/system/dept/editDept";
|
||||
|
||||
export default {
|
||||
name: 'dept',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
tableData: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getDeptTree().then(response=>{
|
||||
this.tableData = response.data
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteDept(scope.row.deptId).then(response => {
|
||||
console.log(response)
|
||||
success('删除成功')
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
109
web/src/views/system/dept/editDept.vue
Normal file
109
web/src/views/system/dept/editDept.vue
Normal file
@@ -0,0 +1,109 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="机构名称" prop="deptName" class="is-required">
|
||||
<el-input v-model="temp.deptName" placeholder="机构名称" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="机构编号" prop="deptNo" class="is-required">
|
||||
<el-input v-model="temp.deptNo" placeholder="机构编号" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="上级机构" prop="parentId" class="is-required">
|
||||
<DeptCascader ref="deptCascader" v-model="temp.parentId"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="过期时间" prop="expireDate" class="is-required">
|
||||
<el-date-picker
|
||||
v-model="temp.expireDate"
|
||||
type="date"
|
||||
placeholder="选择到期时间"
|
||||
value-format="yyyy-MM-dd"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" >
|
||||
<el-input type="textarea" v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editDept } from "@/api/system/dept/dept";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
import DeptCascader from '@/views/common/system/deptCascader'
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
components: { DeptCascader },
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
deptId:'',
|
||||
deptName:'',
|
||||
deptNo:'',
|
||||
parentId:'',
|
||||
expireDate:'',
|
||||
remark:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editDept(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
149
web/src/views/system/menu/addMenu.vue
Normal file
149
web/src/views/system/menu/addMenu.vue
Normal file
@@ -0,0 +1,149 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="上级菜单" prop="parentId" class="is-required">
|
||||
<MenuCascader ref="menuCascader" v-model="temp.parentId"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单标题" prop="menuTitle" class="is-required">
|
||||
<el-input v-model="temp.menuTitle" placeholder="菜单标题"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单类型" prop="menuType" class="is-required">
|
||||
<el-radio-group v-model="temp.menuType">
|
||||
<el-radio-button label="1">菜单</el-radio-button>
|
||||
<el-radio-button label="2">权限</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="菜单名" prop="menuName" class="is-required">
|
||||
<el-input v-model="temp.menuName" placeholder="菜单名"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="菜单路径" prop="menuPath">
|
||||
<el-input v-model="temp.menuPath" placeholder="菜单路径"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单排序">
|
||||
<el-input type="number" v-model="temp.menuSort" placeholder="请输入菜单排序" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="菜单图标" prop="menuIcon">
|
||||
<e-icon-picker v-model="temp.menuIcon" :options="options"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="组件" prop="component" class="is-required">
|
||||
<el-input v-model="temp.component" placeholder="组件"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="页面缓存" prop="menuCache" class="is-required">
|
||||
<el-radio-group v-model="temp.menuCache">
|
||||
<el-radio :label="1">开启</el-radio>
|
||||
<el-radio :label="2">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item v-show="temp.menuType==2" label="权限标识" prop="perms" class="is-required">
|
||||
<el-input v-model="temp.perms" placeholder="权限标识"/>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { EIconPicker } from 'e-icon-picker'
|
||||
import 'e-icon-picker/lib/index.css' // 基本样式，包含基本图标
|
||||
|
||||
import { addMenu, getMenuTree } from '@/api/system/menu/menu'
|
||||
import { setRequiredFields } from '@/utils'
|
||||
import MenuCascader from '@/views/common/system/menuCascader'
|
||||
|
||||
const requiredFields = ['parentId', 'menuTitle', 'menuType']
|
||||
export default {
|
||||
name: 'addForm',
|
||||
components: { MenuCascader, EIconPicker },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
ElementUI: true
|
||||
},
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
menuId: '',
|
||||
parentId: '',
|
||||
menuTitle: '',
|
||||
menuName: '',
|
||||
menuIcon: '',
|
||||
menuPath: '',
|
||||
component: '',
|
||||
menuCache:1,
|
||||
perms: '',
|
||||
menuType: 1,
|
||||
menuSort: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['menuCascader'].fetchData()
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addMenu(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
147
web/src/views/system/menu/editMenu.vue
Normal file
147
web/src/views/system/menu/editMenu.vue
Normal file
@@ -0,0 +1,147 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="上级菜单" prop="parentId" class="is-required">
|
||||
<MenuCascader ref="menuCascader" v-model="temp.parentId"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单标题" prop="menuTitle" class="is-required">
|
||||
<el-input v-model="temp.menuTitle" placeholder="菜单标题"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单名" prop="menuName" class="is-required">
|
||||
<el-input v-model="temp.menuName" placeholder="菜单名"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单类型" prop="menuType" class="is-required">
|
||||
<el-radio-group v-model="temp.menuType">
|
||||
<el-radio-button label="1">菜单</el-radio-button>
|
||||
<el-radio-button label="2">权限</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="菜单路径" prop="menuPath">
|
||||
<el-input v-model="temp.menuPath" placeholder="菜单路径"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单排序">
|
||||
<el-input type="number" v-model="temp.menuSort" placeholder="请输入菜单排序" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="菜单图标" prop="menuIcon">
|
||||
<e-icon-picker v-model="temp.menuIcon" :options="options"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="组件" prop="component" class="is-required">
|
||||
<el-input v-model="temp.component" placeholder="组件"/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==1" label="页面缓存" prop="menuCache" class="is-required">
|
||||
<el-radio-group v-model="temp.menuCache">
|
||||
<el-radio :label="1">开启</el-radio>
|
||||
<el-radio :label="2">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item v-show="temp.menuType==2" label="权限标识" prop="perms" class="is-required">
|
||||
<el-input v-model="temp.perms" placeholder="权限标识"/>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { EIconPicker } from 'e-icon-picker'
|
||||
import 'e-icon-picker/lib/index.css' // 基本样式，包含基本图标
|
||||
|
||||
import MenuCascader from '@/views/common/system/menuCascader'
|
||||
|
||||
import { editMenu } from '@/api/system/menu/menu'
|
||||
import { setRequiredFields } from '@/utils'
|
||||
|
||||
const requiredFields = ['parentId', 'menuTitle', 'menuName', 'menuType']
|
||||
|
||||
export default {
|
||||
name: 'editForm',
|
||||
components: { MenuCascader, EIconPicker },
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
ElementUI: true
|
||||
},
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
menuId: '',
|
||||
parentId: '',
|
||||
menuTitle: '',
|
||||
menuName: '',
|
||||
menuIcon: '',
|
||||
menuPath: '',
|
||||
menuUrl: '',
|
||||
component: '',
|
||||
menuCache:'',
|
||||
perms: '',
|
||||
menuType: '',
|
||||
menuSort: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs['menuCascader'].fetchData()
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editMenu(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!')
|
||||
return false
|
||||
}
|
||||
})
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
251
web/src/views/system/menu/menuList.vue
Normal file
251
web/src/views/system/menu/menuList.vue
Normal file
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
|
||||
<el-table
|
||||
:data="menuTree"
|
||||
style="width: 100%;margin-bottom: 20px;"
|
||||
row-key="menuId"
|
||||
border
|
||||
default-expand-all
|
||||
:tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
||||
|
||||
<el-table-column
|
||||
label="菜单标题"
|
||||
width="150"
|
||||
align="left"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.menuTitle }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="菜单名"
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.menuName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="菜单图标"
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.menuIcon }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="菜单文件路径"
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.menuPath }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="组件"
|
||||
width="230"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.component }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="权限标识"
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.perms }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="菜单类型 "
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-show="scope.row.menuType==1">菜单</span>
|
||||
<span v-show="scope.row.menuType==2">权限</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="页面缓存"
|
||||
width="170"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<span v-show="scope.row.menuCache==1">开启</span>
|
||||
<span v-show="scope.row.menuCache==2">关闭</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="200"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
</el-table>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getMenuPage,deleteMenu,getMenuTree} from "@/api/system/menu/menu";
|
||||
import {deepClone} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/system/menu/addMenu";
|
||||
import editForm from "@/views/system/menu/editMenu";
|
||||
|
||||
export default {
|
||||
name: 'menuList',
|
||||
components: {addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
menuTree:[],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getMenuTree().then(response=>{
|
||||
this.menuTree = response.data[0].children
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteMenu(scope.row.menuId).then(response => {
|
||||
console.log(response)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
84
web/src/views/system/role/addRole.vue
Normal file
84
web/src/views/system/role/addRole.vue
Normal file
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
<el-form-item label="角色名" prop="roleName" class="is-required">
|
||||
<el-input v-model="temp.roleName" placeholder="角色名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addRole} from "@/api/system/role/role";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
roleId:'',
|
||||
roleName:'',
|
||||
remark:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addRole(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
88
web/src/views/system/role/editRole.vue
Normal file
88
web/src/views/system/role/editRole.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="角色名" prop="roleName" class="is-required">
|
||||
<el-input v-model="temp.roleName" placeholder="角色名" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="备注" prop="remark" class="is-required">
|
||||
<el-input v-model="temp.remark" placeholder="备注" />
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { editRole } from "@/api/system/role/role";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
|
||||
export default {
|
||||
name: "editForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
roleId:'',
|
||||
roleName:'',
|
||||
remark:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open(row) {
|
||||
this.temp = this.$options.data().temp
|
||||
this.temp = row
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
editRole(this.temp).then(response => {
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields()
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
281
web/src/views/system/role/roleList.vue
Normal file
281
web/src/views/system/role/roleList.vue
Normal file
@@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<div class="filter-container">
|
||||
<el-input
|
||||
v-model="listQuery.keyword"
|
||||
size="small"
|
||||
placeholder="请输入关键词"
|
||||
clearable
|
||||
class="filter-item"
|
||||
style="width: 200px;margin-left: 10px;"
|
||||
/>
|
||||
<el-button-group style="margin-left: 10px;">
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
@click="search"
|
||||
>
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-refresh"
|
||||
@click="refresh"
|
||||
>
|
||||
重置
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
<el-button
|
||||
size="small"
|
||||
class="filter-item"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
style="margin-left: 10px;"
|
||||
@click="add"
|
||||
>
|
||||
新增
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
v-loading="listLoading"
|
||||
:data="list"
|
||||
element-loading-text="Loading"
|
||||
border
|
||||
fit
|
||||
height="100%"
|
||||
class="table-container"
|
||||
highlight-current-row
|
||||
>
|
||||
|
||||
<el-table-column
|
||||
label="角色名"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.roleName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="备注"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.remark }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="机构名"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.deptName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="创建人id"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.createId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改时间"
|
||||
width="160"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateTime }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateName }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="修改人id"
|
||||
width="150"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.updateId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
<el-table-column
|
||||
fixed="right"
|
||||
label="操作"
|
||||
width="320"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button-group>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="success"
|
||||
icon="el-icon-setting"
|
||||
@click="setting(scope)"
|
||||
>
|
||||
权限配置
|
||||
</el-button>
|
||||
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
@click="edit(scope)"
|
||||
>
|
||||
修改
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="del(scope)"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-button-group>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
:total="total"
|
||||
:page.sync="listQuery.page"
|
||||
:limit.sync="listQuery.limit"
|
||||
@pagination="fetchData"
|
||||
/>
|
||||
|
||||
<add-form ref="addForm" @ok="addOk" />
|
||||
<edit-form ref="editForm" @ok="editOk" />
|
||||
<SettingMenu ref="settingMenu" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getRolePage,deleteRole} from "@/api/system/role/role";
|
||||
import {deepClone} from "@/utils";
|
||||
|
||||
import confirm from "@/utils/confirm";
|
||||
import Pagination from '@/components/Pagination'
|
||||
import addForm from "@/views/system/role/addRole";
|
||||
import editForm from "@/views/system/role/editRole";
|
||||
import SettingMenu from '@/views/common/system/role/settingMenu'
|
||||
|
||||
export default {
|
||||
name: 'roleList',
|
||||
components: { SettingMenu, addForm,editForm,Pagination},
|
||||
data() {
|
||||
return {
|
||||
total: 0,
|
||||
list: [],
|
||||
listLoading: true,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 50,
|
||||
keyword: ''
|
||||
},
|
||||
temp: {},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchData()
|
||||
},
|
||||
methods: {
|
||||
search() {
|
||||
this.fetchData()
|
||||
},
|
||||
refresh() {
|
||||
this.listQuery = this.$options.data().listQuery
|
||||
this.fetchData()
|
||||
},
|
||||
fetchData() {
|
||||
this.listLoading = true
|
||||
getRolePage(this.listQuery).then(response => {
|
||||
const { records, total } = response.data
|
||||
this.list = records
|
||||
this.total = total
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
add(){
|
||||
this.$refs.addForm.open()
|
||||
},
|
||||
addOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
edit(scope) {
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.editForm.open(temp)
|
||||
},
|
||||
editOk(){
|
||||
this.fetchData()
|
||||
},
|
||||
setting(scope){
|
||||
const temp = deepClone(scope.row)
|
||||
this.$refs.settingMenu.open(temp)
|
||||
},
|
||||
del(scope) {
|
||||
confirm("确定要删除吗？").then(res=>{
|
||||
if(res){
|
||||
deleteRole(scope.row.roleId).then(response => {
|
||||
console.log(response)
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
this.fetchData()
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
116
web/src/views/system/roleMenu/addRoleMenu.vue
Normal file
116
web/src/views/system/roleMenu/addRoleMenu.vue
Normal file
@@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
top="8vh"
|
||||
width="40%"
|
||||
:visible.sync="dialogVisible"
|
||||
center
|
||||
@close="handleCancel"
|
||||
>
|
||||
<div class="el-dialog-div">
|
||||
<el-form
|
||||
:rules="rules"
|
||||
ref="dataForm"
|
||||
:model="temp"
|
||||
label-position="right"
|
||||
label-width="120px"
|
||||
style="height: 90%;"
|
||||
>
|
||||
|
||||
<el-form-item label="id" prop="id" class="is-required">
|
||||
<el-input v-model="temp.id" placeholder="id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="角色id" prop="roleId" class="is-required">
|
||||
<el-input v-model="temp.roleId" placeholder="角色id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="菜单id" prop="menuId" class="is-required">
|
||||
<el-input v-model="temp.menuId" placeholder="菜单id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建时间" prop="createTime" class="is-required">
|
||||
<el-input v-model="temp.createTime" placeholder="创建时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人" prop="createName" class="is-required">
|
||||
<el-input v-model="temp.createName" placeholder="创建人" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="创建人id" prop="createId" class="is-required">
|
||||
<el-input v-model="temp.createId" placeholder="创建人id" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改时间" prop="updateTime" class="is-required">
|
||||
<el-input v-model="temp.updateTime" placeholder="修改时间" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="修改人" prop="updateName" class="is-required">
|
||||
<el-input v-model="temp.updateName" placeholder="修改人" />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleCancel">取 消</el-button>
|
||||
<el-button type="primary" @click="submit">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {addRoleMenu} from "@/api/system/roleMenu/roleMenu";
|
||||
import {setRequiredFields} from "@/utils";
|
||||
const requiredFields = []
|
||||
export default {
|
||||
name: "addForm",
|
||||
data() {
|
||||
return {
|
||||
rules: setRequiredFields(requiredFields),
|
||||
dialogVisible: false,
|
||||
temp: {
|
||||
id:'',
|
||||
roleId:'',
|
||||
menuId:'',
|
||||
createTime:'',
|
||||
createName:'',
|
||||
createId:'',
|
||||
updateTime:'',
|
||||
updateName:'',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
open() {
|
||||
this.dialogVisible = true
|
||||
},
|
||||
submit() {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
addRoleMenu(this.temp).then(response =>{
|
||||
this.handleCancel()
|
||||
this.$emit('ok', response.data)
|
||||
})
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
handleCancel() {
|
||||
//初始化
|
||||
this.temp = this.$options.data().temp
|
||||
this.dialogVisible = false
|
||||
this.$refs['dataForm'].resetFields();
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user