Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
weixin_43827091
vue2-manage
提交
5011ae79
V
vue2-manage
项目概览
weixin_43827091
/
vue2-manage
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue2-manage
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
提交
5011ae79
编写于
5月 12, 2017
作者:
M
maguohua
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
add food page
上级
6fde13be
变更
5
隐藏空白更改
内联
并排
Showing
5 changed file
with
263 addition
and
23 deletion
+263
-23
README.md
README.md
+6
-3
src/api/getData.js
src/api/getData.js
+8
-3
src/page/addGoods.vue
src/page/addGoods.vue
+245
-13
src/page/addShop.vue
src/page/addShop.vue
+3
-3
src/page/manage.vue
src/page/manage.vue
+1
-1
未找到文件。
README.md
浏览文件 @
5011ae79
...
...
@@ -38,11 +38,11 @@ npm run dev
# 功能列表
-
[ ] 登陆/注销
-
[x] 登陆/注销
-
[x] 添加商铺
-
[x] 添加商品
-
[ ] 权限验证
-
[ ] 总体数据展示
-
[ ] 添加商铺
-
[ ] 添加商品
-
[ ] 管理用户
-
[ ] 管理商铺
-
[ ] 地区管理
...
...
@@ -66,6 +66,9 @@ npm run dev
## 添加商店
![](
http://cangdu.org/files/images/addshop.png
)
## 添加食品
![](
http://cangdu.org/files/images/addfood.png
)
### License
...
...
src/api/getData.js
浏览文件 @
5011ae79
...
...
@@ -13,7 +13,7 @@ const cityGuess = () => fetch('/v1/cities', {
* 添加商铺
*/
const
addShop
=
data
=>
fetch
(
'
/shopping/addShop
'
,
{...
data
}
,
'
POST
'
);
const
addShop
=
data
=>
fetch
(
'
/shopping/addShop
'
,
data
,
'
POST
'
);
/**
* 获取搜索地址
...
...
@@ -35,8 +35,13 @@ const getCategory = restaurant_id => fetch('/shopping/getcategory/' + restaurant
* 添加食品种类
*/
const
addCategory
=
data
=>
fetch
(
'
/shopping/addcategory
'
,
{...
data
},
'
POST
'
);
const
addCategory
=
data
=>
fetch
(
'
/shopping/addcategory
'
,
data
,
'
POST
'
);
/**
* 添加食品
*/
const
addFood
=
data
=>
fetch
(
'
/shopping/addfood
'
,
data
,
'
POST
'
);
export
{
cityGuess
,
addShop
,
searchplace
,
getCategory
,
addCategory
}
export
{
cityGuess
,
addShop
,
searchplace
,
getCategory
,
addCategory
,
addFood
}
src/page/addGoods.vue
浏览文件 @
5011ae79
...
...
@@ -2,11 +2,12 @@
<div>
<head-top></head-top>
<el-row
style=
"margin-top: 20px;"
>
<el-col
:span=
"12"
:offset=
"4"
>
<el-form
:model=
"categoryForm"
:rules=
"categoryrules"
ref=
"categoryForm"
label-width=
"110px"
class=
"category_form"
>
<el-col
:span=
"14"
:offset=
"4"
>
<header
class=
"form_header"
>
选择食品种类
</header>
<el-form
:model=
"categoryForm"
ref=
"categoryForm"
label-width=
"110px"
class=
"form"
>
<el-row
class=
"category_select"
>
<el-form-item
label=
"食品种类"
>
<el-select
v-model=
"categoryForm.categorySelect"
:placeholder=
"
categoryForm.categorySelect
"
style=
"width:100%;"
>
<el-select
v-model=
"categoryForm.categorySelect"
:placeholder=
"
selectValue.label
"
style=
"width:100%;"
>
<el-option
v-for=
"item in categoryForm.categoryList"
:key=
"item.value"
...
...
@@ -34,8 +35,100 @@
<i
class=
"el-icon-caret-bottom edit_icon"
v-else
slot=
"icon"
></i>
<span>
添加食品种类
</span>
</div>
</el-form>
<header
class=
"form_header"
>
添加食品
</header>
<el-form
:model=
"foodForm"
:rules=
"foodrules"
ref=
"foodForm"
label-width=
"110px"
class=
"form food_form"
>
<el-form-item
label=
"食品名称"
prop=
"name"
>
<el-input
v-model=
"foodForm.name"
></el-input>
</el-form-item>
<el-form-item
label=
"食品活动"
prop=
"activity"
>
<el-input
v-model=
"foodForm.activity"
></el-input>
</el-form-item>
<el-form-item
label=
"食品详情"
prop=
"description"
>
<el-input
v-model=
"foodForm.description"
></el-input>
</el-form-item>
<el-form-item
label=
"上传店铺头像"
>
<el-upload
class=
"avatar-uploader"
:action=
"baseUrl + '/shopping/addimg/food'"
:show-file-list=
"false"
:on-success=
"uploadImg"
:before-upload=
"beforeImgUpload"
>
<img
v-if=
"foodForm.image_path"
:src=
"baseUrl + foodForm.image_path"
class=
"avatar"
>
<i
v-else
class=
"el-icon-plus avatar-uploader-icon"
></i>
</el-upload>
</el-form-item>
<el-form-item
label=
"食品特点"
>
<el-select
v-model=
"foodForm.attributes"
multiple
placeholder=
"请选择"
>
<el-option
v-for=
"item in attributes"
:key=
"item.value"
:label=
"item.label"
:value=
"item.value"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item
label=
"食品规格"
>
<el-radio
class=
"radio"
v-model=
"foodSpecs"
label=
"one"
>
单规格
</el-radio>
<el-radio
class=
"radio"
v-model=
"foodSpecs"
label=
"more"
>
多规格
</el-radio>
</el-form-item>
<el-row
v-if=
"foodSpecs == 'one'"
>
<el-form-item
label=
"包装费"
>
<el-input-number
v-model=
"foodForm.specs[0].packing_fee"
:min=
"0"
:max=
"100"
></el-input-number>
</el-form-item>
<el-form-item
label=
"价格"
>
<el-input-number
v-model=
"foodForm.specs[0].price"
:min=
"0"
:max=
"10000"
></el-input-number>
</el-form-item>
</el-row>
<el-row
v-else
style=
"overflow: auto; text-align: center;"
>
<el-button
type=
"primary"
@
click=
"dialogFormVisible = true"
style=
"margin-bottom: 10px;"
>
添加规格
</el-button>
<el-table
:data=
"foodForm.specs"
style=
"margin-bottom: 20px;"
:row-class-name=
"tableRowClassName"
>
<el-table-column
prop=
"specs"
label=
"规格"
>
</el-table-column>
<el-table-column
prop=
"packing_fee"
label=
"包装费"
>
</el-table-column>
<el-table-column
prop=
"price"
label=
"价格"
>
</el-table-column>
<el-table-column
label=
"操作"
>
<template
scope=
"scope"
>
<el-button
size=
"small"
type=
"danger"
@
click=
"handleDelete(scope.$index)"
>
删除
</el-button>
</
template
>
</el-table-column>
</el-table>
</el-row>
<el-form-item>
<el-button
type=
"primary"
@
click=
"addFood('foodForm')"
>
确认添加食品
</el-button>
</el-form-item>
</el-form>
<el-dialog
title=
"添加规格"
v-model=
"dialogFormVisible"
>
<el-form
:rules=
"specsFormrules"
:model=
"specsForm"
>
<el-form-item
label=
"规格"
label-width=
"100px"
prop=
"specs"
>
<el-input
v-model=
"specsForm.specs"
auto-complete=
"off"
></el-input>
</el-form-item>
<el-form-item
label=
"包装费"
label-width=
"100px"
>
<el-input-number
v-model=
"specsForm.packing_fee"
:min=
"0"
:max=
"100"
></el-input-number>
</el-form-item>
<el-form-item
label=
"价格"
label-width=
"100px"
>
<el-input-number
v-model=
"specsForm.price"
:min=
"0"
:max=
"10000"
></el-input-number>
</el-form-item>
</el-form>
<div
slot=
"footer"
class=
"dialog-footer"
>
<el-button
@
click=
"dialogFormVisible = false"
>
取 消
</el-button>
<el-button
type=
"primary"
@
click=
"addspecs"
>
确 定
</el-button>
</div>
</el-dialog>
</el-col>
</el-row>
</div>
...
...
@@ -43,23 +136,56 @@
<
script
>
import
headTop
from
'
@/components/headTop
'
import
{
getCategory
,
addCategory
}
from
'
@/api/getData
'
import
{
getCategory
,
addCategory
,
addFood
}
from
'
@/api/getData
'
import
{
baseUrl
}
from
'
@/config/env
'
export
default
{
data
(){
return
{
baseUrl
,
restaurant_id
:
3
,
categoryForm
:
{
category
:
''
,
categoryList
:
[],
categorySelect
:
''
,
name
:
''
,
description
:
''
,
},
categoryrules
:
{
foodForm
:
{
name
:
''
,
description
:
''
,
image_path
:
''
,
activity
:
''
,
attributes
:
[],
specs
:
[{
specs
:
'
默认
'
,
packing_fee
:
0
,
price
:
20
,
}],
},
foodrules
:
{
name
:
[
{
required
:
true
,
message
:
'
请输入食品名称
'
,
trigger
:
'
blur
'
},
],
},
attributes
:
[{
value
:
'
新
'
,
label
:
'
新品
'
},
{
value
:
'
招牌
'
,
label
:
'
招牌
'
},],
showAddCategory
:
false
,
foodSpecs
:
'
one
'
,
dialogFormVisible
:
false
,
specsForm
:
{
specs
:
''
,
packing_fee
:
0
,
price
:
20
,
},
specsFormrules
:
{
specs
:
[
{
required
:
true
,
message
:
'
请输入规格
'
,
trigger
:
'
blur
'
},
],
}
}
},
components
:
{
...
...
@@ -68,14 +194,18 @@
mounted
(){
this
.
initData
();
},
computed
:
{
selectValue
:
function
(){
return
this
.
categoryForm
.
categoryList
[
this
.
categoryForm
.
categorySelect
]
||
{}
}
},
methods
:
{
async
initData
(){
try
{
const
result
=
await
getCategory
(
this
.
restaurant_id
);
console
.
log
(
result
)
if
(
result
.
status
==
1
)
{
result
.
category_list
.
map
(
item
=>
{
item
.
value
=
i
tem
.
name
;
result
.
category_list
.
map
(
(
item
,
index
)
=>
{
item
.
value
=
i
ndex
;
item
.
label
=
item
.
name
;
})
this
.
categoryForm
.
categoryList
=
result
.
category_list
;
...
...
@@ -91,7 +221,6 @@
},
submitcategoryForm
(
categoryForm
)
{
this
.
$refs
[
categoryForm
].
validate
(
async
(
valid
)
=>
{
console
.
log
(
categoryForm
)
if
(
valid
)
{
const
params
=
{
name
:
this
.
categoryForm
.
name
,
...
...
@@ -123,19 +252,96 @@
}
});
},
uploadImg
(
res
,
file
)
{
if
(
res
.
status
==
1
)
{
this
.
foodForm
.
image_path
=
res
.
image_path
;
}
else
{
this
.
$message
.
error
(
'
上传图片失败!
'
);
}
},
beforeImgUpload
(
file
)
{
const
isRightType
=
(
file
.
type
===
'
image/jpeg
'
)
||
(
file
.
type
===
'
image/png
'
);
const
isLt2M
=
file
.
size
/
1024
/
1024
<
2
;
if
(
!
isRightType
)
{
this
.
$message
.
error
(
'
上传头像图片只能是 JPG 格式!
'
);
}
if
(
!
isLt2M
)
{
this
.
$message
.
error
(
'
上传头像图片大小不能超过 2MB!
'
);
}
return
isRightType
&&
isLt2M
;
},
addspecs
(){
this
.
foodForm
.
specs
.
push
({...
this
.
specsForm
});
this
.
specsForm
.
specs
=
''
;
this
.
specsForm
.
packing_fee
=
0
;
this
.
specsForm
.
price
=
20
;
this
.
dialogFormVisible
=
false
;
},
handleDelete
(
index
){
this
.
foodForm
.
specs
.
splice
(
index
,
1
);
},
tableRowClassName
(
row
,
index
)
{
if
(
index
===
1
)
{
return
'
info-row
'
;
}
else
if
(
index
===
3
)
{
return
'
positive-row
'
;
}
return
''
;
},
addFood
(
foodForm
){
this
.
$refs
[
foodForm
].
validate
(
async
(
valid
)
=>
{
if
(
valid
)
{
const
params
=
{
...
this
.
foodForm
,
category_id
:
this
.
selectValue
.
id
,
restaurant_id
:
this
.
restaurant_id
,
}
try
{
const
result
=
await
addFood
(
params
);
if
(
result
.
status
==
1
)
{
console
.
log
(
result
)
this
.
$message
({
type
:
'
success
'
,
message
:
'
添加成功
'
});
}
}
catch
(
err
){
console
.
log
(
err
)
}
}
else
{
this
.
$notify
.
error
({
title
:
'
错误
'
,
message
:
'
请检查输入是否正确
'
,
offset
:
100
});
return
false
;
}
});
}
}
}
</
script
>
<
style
lang=
"less"
>
@import '../style/mixin';
.category_form{
.form{
min-width: 400px;
margin-bottom: 30px;
&:hover{
box-shadow: 0 0 8px 0 rgba(232,237,250,.6), 0 2px 4px 0 rgba(232,237,250,.5);
border-radius: 6px;
transition: all 400ms;
}
}
.food_form{
border: 1px solid #eaeefb;
padding: 10px 10px 0;
}
.form_header{
text-align: center;
margin-bottom: 10px;
}
.category_select{
border: 1px solid #eaeefb;
padding: 10px 30px 10px 10px;
...
...
@@ -180,4 +386,30 @@
transition: all 400ms;
}
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #20a0ff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 120px;
height: 120px;
line-height: 120px;
text-align: center;
}
.avatar {
width: 120px;
height: 120px;
display: block;
}
.cell{
text-align: center;
}
</
style
>
src/page/addShop.vue
浏览文件 @
5011ae79
...
...
@@ -72,7 +72,7 @@
<el-form-item
label=
"上传店铺头像"
>
<el-upload
class=
"avatar-uploader"
:action=
"baseUrl + '/shopping/addimg'"
:action=
"baseUrl + '/shopping/addimg
/shop
'"
:show-file-list=
"false"
:on-success=
"handleShopAvatarScucess"
:before-upload=
"beforeAvatarUpload"
>
...
...
@@ -83,7 +83,7 @@
<el-form-item
label=
"上传营业执照"
>
<el-upload
class=
"avatar-uploader"
:action=
"baseUrl + '/shopping/addimg'"
:action=
"baseUrl + '/shopping/addimg
/shop
'"
:show-file-list=
"false"
:on-success=
"handleBusinessAvatarScucess"
:before-upload=
"beforeAvatarUpload"
>
...
...
@@ -94,7 +94,7 @@
<el-form-item
label=
"上传餐饮服务许可证"
>
<el-upload
class=
"avatar-uploader"
:action=
"baseUrl + '/shopping/addimg'"
:action=
"baseUrl + '/shopping/addimg
/shop
'"
:show-file-list=
"false"
:on-success=
"handleServiceAvatarScucess"
:before-upload=
"beforeAvatarUpload"
>
...
...
src/page/manage.vue
浏览文件 @
5011ae79
...
...
@@ -37,7 +37,7 @@
</el-submenu>
</el-menu>
</el-col>
<el-col
:span=
"20"
style=
"height: 100%;overflow
-y
: auto;"
>
<el-col
:span=
"20"
style=
"height: 100%;overflow: auto;"
>
<router-view></router-view>
</el-col>
</el-row>
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录