Browse Source

增加营销中心

master
liuwk 6 years ago
parent
commit
31753253da
  1. 1
      package.json
  2. 3
      public/index.html
  3. 19
      src/api/common.js
  4. 652
      src/api/marketingCenter.js
  5. 2
      src/assets/custom-theme/index.css
  6. 3
      src/config.js
  7. 7
      src/filters/index.js
  8. 18
      src/router/modules/commodityManagement1.js
  9. 100
      src/router/modules/marketingCenter.js
  10. 3
      src/styles/index.scss
  11. 436
      src/views/commodityManagement/commodityClassification/classification.vue
  12. 6
      src/views/commodityManagement/commodityClassification/classificationList.vue
  13. 15
      src/views/commodityManagement/commodityClassification/index.vue
  14. 164
      src/views/commodityManagement/commodityClassification1/addEquipment.vue
  15. 429
      src/views/commodityManagement/commodityClassification1/classification.vue
  16. 219
      src/views/commodityManagement/commodityClassification1/classificationList.vue
  17. 68
      src/views/commodityManagement/commodityClassification1/index.vue
  18. 10
      src/views/layout/components/rightMenu/rightMenu.vue
  19. 2
      src/views/login/index.vue
  20. 388
      src/views/marketingCenter/couponManagement/couponDetails.vue
  21. 60
      src/views/marketingCenter/couponManagement/form.vue
  22. 491
      src/views/marketingCenter/couponManagement/index.vue
  23. 57
      src/views/marketingCenter/luckyDraw/form.vue
  24. 273
      src/views/marketingCenter/luckyDraw/index.vue
  25. 483
      src/views/marketingCenter/luckyDraw/luckyDrawDetails.vue
  26. 118
      src/views/marketingCenter/luckyDraw/winningSettings.vue
  27. 57
      src/views/marketingCenter/luckyFree/form.vue
  28. 273
      src/views/marketingCenter/luckyFree/index.vue
  29. 413
      src/views/marketingCenter/luckyFree/luckyFreeDetails.vue
  30. 57
      src/views/marketingCenter/noviceCourtesy/form.vue
  31. 336
      src/views/marketingCenter/noviceCourtesy/index.vue
  32. 315
      src/views/marketingCenter/noviceCourtesy/noviceCourtesyDetails.vue
  33. 57
      src/views/marketingCenter/paymentOfCourtesy/form.vue
  34. 272
      src/views/marketingCenter/paymentOfCourtesy/index.vue
  35. 430
      src/views/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails.vue
  36. 57
      src/views/marketingCenter/salesPromotion/form.vue
  37. 332
      src/views/marketingCenter/salesPromotion/index.vue
  38. 505
      src/views/marketingCenter/salesPromotion/salesPromotionDetails.vue
  39. 2
      src/views/order/salesOrder/index.vue

1
package.json

@ -4,6 +4,7 @@
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"dev": "npm run serve",
"build": "vue-cli-service build"
},
"dependencies": {

3
public/index.html

@ -22,10 +22,11 @@
<script src="//at.alicdn.com/t/font_1118495_l9d2ctejxr.js"></script>
<script src="//at.alicdn.com/t/font_1118495_8gx7uj5mos9.js"></script>
<script src="//at.alicdn.com/t/font_1118495_qy9m22tik77.js"></script>
<script src="//at.alicdn.com/t/font_1118495_gv94woly42.js"></script>
<!-- lodash -->
<script src="https://cdn.bootcss.com/lodash.js/4.17.12-pre/lodash.min.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<!-- built files will be auto injected -->
</body>
</html>
</html>

19
src/api/common.js

@ -25,6 +25,25 @@ export function GET_LOCATIONS(params) {
}).then(res => res.data.data)
}
export function GET_COUPONS(params) {
return request({
url: "/api/admin/coupons/select",
method: 'get',
params
}).then(res => res.data.data)
}
export function GET_VIPVARDS(params) {
return request({
url: "/api/admin/vipCards/select",
method: 'get',
params
}).then(res => res.data.data)
}
export function GET_ROLES(params) {
return request({
url: "/api/admin/roles/select",

652
src/api/marketingCenter.js

@ -0,0 +1,652 @@
import request from '@/utils/request'
/**
* todo 优惠券API
*/
/**
* 优惠券 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_couponManagement_LIST(params) {
return request({
url: "/api/admin/coupons",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_coupons(params) {
return request({
url: "/api/admin/coupons",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_coupons(params) {
return request({
url: "/api/admin/coupons?id=" + params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_coupons(params) {
return request({
url: "/api/admin/coupons/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_coupons(params) {
return request({
url: "/api/admin/coupons?id=" + params,
method: 'delete',
data: params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_coupons(params) {
return request({
url: "/api/admin/coupons/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 优惠券 -- 开始投放
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function ENABLE_coupons(params) {
return request({
url: "/api/admin/coupons/enable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* 优惠券 -- 暂停投放
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DISABLE_coupons(params) {
return request({
url: "/api/admin/coupons/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* 优惠券 -- 调整库存
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function updateStock_coupons(params) {
return request({
url: "/api/admin/coupons/updateStock",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* TODO 新手有礼API
*/
/**
* 新手有礼 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_couponOffers_LIST(params) {
return request({
url: "/api/admin/couponOffers",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_couponOffers(params) {
return request({
url: "/api/admin/couponOffers",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_couponOffers(params) {
return request({
url: "/api/admin/couponOffers?id=" + params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_couponOffers(params) {
return request({
url: "/api/admin/couponOffers/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_couponOffers(params) {
return request({
url: "/api/admin/couponOffers?id=" + params,
method: 'delete'
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_couponOffers(params) {
return request({
url: "/api/admin/couponOffers/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 新手有礼 -- 失效
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function disable_couponOffers(params) {
return request({
url: "/api/admin/couponOffers/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* TODO 支付有礼API
*/
/**
* 支付有礼 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_payGiftOffers_LIST(params) {
return request({
url: "/api/admin/payGiftOffers",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers?id="+ params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers?id=" + params,
method: 'delete'
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 支付有礼 -- 失效
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function disable_payGiftOffers(params) {
return request({
url: "/api/admin/payGiftOffers/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* TODO 促销活动API
*/
/**
* 促销活动 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_discountOffers_LIST(params) {
return request({
url: "/api/admin/discountOffers",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 促销活动 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_discountOffers(params) {
return request({
url: "/api/admin/discountOffers",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 促销活动 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_discountOffers(params) {
return request({
url: "/api/admin/discountOffers?id="+ params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 促销活动 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_discountOffers(params) {
return request({
url: "/api/admin/discountOffers/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 促销活动 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_discountOffers(params) {
return request({
url: "/api/admin/discountOffers?id=" + params,
method: 'delete'
}).then(res => res.data.data)
}
/**
* 促销活动 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_discountOffers(params) {
return request({
url: "/api/admin/discountOffers/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 促销活动 -- 失效
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function disable_discountOffers(params) {
return request({
url: "/api/admin/discountOffers/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* TODO 幸运免单API
*/
/**
* 幸运免单 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_luckfree_LIST(params) {
return request({
url: "/api/admin/luckfree",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_luckfree(params) {
return request({
url: "/api/admin/luckfree",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_luckfree(params) {
return request({
url: "/api/admin/luckfree?id="+ params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_luckfree(params) {
return request({
url: "/api/admin/luckfree/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_luckfree(params) {
return request({
url: "/api/admin/luckfree?id=" + params,
method: 'delete'
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_luckfree(params) {
return request({
url: "/api/admin/luckfree/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 失效
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function disable_luckfree(params) {
return request({
url: "/api/admin/luckfree/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}
/**
* 幸运免单 -- 计算
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function luckfree_calculate(params) {
return request({
url: "/api/admin/luckfree/calculate",
method: 'post',
data:params
}).then(res => res.data.data)
}
/**
* TODO 抽奖活动API
*/
/**
* 抽奖活动 -- 列表
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function GET_lottery_LIST(params) {
return request({
url: "/api/admin/lottery",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 新建
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function POST_lottery(params) {
return request({
url: "/api/admin/lottery",
method: 'post',
data: params
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 更新
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function PUT_lottery(params) {
return request({
url: "/api/admin/lottery?id="+ params.id,
method: 'put',
data: params
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 详情
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DETAIL_lottery(params) {
return request({
url: "/api/admin/lottery/detail?id=" + params,
method: 'get',
data: params
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 删除
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function DELETE_lottery(params) {
return request({
url: "/api/admin/lottery?id=" + params,
method: 'delete'
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 总数
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function COUNT_lottery(params) {
return request({
url: "/api/admin/lottery/count",
method: 'get',
params
}).then(res => res.data.data)
}
/**
* 抽奖活动 -- 失效
* @returns {Q.Promise<any> | * | Q.Promise<T | never> | PromiseLike<T | never> | Promise<T | never>}
* @constructor
*/
export function disable_lottery(params) {
return request({
url: "/api/admin/lottery/disable?id=" + params,
method: 'post'
}).then(res => res.data.data)
}

2
src/assets/custom-theme/index.css

File diff suppressed because one or more lines are too long

3
src/config.js

@ -1,7 +1,8 @@
export const BASE_API = "https://rapapi.renqilai.com/app/mock/39";
// export const BASE_API = "https://rapapi.renqilai.com/app/mock/39";
export const client_id = 'test'
export const client_secret = "test"
// export const BASE_API = "http://192.168.0.222:8080"
export const BASE_API = "https://quxiaapi.renqilai.com"
export const pageSize = 20

7
src/filters/index.js

@ -54,6 +54,13 @@ export function dateTimeFormateHHmm(date) {
}
export function FormateYYMMDD(date) {
return moment(date).format('YYYY-MM-DD')
}
export function clone(valu) {
return JSON.parse(JSON.stringify(valu))
}

18
src/router/modules/commodityManagement1.js

@ -0,0 +1,18 @@
import Layout from '@/views/layout/Layout'
const commodityManagement1 = {
path: '/commodityManagement1',
component: Layout,
meta: {title: '商品管理', icon: 'shangpinguanli', noCache: true, affix: false},
children: [
{
path: '/commodityManagement1/commodityManagement1',
component: () => import('@/views/commodityManagement/commodityClassification1/index'),
name: '商品分类',
meta: {title: '商品分类', noCache: false, affix: false},
}
]
};
export default commodityManagement1

100
src/router/modules/marketingCenter.js

@ -0,0 +1,100 @@
import Layout from '@/views/layout/Layout'
const marketingCenter = {
path: '/marketingCenter',
component: Layout,
meta: {title: '营销中心', icon: 'yunyingguanli', noCache: true, affix: false},
children: [
{
path: '/marketingCenter/couponManagement',
component: () => import('@/views/marketingCenter/couponManagement/index'),
name: '优惠券管理',
/* affix: true 一直固定不关闭 */
meta: {title: '优惠券管理', noCache: false, affix: false}
},
{
path: '/marketingCenter/couponManagement/couponDetails',
component: () => import('@/views/marketingCenter/couponManagement/couponDetails'),
name: '优惠券新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '优惠券新增/编辑', noCache: false, affix: false}
},
{
path: '/marketingCenter/noviceCourtesy',
component: () => import('@/views/marketingCenter/noviceCourtesy/index'),
name: '新手有礼',
/* affix: true 一直固定不关闭 */
meta: {title: '新手有礼', noCache: false, affix: false}
},
{
path: '/marketingCenter/noviceCourtesy/noviceCourtesyDetails',
component: () => import('@/views/marketingCenter/noviceCourtesy/noviceCourtesyDetails'),
name: '新手有礼新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '新手有礼新增/编辑', noCache: false, affix: false}
},
{
path: '/marketingCenter/paymentOfCourtesy',
component: () => import('@/views/marketingCenter/paymentOfCourtesy/index'),
name: '支付有礼',
/* affix: true 一直固定不关闭 */
meta: {title: '支付有礼', noCache: false, affix: false}
},
{
path: '/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails',
component: () => import('@/views/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails'),
name: '支付有礼新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '支付有礼新增/编辑', noCache: false, affix: false}
},
{
path: '/marketingCenter/salesPromotion',
component: () => import('@/views/marketingCenter/salesPromotion/index'),
name: '促销活动',
/* affix: true 一直固定不关闭 */
meta: {title: '促销活动', noCache: false, affix: false}
},
{
path: '/marketingCenter/salesPromotion/salesPromotionDetails',
component: () => import('@/views/marketingCenter/salesPromotion/salesPromotionDetails'),
name: '促销活动新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '促销活动新增/编辑', noCache: false, affix: false}
},
{
path: '/marketingCenter/luckyFree',
component: () => import('@/views/marketingCenter/luckyFree/index'),
name: '幸运免单',
/* affix: true 一直固定不关闭 */
meta: {title: '幸运免单', noCache: false, affix: false}
},
{
path: '/marketingCenter/luckyFree/luckyFreeDetails',
component: () => import('@/views/marketingCenter/luckyFree/luckyFreeDetails'),
name: '幸运免单新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '幸运免单新增/编辑', noCache: false, affix: false}
},
{
path: '/marketingCenter/luckyDraw',
component: () => import('@/views/marketingCenter/luckyDraw/index'),
name: '抽奖活动',
/* affix: true 一直固定不关闭 */
meta: {title: '抽奖活动', noCache: false, affix: false}
},
{
path: '/marketingCenter/luckyDraw/luckyDrawDetails',
component: () => import('@/views/marketingCenter/luckyDraw/luckyDrawDetails'),
name: '抽奖活动新增/编辑',
hidden: true,
/* affix: true 一直固定不关闭 */
meta: {title: '抽奖活动新增/编辑', noCache: false, affix: false}
},
]
};
export default marketingCenter

3
src/styles/index.scss

@ -232,3 +232,6 @@ h1, h2, h3 {
border-radius: 6px;
background-color: #ccc;
}
.el-date-editor .el-range-separator {
width: 7%;
}

436
src/views/commodityManagement/commodityClassification/classification.vue

@ -1,45 +1,94 @@
<template>
<div class="classification">
<p>商品分类</p>
<div class="classification-list">
<draggable tag="ul" handle=".handleMove" :sort="isSort" v-model="lists" @update="itemDragEnd">
<li :class="{'select':item.isSel}" @click="liItemClick(item.id,item.edit,item.products)"
v-for="(item,index) in lists">
<span class="handleMove">
<svg-icon icon-class="move"></svg-icon>
</span>
<div class="info" v-show="!item.edit">
<p>{{item.name}}</p>
<p>{{item.products}}件商品</p>
<el-button type="primary" @click.stop="editItem(index)">编辑
</el-button>
</div>
<div class="edit" v-show="item.edit">
<p>{{titleName}}</p>
<div class="demo-input-suffix">
<span>分类名称</span>
<el-input
placeholder=""
@focus.stop="itemfoucsValue(item.name)"
v-model="item.name">
</el-input>
</div>
<div class="opiItem">
<el-button type="danger" @click.stop="removeItem(index)">删除分类</el-button>
<div>
<el-button @click.stop="cancelItem(index)">取消</el-button>
<el-button type="primary" @click.stop="confirmItem(index)">确认</el-button>
</div>
</div>
</div>
</li>
<li @click="addList" class="addList">
<p>
<svg-icon icon-class="plus1"></svg-icon>
</p>
<el-row>
<el-button type="primary" @click="opiClassification">
添加分类
</li>
</draggable>
</el-button>
</el-row>
<el-table
:data="lists"
@row-click="openDetails"
style="width: 100%">
<el-table-column
prop="name"
label="分类名称">
<template slot-scope="lists">
<span :class="{'select':lists.row.isSel}"> {{lists.row.name}} </span>
</template>
</el-table-column>
<el-table-column
align="center"
width="80"
label="商品(件)">
<template slot-scope="lists">
<span :class="{'select':lists.row.isSel}"> {{lists.row.products}} </span>
</template>
</el-table-column>
<el-table-column
align="center"
width="50"
label="排序">
<template slot-scope="lists">
<span :class="{'select':lists.row.isSel}"> {{lists.row.displayOrder}} </span>
</template>
</el-table-column>
<el-table-column
align="createdDate"
label="创建时间">
<template slot-scope="lists">
<span :class="{'select':lists.row.isSel}"> {{lists.row.createdDate | filterCreatedDate}} </span>
</template>
</el-table-column>
<el-table-column
width="100"
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
type="text"
size="small"
class="option-span"
@click.stop.prevent="opiClassification(lists.row)"
>
编辑
</span>
<span
type="text"
size="small"
class="option-span"
@click.stop.prevent="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<el-dialog
width="400px"
title="添加分类"
:show-close="false"
:visible.sync="isAdd">
<div class="addClassification">
<span>分类名称: </span>
<el-input style="width: 70%" v-model="classification.name" placeholder="请输入分类名称"></el-input>
</div>
<div class="addClassification">
<span>排序: </span>
<el-input style="width: 70%" type="number" v-model="classification.displayOrder"
placeholder="请输入排序"></el-input>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="isAdd = false">取消</el-button>
<el-button type="primary" @click="confirmItem" :loading="isLoading">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
@ -55,16 +104,23 @@
ORDERS_CATEGORIES
} from '@/api/commodityManagement'
import {dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "classification",
data() {
return {
index: 0,
isAdd: false,
isSort: true,
isLoading: false,
titleName: '添加分类',
temporaryValue: '',
lists: []
lists: [],
classification: {
id: '',
name: '',
displayOrder: '',
}
}
},
props: ['params', 'success'],
@ -87,6 +143,11 @@
methods: {
getList(params) {
let idx = this.index;
// console.log(idx);
// console.log(this.lists.length);
// if (idx == this.lists.length) {
// idx = 0
// }
GET_LIST_CATEGORIES(params).then(res => {
res.map((item, index) => {
item.edit = false;
@ -102,81 +163,45 @@
},
/**
* 添加分类
* 表格行事件
*/
addList() {
if (!this.isAdd) {
let item = {
id: '',
products: 0,
edit: true,
name: ''
};
this.lists.push(item);
} else {
Alert.fail("请先添加完分类");
}
openDetails(row) {
let lists = this.lists.map((item, index) => {
item.isSel = false;
if (row.id == item.id) {
item.isSel = true;
this.index = index;
}
return item
});
this.id = row.id;
this.name = row.name;
this.isAdd = true;
this.$emit('currId', row.id);
this.$emit('products', row.products);
this.lists = lists;
},
/**
* 事件点击
* 分类操作
*/
liItemClick(id, edit, products) {
if (!edit) {
let lists = this.lists.map((item, index) => {
item.isSel = false;
if (id == item.id) {
item.isSel = true;
this.index = index;
}
return item
});
this.$emit('currId', id);
this.$emit('products', products);
this.lists = lists;
opiClassification(row) {
this.isAdd = true;
if (row.id) {
this.classification = {
id: row.id,
name: row.name,
displayOrder: row.displayOrder,
}
}
},
/**
* 拖动结束
*/
itemDragEnd() {
let ids = [];
for (let i = 0; i < this.lists.length; i++) {
ids.push(this.lists[i].id)
}
let params = {
ids: ids
};
ORDERS_CATEGORIES(params).then(res => {
Alert.success("排序成功");
});
},
itemfoucsValue(val) {
this.temporaryValue = val
},
/**
* 编辑
* @param currIndex
*/
editItem(currIndex) {
this.isSort = false;
let lists = this.lists.map((item, index) => {
if (currIndex == index) {
item.edit = true
}
return item
});
this.titleName = '编辑名称';
this.lists = lists;
},
/**
* 删除
* @param currIndex
* @param id
*/
removeItem(currIndex) {
removeItem(id) {
let that = this;
this.$confirm('确定删除此分类嘛?', '提示', {
confirmButtonText: '确定',
@ -184,20 +209,17 @@
type: 'warning'
}).then(() => {
let params = {
id: that.lists[currIndex].id
id
};
DELETE_CATEGORIES(params).then((res) => {
let lists = [];
that.lists.map((item, index) => {
if (currIndex != index) {
if (id != item.id) {
lists.push(item)
}
return item
});
that.lists = lists;
that.isSort = true;
that.titleName = '添加分类';
that.isAdd = false;
Alert.success("删除成功");
setTimeout(() => {
that.getList(that.params)
@ -208,28 +230,6 @@
})
},
/**
* 取消
* @param currIndex
*/
cancelItem(currIndex) {
let that = this;
let lists = [];
this.lists.map((item, index) => {
if (currIndex == index) {
item.edit = false;
item.name = that.temporaryValue || item.name
}
if (item.id) {
lists.push(item)
}
return item
});
this.lists = lists;
this.isSort = true;
this.isAdd = false;
},
/**
* 确认
@ -237,20 +237,26 @@
*/
confirmItem(currIndex) {
let that = this;
if (this.lists[currIndex].name) {
if (this.classification.name) {
let params = {
id: this.lists[currIndex].id,
name: this.lists[currIndex].name
id: this.classification.id,
name: this.classification.name,
displayOrder: this.classification.displayOrder
};
if (!this.lists[currIndex].id) {
if (!this.classification.id) {
POST_CATEGORIES(params).then(res => {
let lists = that.lists.map((item, index) => {
item.edit = false;
return item
});
that.lists = lists;
that.isSort = true;
that.isAdd = false;
this.classification = {
id: '',
name: '',
displayOrder: '',
};
Alert.success("新增成功");
});
} else {
@ -260,7 +266,6 @@
return item
});
that.lists = lists;
that.isSort = true;
that.isAdd = false;
Alert.success("更新成功");
});
@ -274,156 +279,45 @@
}
}
},
filters: {
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
* {
padding: 0;
margin: 0;
}
.classification {
margin-top: 20px;
background: #fff;
padding: 20px;
.classification-list {
overflow: hidden;
ul {
overflow: hidden;
li {
position: relative;
border: 1px solid #ebeef5;
cursor: pointer;
margin: 10px;
list-style: none;
float: left;
width: 170px;
height: 190px;
background: rgba(255, 255, 255, 1);
opacity: 1;
border-radius: 5px;
.el-button--medium {
font-size: 12px;
height: 30px;
line-height: 30px;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
}
.handleMove {
position: absolute;
top: 5px;
right: 5px;
cursor: move;
}
.info {
p {
padding: 5px;
}
button {
border-radius: 0;
/*border-bottom-left-radius: 5px;*/
/*border-bottom-right-radius: 5px;*/
}
}
.edit {
height: 100%;
position: relative;
> p:nth-child(1) {
width: 100%;
padding: 10px;
border-bottom: 1px solid #ebeef5;
}
.demo-input-suffix {
padding: 10px;
span {
font-size: 12px;
}
.el-input {
width: 59%;
}
}
.opiItem {
width: 100%;
font-size: 12px;
position: absolute;
left: 0;
bottom: 0;
display: flex;
button, div {
flex: 1;
}
> button {
margin-right: 5px;
position: initial;
border-radius: 0;
}
div {
display: flex;
button {
position: initial;
flex: 1;
border-radius: 0;
}
.el-button + .el-button {
margin-left: 0;
}
}
}
}
}
li.cursorMove {
cursor: move;
}
li.select {
box-shadow: 0px 5px 10px 8px #d9d9d9;
}
li:last-child {
cursor: pointer;
line-height: normal;
padding-top: 50px;
.option-span {
color: #409EFF;
cursor: pointer;
margin-right: 10px;
}
p {
padding-top: 10px;
svg {
font-size: 35px;
}
}
.select {
font-size: 18px;
font-weight: bold;
}
}
}
.addClassification {
margin: 10px;
.addList {
line-height: 165px;
text-align: center;
}
}
span {
display: inline-block;
width: 27%;
font-weight: bold;
text-align: right;
padding-right: 20px;
box-sizing: border-box;
}
}
</style>

6
src/views/commodityManagement/commodityClassification/classificationList.vue

@ -20,6 +20,10 @@
prop="name"
label="商品名称">
</el-table-column>
<el-table-column
prop="price"
label="价格">
</el-table-column>
<el-table-column
prop="costPrice"
label="成本价">
@ -204,7 +208,7 @@
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
padding: 20px;
background: #fff;
.option-span {

15
src/views/commodityManagement/commodityClassification/index.vue

@ -1,8 +1,19 @@
<template>
<div>
<form-container label="分类名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<classification :params="params" @currId="currId" @products="products" :success="refresh"></classification>
<classification-list :classifyId="classifyId" :productsCount="productsCount" @$success="refreshList"></classification-list>
<el-row :gutter="20">
<el-col :span="10"><div class="grid-content bg-purple">
<classification :params="params" @currId="currId" @products="products" :success="refresh"></classification>
</div></el-col>
<el-col :span="14"><div class="grid-content bg-purple-light">
<classification-list :classifyId="classifyId" :productsCount="productsCount" @$success="refreshList"></classification-list>
</div></el-col>
</el-row>
</div>
</template>

164
src/views/commodityManagement/commodityClassification1/addEquipment.vue

@ -0,0 +1,164 @@
<template>
<div class="selector">
<div class="el-input1">
<el-input placeholder="搜索" @keyup.enter.native="onEnter" v-model="params.query" size="small" type="text"
class=""/>
</div>
<div class="selector-check selector-check1" @scroll="scrollEvent">
<ul>
<li v-for="(item,index) in list" :key="index">
<el-checkbox @change="change(item.id,item.checked)" v-model="item.checked">
<div class="lis">
<img :src="item.image" alt="">
<div>
<p>名称: {{item.name}}</p>
<p>成本价: {{item.costPrice}}</p>
</div>
</div>
</el-checkbox>
</li>
</ul>
</div>
</div>
</template>
<script>
import {EQUIPMENT} from '@/api/advertisingManagement'
import {GET_LIST} from '@/api/commodityManagement'
export default {
name: "elTransfer",
data() {
return {
list: [],
params: {
size: 10,
from: 0,
query: ''
}
}
},
mounted() {
this.getList()
},
methods: {
getList() {
GET_LIST(this.params).then(res => {
if (res.length){
res.map((item) => {
item.checked = false;
return item;
});
this.list = [...this.list, ...res];
}
})
},
change(id, checked) {
if (checked) {
let list = this.list.map((item) => {
if (id == item.id) {
item.checked = true
}
return item;
});
this.list = list;
} else {
let list = this.list.map((item) => {
if (id == item.id) {
item.checked = false
}
return item;
});
this.list = list;
}
},
scrollEvent(e) {
if (e.target.scrollTop + e.target.offsetHeight > e.target.scrollHeight) {
this.params = {
...this.params,
from: this.params.from + this.params.size,
};
this.getList()
}
},
onEnter() {
this.params = {
size: 10,
from: 0,
query: this.params.query
};
this.list = [];
this.getList()
}
},
}
</script>
<style rel="stylesheet/scss" lang="scss">
* {
margin: 0;
padding: 0;
}
.selector {
margin-top: 10px;
border-radius: 4px;
height: 500px;
border: 1px solid #d9d9d9;
.el-input1 {
margin: 10px;
}
.selector-check {
height: calc(100% - 55px);
border-top: 1px solid #d9d9d9;
padding: 15px;
overflow: auto;
ul {
padding: 0;
margin: 0;
li {
list-style: none;
padding: 5px 0;
.el-checkbox__input {
vertical-align: super;
}
.lis{
display: flex;
img,div{
flex: 1;
}
img{
width: 80px;
height: 80px;
}
div{
margin-left: 10px;
line-height: 40px;
}
}
}
}
}
}
.selector-check1{
.el-checkbox__input{
position: relative;
top: -30px;
}
}
</style>

429
src/views/commodityManagement/commodityClassification1/classification.vue

@ -0,0 +1,429 @@
<template>
<div class="classification">
<p>商品分类</p>
<div class="classification-list">
<draggable tag="ul" handle=".handleMove" :sort="isSort" v-model="lists" @update="itemDragEnd">
<li :class="{'select':item.isSel}" @click="liItemClick(item.id,item.edit,item.products)"
v-for="(item,index) in lists">
<span class="handleMove">
<svg-icon icon-class="move"></svg-icon>
</span>
<div class="info" v-show="!item.edit">
<p>{{item.name}}</p>
<p>{{item.products}}件商品</p>
<el-button type="primary" @click.stop="editItem(index)">编辑
</el-button>
</div>
<div class="edit" v-show="item.edit">
<p>{{titleName}}</p>
<div class="demo-input-suffix">
<span>分类名称</span>
<el-input
placeholder=""
@focus.stop="itemfoucsValue(item.name)"
v-model="item.name">
</el-input>
</div>
<div class="opiItem">
<el-button type="danger" @click.stop="removeItem(index)">删除分类</el-button>
<div>
<el-button @click.stop="cancelItem(index)">取消</el-button>
<el-button type="primary" @click.stop="confirmItem(index)">确认</el-button>
</div>
</div>
</div>
</li>
<li @click="addList" class="addList">
<p>
<svg-icon icon-class="plus1"></svg-icon>
</p>
添加分类
</li>
</draggable>
</div>
</div>
</template>
<script>
import draggable from 'vuedraggable'
import Alert from "@/utils/alert";
import {
GET_LIST_CATEGORIES,
POST_CATEGORIES,
UPDATE_CATEGORIES,
DELETE_CATEGORIES,
ORDERS_CATEGORIES
} from '@/api/commodityManagement'
export default {
name: "classification",
data() {
return {
index: 0,
isAdd: false,
isSort: true,
titleName: '添加分类',
temporaryValue: '',
lists: []
}
},
props: ['params', 'success'],
components: {
draggable
},
mounted() {
this.getList();
},
watch: {
params() {
this.getList(this.params)
},
success() {
setTimeout(() => {
this.getList(this.params)
}, 100);
}
},
methods: {
getList(params) {
let idx = this.index;
GET_LIST_CATEGORIES(params).then(res => {
res.map((item, index) => {
item.edit = false;
item.isSel = false;
if (index === idx) {
item.isSel = true;
}
return item
});
this.lists = res;
this.$emit('currId', this.lists[idx].id);
});
},
/**
* 添加分类
*/
addList() {
if (!this.isAdd) {
let item = {
id: '',
products: 0,
edit: true,
name: ''
};
this.lists.push(item);
} else {
Alert.fail("请先添加完分类");
}
this.isAdd = true;
},
/**
* 事件点击
*/
liItemClick(id, edit, products) {
if (!edit) {
let lists = this.lists.map((item, index) => {
item.isSel = false;
if (id == item.id) {
item.isSel = true;
this.index = index;
}
return item
});
this.$emit('currId', id);
this.$emit('products', products);
this.lists = lists;
}
},
/**
* 拖动结束
*/
itemDragEnd() {
let ids = [];
for (let i = 0; i < this.lists.length; i++) {
ids.push(this.lists[i].id)
}
let params = {
ids: ids
};
ORDERS_CATEGORIES(params).then(res => {
Alert.success("排序成功");
});
},
itemfoucsValue(val) {
this.temporaryValue = val
},
/**
* 编辑
* @param currIndex
*/
editItem(currIndex) {
this.isSort = false;
let lists = this.lists.map((item, index) => {
if (currIndex == index) {
item.edit = true
}
return item
});
this.titleName = '编辑名称';
this.lists = lists;
},
/**
* 删除
* @param currIndex
*/
removeItem(currIndex) {
let that = this;
this.$confirm('确定删除此分类嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let params = {
id: that.lists[currIndex].id
};
DELETE_CATEGORIES(params).then((res) => {
let lists = [];
that.lists.map((item, index) => {
if (currIndex != index) {
lists.push(item)
}
return item
});
that.lists = lists;
that.isSort = true;
that.titleName = '添加分类';
that.isAdd = false;
Alert.success("删除成功");
setTimeout(() => {
that.getList(that.params)
}, 100);
});
})
},
/**
* 取消
* @param currIndex
*/
cancelItem(currIndex) {
let that = this;
let lists = [];
this.lists.map((item, index) => {
if (currIndex == index) {
item.edit = false;
item.name = that.temporaryValue || item.name
}
if (item.id) {
lists.push(item)
}
return item
});
this.lists = lists;
this.isSort = true;
this.isAdd = false;
},
/**
* 确认
* @param currIndex
*/
confirmItem(currIndex) {
let that = this;
if (this.lists[currIndex].name) {
let params = {
id: this.lists[currIndex].id,
name: this.lists[currIndex].name
};
if (!this.lists[currIndex].id) {
POST_CATEGORIES(params).then(res => {
let lists = that.lists.map((item, index) => {
item.edit = false;
return item
});
that.lists = lists;
that.isSort = true;
that.isAdd = false;
Alert.success("新增成功");
});
} else {
UPDATE_CATEGORIES(params).then(res => {
let lists = that.lists.map((item, index) => {
item.edit = false;
return item
});
that.lists = lists;
that.isSort = true;
that.isAdd = false;
Alert.success("更新成功");
});
}
setTimeout(() => {
that.getList(that.params)
}, 1000)
} else {
Alert.fail("请添写分类名称");
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
* {
padding: 0;
margin: 0;
}
.classification {
margin-top: 20px;
background: #fff;
padding: 20px;
.classification-list {
overflow: hidden;
ul {
overflow: hidden;
li {
position: relative;
border: 1px solid #ebeef5;
cursor: pointer;
margin: 10px;
list-style: none;
float: left;
width: 170px;
height: 190px;
background: rgba(255, 255, 255, 1);
opacity: 1;
border-radius: 5px;
.el-button--medium {
font-size: 12px;
height: 30px;
line-height: 30px;
position: absolute;
left: 0;
bottom: 0;
width: 100%;
}
.handleMove {
position: absolute;
top: 5px;
right: 5px;
cursor: move;
}
.info {
p {
padding: 5px;
}
button {
border-radius: 0;
/*border-bottom-left-radius: 5px;*/
/*border-bottom-right-radius: 5px;*/
}
}
.edit {
height: 100%;
position: relative;
> p:nth-child(1) {
width: 100%;
padding: 10px;
border-bottom: 1px solid #ebeef5;
}
.demo-input-suffix {
padding: 10px;
span {
font-size: 12px;
}
.el-input {
width: 59%;
}
}
.opiItem {
width: 100%;
font-size: 12px;
position: absolute;
left: 0;
bottom: 0;
display: flex;
button, div {
flex: 1;
}
> button {
margin-right: 5px;
position: initial;
border-radius: 0;
}
div {
display: flex;
button {
position: initial;
flex: 1;
border-radius: 0;
}
.el-button + .el-button {
margin-left: 0;
}
}
}
}
}
li.cursorMove {
cursor: move;
}
li.select {
box-shadow: 0px 5px 10px 8px #d9d9d9;
}
li:last-child {
cursor: pointer;
line-height: normal;
padding-top: 50px;
p {
padding-top: 10px;
svg {
font-size: 35px;
}
}
}
.addList {
line-height: 165px;
text-align: center;
}
}
}
}
</style>

219
src/views/commodityManagement/commodityClassification1/classificationList.vue

@ -0,0 +1,219 @@
<template>
<div>
<div class="table">
<el-row>
<el-button type="primary" @click="addMerchandise=true,id='',isSel=true">
添加商品
</el-button>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="图片">
<template slot-scope="scope">
<img :src="scope.row.image" min-width="70" width="70" height="70"/>
</template>
</el-table-column>
<el-table-column
prop="name"
label="商品名称">
</el-table-column>
<el-table-column
prop="costPrice"
label="成本价">
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
type="text"
size="small"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
<el-dialog
width="400px"
:visible.sync="addMerchandise">
<add-equipment v-if="isSel" ref="transfer"></add-equipment>
<div slot="footer" class="dialog-footer">
<el-button @click="addMerchandise = false,isSel=false">取消</el-button>
<el-button type="primary" @click="determine">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {GET_LIST, DELETE_ITEM, PRODUCTS_CATEGORIES, DELETE_CATEGORIES_PRODUCTS} from '@/api/commodityManagement'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
import AddEquipment from "./addEquipment.vue"
const FormContainer = () => import('../form.vue');
const CommodityDetails = () => import('../productList/commodityDetails.vue');
export default {
name: "productList",
data() {
return {
count: 0,
isSel: true,
isLoading: false,
addMerchandise: false,
lists: [],
id: '',
params: {
from: 0,
size: pageSize
}
}
},
mounted() {
this.getList();
},
props: ['classifyId', 'productsCount'],
components: {
FormContainer,
CommodityDetails,
AddEquipment
},
watch: {
classifyId() {
this.params = {
from: 0,
size: pageSize
}
this.getList(this.classifyId);
},
productsCount(val) {
this.count = val
}
},
methods: {
/**
* 获取列表数据
*/
getList(classifyId) {
if (classifyId) {
let params = {
...this.params,
categoryId: classifyId
};
GET_LIST(params).then(res => {
res.map((item) => {
return item
});
this.lists = res
});
}
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let params = {
productId: id,
categoryId: this.classifyId
};
DELETE_CATEGORIES_PRODUCTS(params).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
this.$emit('$success')
});
Alert.success("删除成功");
}).catch(() => {
})
},
determine() {
let that = this;
let products = [];
this.$refs.transfer.list.map((item) => {
if (item.checked) {
products.push(item.id)
}
return item
});
let params = {
id: this.classifyId,
products: products
};
PRODUCTS_CATEGORIES(params).then(res => {
Alert.success("添加成功");
that.getList(that.classifyId);
that.$emit('$success')
});
this.addMerchandise = false;
this.isSel = false;
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList(this.classifyId)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

68
src/views/commodityManagement/commodityClassification1/index.vue

@ -0,0 +1,68 @@
<template>
<div>
<form-container label="分类名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<classification :params="params" @currId="currId" @products="products" :success="refresh"></classification>
<classification-list :classifyId="classifyId" :productsCount="productsCount" @$success="refreshList"></classification-list>
</div>
</template>
<script>
const FormContainer = () => import('../form.vue');
const Classification = () => import('./classification.vue');
const ClassificationList = () => import('./classificationList.vue');
export default {
name: "commodityClassification1",
data() {
return {
refresh: 0,
classifyId: '',
productsCount: '',
list: [],
params: {
query: ''
}
}
},
components: {
FormContainer,
Classification,
ClassificationList
},
methods: {
/**
* 查询
*/
submitForm(res) {
this.params = {
query: res.name
};
this.$emit('submit', this.params)
},
/**
* 重置
*/
resetForm() {
this.params = {
query: ''
};
},
currId(res) {
this.classifyId = res;
},
products(res) {
this.productsCount = res;
},
refreshList() {
this.refresh = this.refresh + 1;
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>

10
src/views/layout/components/rightMenu/rightMenu.vue

@ -18,7 +18,7 @@
class="avtarWrapper"
slot="reference"
>
<span class="text">{{this.$store.state.user.user}}</span>
<span class="text">{{this.$store.state.user.user || user}}</span>
<div class="avatarContainer">
<img
:src="logoSrc"
@ -32,12 +32,18 @@
</template>
<script>
import logoSrc from '@/assets/quxia.png'
import { getCookie } from "../../../../utils/cookie";
export default {
data(){
return{
logoSrc:logoSrc
logoSrc:logoSrc,
user:''
}
},
mounted(){
let LoginByUsername = getCookie('LoginByUsername');
this.user = JSON.parse(LoginByUsername).username
},
methods: {
getCookie(name) {
let arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");

2
src/views/login/index.vue

@ -105,7 +105,6 @@ export default {
},
created() {
// window.addEventListener('hashchange', this.afterQRScan)
// https://quxiaapi.renqilai.com
},
destroyed() {
// window.removeEventListener('hashchange', this.afterQRScan)
@ -129,6 +128,7 @@ export default {
if (access_token) {
setCookie("access_token", access_token);
this.$store.state.user.user = this.loginForm.username;
setCookie("LoginByUsername", JSON.stringify(this.loginForm));
this.$router.push({
path: this.redirect || "/dashboard/index"
});

388
src/views/marketingCenter/couponManagement/couponDetails.vue

@ -0,0 +1,388 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="优惠券名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="优惠形式" prop="type">
<el-radio-group v-model="ruleForm.type" :disabled="disabled" @change="typeChange">
<el-radio label="AMOUNT_OFF">减免</el-radio>
<el-radio label="DISCOUNT_RATE">打折</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="优惠额度" prop="amount" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<div v-if="ruleForm.type=='AMOUNT_OFF'">
<span style="margin-right: 10px;">减免</span>
<el-input type="number" style="width: 100px" :disabled="disabled"
v-model="ruleForm.amount"></el-input>
<span style="margin-left: 10px;"></span>
</div>
<div v-else>
<span style="margin-right: 10px;"></span>
<el-input type="number" style="width: 100px" :disabled="disabled"
v-model="ruleForm.amount"></el-input>
<span style="margin-left: 10px;"></span>
</div>
</el-form-item>
<el-form-item label="使用门槛" prop="minAmount" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-checkbox v-model="noThreshold" :disabled="disabled" @change="noThresholdFun">无门槛</el-checkbox>
<div style="display: inline-block" v-if="!noThreshold">
<span style="margin:0 10px 0 30px;">订单满</span>
<el-input style="width: 100px" :disabled="disabled" v-model="ruleForm.minAmount"></el-input>
<span style="margin-left: 10px;">元使用</span>
</div>
</el-form-item>
<el-form-item label="有效期">
<el-radio-group v-model="ruleForm.dateRule" :disabled="disabled">
<el-radio label="FIXED">固定时间</el-radio>
<el-radio label="AFTER_ACQUIRED">领取后*天有效</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="" v-if="ruleForm.dateRule=='FIXED'" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
v-model="date"
:disabled="disabled"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label=" " v-else prop="validDays"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input type="number" style="width: 100px" :disabled="disabled"
v-model="ruleForm.validDays"></el-input>
<span style="margin-left: 10px;"></span>
<span style="margin-left: 10px;font-size: 12px;color: #999;">有效期最后一天23:59</span>
</el-form-item>
<el-form-item label="发放总量" prop="maxStock" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input style="width: 100px" :disabled="disabled" v-model="ruleForm.maxStock"></el-input>
<span style="margin-left: 10px;"></span>
<span style="margin-left: 10px;font-size: 12px;color: #999;">修改优惠券总量时,只能增加不能减少,请谨慎选择</span>
</el-form-item>
<el-form-item label="领取限制">
<el-checkbox v-model="noRestriction" :disabled="disabled" @change="noRestrictionFun">不限制</el-checkbox>
</el-form-item>
<el-form-item label="" prop="limitPerCustomer" v-if="!noRestriction"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<span style="margin-right:10px;">每位用户可领取</span>
<el-input style="width: 100px" :disabled="disabled" v-model="ruleForm.limitPerCustomer"></el-input>
<span style="margin-left: 10px;">张优惠券</span>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" :disabled="disabled" placeholder="选择场地" multiple
:clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="text-align: center;">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LIST_CATEGORIES} from '@/api/commodityManagement'
import {GET_LOCATIONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_coupons as ADD_ITEM,
PUT_coupons as UPDATE_ITEM,
DETAIL_coupons as DETAIL_ITEM,
} from '@/api/marketingCenter'
import {FormateYYMMDD} from "@/filters/index";
export default {
data() {
return {
noThreshold: false, //
noRestriction: false, //
isLoading: false,
disabled: false,
date: [],
locationIds: [],
ruleForm: {
id: '',
name: '',
type: 'AMOUNT_OFF',
amount: '',
minAmount: '',
dateRule: 'FIXED',
validDays: '',
maxStock: '',
limitPerCustomer: '',
startDate: '',
endDate: '',
date: '',
locationIds: ''
}
};
},
props: ['currId'],
computed: {
id() {
return this.$route.query.id
}
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
if (this.id) {
res.unshift({
id: 9587,
name: '全部场地'
});
}
this.locationIds = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: FormateYYMMDD(val[0]),
endDate: FormateYYMMDD(val[1])
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
this.date.push(res.startDate);
this.date.push(res.endDate);
if (res.minAmount === 0 || !res.minAmount) {
this.noThreshold = true;
res.minAmount = 666
}
if (res.limitPerCustomer === 0) {
this.noRestriction = true
}
if (res.locationIds.length === 0) {
res.locationIds.unshift(9587);
}
this.disabled = true;
this.ruleForm = res;
})
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: ''
}
}
},
typeChange(val) {
this.ruleForm = {
...this.ruleForm,
amount: ''
}
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let couponDetails = this.$refs['ruleForm'];
couponDetails.validate((val) => {
if (val) {
that.isLoading = true;
if (!that.ruleForm.id) {
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
that.isLoading = false;
})
} else {
if (that.ruleForm.minAmount == 666) {
that.ruleForm.minAmount = ''
}
if (that.ruleForm.locationIds[0] == 9587) {
that.ruleForm.locationIds = []
}
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding: 30px 30px 30px 0;
}
.file {
position: relative;
top: 0;
display: inline-block;
border: 1px solid #e6e6e6;
border-radius: 4px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
width: 110px;
height: 140px;
text-align: center;
line-height: 85px;
font-size: 40px;
input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
.image {
width: 110px;
height: 140px;
position: relative;
img {
width: 100%;
height: 100%;
}
i {
position: absolute;
top: -6px;
right: -6px;
display: inline-block;
width: 15px;
height: 15px;
line-height: 15px;
text-align: center;
background: red;
border-radius: 50%;
color: #fff;
cursor: pointer;
}
}
.el-textarea {
width: 400px;
height: 80px;
resize: none;
&.el-textarea__inner {
resize: none;
}
}
.el-form-item__content {
position: relative;
.info {
position: absolute;
font-size: 12px;
top: 48px;
color: #ccc;
line-height: normal;
}
}
</style>

60
src/views/marketingCenter/couponManagement/form.vue

@ -0,0 +1,60 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="优惠券类型">
<el-select v-model="formInline.type" value="" placeholder="优惠券类型">
<el-option label="全部" value=""></el-option>
<el-option label="减免卷" value="AMOUNT_OFF"></el-option>
<el-option label="折扣券" value="DISCOUNT_RATE"></el-option>
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.enabled" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="投放中" value="true"></el-option>
<el-option label="暂停中" value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: ''
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

491
src/views/marketingCenter/couponManagement/index.vue

@ -0,0 +1,491 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/couponManagement/couponDetails`" class="resetWH">
<el-button type="primary">
添加优惠券
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
width="100"
label="类型">
<template slot-scope="lists">
{{lists.row.type | filterType}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
width="100"
prop="enabled"
label="状态">
<template slot-scope="lists">
{{lists.row.enabled | filterEnabled}}
</template>
</el-table-column>
<el-table-column
prop="enabled"
label="库存">
<template slot-scope="lists">
<p>总库存 {{lists.row.maxStock}} </p>
<p>领取 {{lists.row.acquired}} </p>
<p>库存 {{lists.row.stock}} </p>
</template>
</el-table-column>
<el-table-column
prop="enabled"
label="数据统计">
<template slot-scope="lists">
<p>累计消费 {{lists.row.orderTotal}} </p>
<p>累计优惠 {{lists.row.totalDiscount}} </p>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row.id)">
编辑
</span>
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="adjustment(lists.row)">
调整库存
</span>
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="enabledItem(lists.row)">
{{lists.row.enabled | filterEnable}}
</span>
<span
type="text"
size="small"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
<el-dialog
width="815px"
:show-close="false"
top="30px"
:visible.sync="addMerchandise">
<coupon-details ref="couponDetails"></coupon-details>
<div slot="footer" class="dialog-footer">
<el-button @click="resetFormDialog('ruleForm'), addMerchandise = false">取消</el-button>
<el-button type="primary" @click="determine" :loading="isLoading">确定</el-button>
</div>
</el-dialog>
<el-dialog
width="400px"
title="调整库存"
:show-close="false"
:visible.sync="isAdjustment">
<div class="adjustment">
<div>
<p class="fwb">{{adjustStock.name}}</p>
<p>有效期: {{adjustStock.date}}</p>
</div>
<div>
<p>剩余 <span class="fwb">{{adjustStock.stock}}</span> </p>
</div>
<div>
<span style="margin-right: 10px;">调整库存: </span>
<el-input-number v-model="adjustStock.value" style="width: 150px"
label="调整库存"></el-input-number>
<span style="margin-left: 10px;">当前 <span
class="fwb">{{adjustStock.stock + adjustStock.value}}</span> </span>
</div>
<div>
<span style="margin:10px 0 20px 0;display: inline-block;">修改原因: </span>
<el-input type="textarea" v-model="adjustStock.note"></el-input>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="isAdjustment = false">取消</el-button>
<el-button type="primary" @click="ajustmentDetermine" :loading="isLoading">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
GET_couponManagement_LIST as GET_LIST,
DELETE_coupons as DELETE_ITEM,
COUNT_coupons as COUNT,
ENABLE_coupons,
DISABLE_coupons,
POST_coupons as ADD_ITEM,
PUT_coupons as UPDATE_ITEM,
updateStock_coupons
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
import {FormateYYMMDD, dateTimeFormateHHmm} from "@/filters/index";
const FormContainer = () => import('./form.vue');
const CouponDetails = () => import('./couponDetails.vue');
export default {
name: "index",
data() {
return {
num: 0,
isLoading: false,
hackReset: true,
isAdjustment: false,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
type: '',
enabled: '',
},
adjustStock: {
id: '',
name: '',
date: '',
stock: '',
value: '',
note: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer,
CouponDetails
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.dateRule == 'AFTER_ACQUIRED') {
item.date = '领取后' + item.validDays + '天有效';
} else {
item.date = FormateYYMMDD(item.startDate) + ' 至 ' + FormateYYMMDD(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
type: res.type,
enabled: res.enabled,
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: '',
type: '',
enabled: '',
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
enabledItem(row) {
if (row.enadled) {
DISABLE_coupons(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
} else {
ENABLE_coupons(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
}
},
/**
* 编辑商品
*/
editItem(id) {
this.$router.push('/marketingCenter/couponManagement/couponDetails?id=' + id);
},
/**
* 调整库存
*/
adjustment(row) {
this.adjustStock = {
id: row.id,
name: row.name,
date: row.date,
stock: row.stock,
value: '',
note: ''
};
this.isAdjustment = true;
},
/**
* 确定调整库存
*/
ajustmentDetermine() {
let that = this;
if (!this.adjustStock.note) {
Alert.fail('修改原因不能为空');
return;
}
that.isLoading = true;
updateStock_coupons({...this.adjustStock}).then(res => {
Alert.success('修改成功');
setTimeout(() => {
that.adjustStock = {
id: '',
name: '',
date: '',
stock: '',
value: '',
note: ''
};
that.isAdjustment = false;
that.isLoading = false;
this.getList();
}, 1000);
});
},
/**
* 确定保存
*/
determine() {
let that = this;
let couponDetails = this.$refs['couponDetails'].$refs['ruleForm'];
couponDetails.validate((val) => {
if (val) {
that.isLoading = true;
let list = this.$refs['couponDetails'].ruleForm;
console.log(list);
return false;
if (!list.id) {
ADD_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
} else {
UPDATE_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
}
setTimeout(() => {
that.getList();
that.isLoading = false;
}, 1500);
}
});
},
/**
* 取消弹层
*/
resetFormDialog() {
this.hackReset = false;//
this.$refs['couponDetails'].$refs['ruleForm'].resetFields();
}
},
filters: {
filterType(val) {
switch (val) {
case 'AMOUNT_OFF':
return '减免卷';
case 'DISCOUNT_RATE':
return '折扣卷';
}
},
filterEnabled(val) {
switch (val) {
case true:
return '投放中';
case false:
return '暂停中';
}
},
filterEnable(val) {
switch (val) {
case true:
return '暂停投放';
case false:
return '开始投放';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.fwb {
font-weight: bold;
}
.pagination {
margin-top: 20px;
}
.adjustment {
}
</style>

57
src/views/marketingCenter/luckyDraw/form.vue

@ -0,0 +1,57 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.state" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="未开始" value="PENDING"></el-option>
<el-option label="进行中" value="ACTIVE"></el-option>
<el-option label="已失效" value="DISABLED"></el-option>
<el-option label="已结束" value="ENDED"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: '',
state: '',
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: '',
state: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

273
src/views/marketingCenter/luckyDraw/index.vue

@ -0,0 +1,273 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/luckyDraw/luckyDrawDetails`" class="resetWH">
<el-button type="primary">
添加活动
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="state"
label="状态">
<template slot-scope="lists">
{{lists.row.state | filterState}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
v-if="lists.row.state != 'DISABLED'"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="enabledItem(lists.row)">
失效
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import {
GET_lottery_LIST as GET_LIST,
DELETE_lottery as DELETE_ITEM,
COUNT_lottery as COUNT,
disable_lottery
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
const FormContainer = () => import('./form.vue');
import {FormateYYMMDD ,dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "index",
data() {
return {
isLoading: false,
hackReset: true,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
state: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.permanent) {
item.date = '永久有效';
} else {
item.date = dateTimeFormateHHmm(item.startDate) + ' 至 ' + dateTimeFormateHHmm(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
state: res.state
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: ''
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
enabledItem(row) {
disable_lottery(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
/**
* 编辑商品
*/
editItem(row) {
this.$router.push('/marketingCenter/luckyDraw/luckyDrawDetails?id=' + row.id + '&state=' + row.state);
}
},
filters: {
filterState(val) {
switch (val) {
case 'PENDING':
return '未开始';
case 'ACTIVE':
return '进行中';
case 'DISABLED':
return '已失效';
case 'ENDED':
return '已结束';
case '':
return '全部';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

483
src/views/marketingCenter/luckyDraw/luckyDrawDetails.vue

@ -0,0 +1,483 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" :rules="rule2" label-width="120px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="活动时间">
<el-switch
:disabled="disabled"
v-model="ruleForm.permanent"
active-text="永久有效">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.permanent" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
:disabled="disabled"
v-model="date"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="活动规则" prop="note" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input type="textarea" v-model="ruleForm.note"></el-input>
</el-form-item>
<el-form-item label="次数限制" prop="isLimit">
<div>
每人每天可抽取
<el-input style="width: 100px" type="text" v-model="ruleForm.maxTrys"></el-input>
,
<el-input type="text" style="width: 100px" v-model="ruleForm.maxTrysDaily"></el-input>
</div>
<div style="margin: 10px 0">
每人每天可中奖
<el-input style="width: 100px" type="text" v-model="ruleForm.maxRewards"></el-input>
,
<el-input type="text" style="width: 100px" v-model="ruleForm.maxRewardsDaily"></el-input>
</div>
</el-form-item>
<el-form-item label="漂浮显示">
<el-switch
v-model="ruleForm.float">
</el-switch>
</el-form-item>
<el-form-item label="适用方式">
<el-select v-model="ruleForm.entryType" placeholder="">
<el-option label="支付" value="PAY"></el-option>
</el-select>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" placeholder="选择场地" multiple :clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<div class="bText">
<p>中奖设置</p>
</div>
<div class="winningSettings">
<el-button type="primary" @click="addAwards">
添加奖项
</el-button>
<el-table
class="table"
border
type="index"
:data="ruleForm.prizes"
style="width: 100%">
<el-table-column
prop="name"
label="奖项名称"
width="180">
</el-table-column>
<el-table-column
prop="stock"
label="数量"
width="80">
</el-table-column>
<el-table-column
width="80"
prop="probability"
label="概率">
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row,lists.$index)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
</div>
<div class="bText">
<p>未中奖设置</p>
</div>
<el-form-item label="标题" prop="missTitle" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="ruleForm.missTitle"></el-input>
</el-form-item>
<el-form-item label="提示语" prop="missDescription"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="ruleForm.missDescription"></el-input>
</el-form-item>
<el-form-item style="text-align: center;">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
<el-dialog
:visible.sync="dialogVisible"
:show-close="false"
:before-close="beforeClose"
width="600px">
<winning-settings ref="winningSettings" :row="row"></winning-settings>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
<el-button type="primary" @click="winningSettings"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import {GET_LOCATIONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_lottery as ADD_ITEM,
PUT_lottery as UPDATE_ITEM,
DETAIL_lottery as DETAIL_ITEM
} from '@/api/marketingCenter'
import {FormateYYMMDD} from "@/filters/index";
const WinningSettings = () => import('./winningSettings');
export default {
data() {
let validatePass = (rule, value, callback) => {
if (this.isLimit) {
callback()
}
if (!value) {
return callback(new Error('不能为空'));
}
};
return {
date: [],
row: {},
locationIds: [],
disabled: false,
isLoading: false,
dialogVisible: false,
ruleForm: {
id: '',
name: '',
permanent: false,
startDate: '',
endDate: '',
date: '',
isLimit: '',
note: '',
float: false,
maxTrys: '',
maxTrysDaily: '',
maxRewards: '',
missTitle: '',
maxRewardsDaily: '',
missDescription: '',
entryType: 'PAY',
locationIds: [],
prizes: [],
},
rule2: {
isLimit: [
{validator: validatePass, trigger: 'blur'}
]
}
};
},
computed: {
id() {
return this.$route.query.id
},
state() {
return this.$route.query.state
},
isLimit() {
let value = this.ruleForm;
let flag = false;
if (value.maxTrys && value.maxTrysDaily && value.maxRewards && value.maxRewardsDaily) {
return !flag
}
}
},
components: {
WinningSettings
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
this.locationIds = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: val[0],
endDate: val[1]
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
this.date.push(res.startDate);
this.date.push(res.endDate);
this.disabled = true;
this.ruleForm = res;
})
},
addAwards() {
let row = {
edit: 'add',
type: 'COUPON',
name: '',
stock: '',
itemId: '',
probability: '',
};
this.row = row;
this.dialogVisible = true
},
winningSettings() {
let winningSettings = this.$refs['winningSettings'].$refs['form'];
winningSettings.validate(valid => {
if (valid) {
this.dialogVisible = false;
let prizes = JSON.parse(JSON.stringify(this.ruleForm.prizes));
let model = winningSettings.model;
prizes.map(item => {
if (item.edit == 'edit') {
item.name = model.name;
item.stock = model.stock;
item.type = model.type;
item.itemId = model.coupon || model.card;
item.probability = model.probability;
item.edit = '';
}
return item;
});
if (model.edit == 'add') {
prizes.push(model)
}
this.ruleForm = {
...this.ruleForm,
prizes
};
}
})
},
cancel() {
this.dialogVisible = false;
this.$refs['winningSettings'].$refs['form'].resetFields();
},
beforeClose() {
this.dialogVisible = false;
this.$refs['winningSettings'].$refs['form'].resetFields();
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
startDate: '',
endDate: ''
}
}
},
editItem(row, index) {
this.dialogVisible = true;
row.edit = 'edit';
this.row = row;
},
removeItem(row, index) {
let prizes = JSON.parse(JSON.stringify(this.ruleForm.prizes));
let newArr = [];
prizes.map((item, idx) => {
if (index != idx) {
newArr.push(item)
}
return item;
});
this.ruleForm = {
...this.ruleForm,
prizes: newArr
};
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let luckyDrawDetails = this.$refs['ruleForm'];
luckyDrawDetails.validate((val) => {
if (val) {
if (!this.ruleForm.prizes.length) {
Alert.fail('中奖设置不能为空');
return false
}
that.isLoading = true;
if (!that.ruleForm.id) {
console.log(that.ruleForm);
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
} else {
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding: 30px 30px 30px 0;
}
.bText {
border-top: 1px solid #d9d9d9;
position: relative;
margin: 30px 0;
p {
position: absolute;
top: -25px;
left: 40px;
background: #fff;
font-weight: bolder;
padding: 0 10px;
}
}
.option-span {
color: #409EFF;
cursor: pointer;
}
.winningSettings {
border-radius: 10px;
max-width: 500px;
margin-left: 120px;
.table {
margin-top: 20px;
}
.el-table {
border-radius: 4px;
}
}
</style>

118
src/views/marketingCenter/luckyDraw/winningSettings.vue

@ -0,0 +1,118 @@
<template>
<el-form ref="form" :model="form" label-width="90px">
<el-form-item label="奖项名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="奖品" prop="itemId" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-radio-group v-model="form.type" @change="radioChange">
<el-radio label="COUPON">
<span style="margin-right: 10px;">优惠券</span>
<el-select :disabled="!isCoupons" style="width: 144px" @change="couponsChange" v-model="form.coupon"
placeholder="选择优惠券">
<el-option v-for="item in coupons" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-radio>
<el-radio label="CARD">
<span style="margin-right: 10px;">会员卡</span>
<el-select :disabled="isCoupons" style="width: 144px" @change="cardChange" v-model="form.card"
placeholder="选择会员卡">
<el-option v-for="item in card" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="奖项数量" prop="stock" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="form.stock"></el-input>
</el-form-item>
<el-form-item label="中奖概率%" prop="probability" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="form.probability"></el-input>
</el-form-item>
</el-form>
</template>
<script>
import {GET_VIPVARDS, GET_COUPONS} from '@/api/common'
export default {
data() {
return {
coupons: [],
card: [],
isCoupons: true,
form: {
name: '',
coupon: '',
card: '',
stock: '',
itemId: '',
type: 'COUPON',
probability: ''
}
}
},
props: {
row: Object
},
created() {
let rows = JSON.parse(JSON.stringify(this.row));
this.initFun().then(res => {
if (rows.type == "COUPON") {
rows.coupon = rows.itemId;
this.isCoupons = true;
} else {
rows.card = rows.itemId;
this.isCoupons = false;
}
this.form = rows;
})
},
methods: {
async initFun() {
await GET_COUPONS().then(res => {
this.coupons = res;
});
await GET_VIPVARDS().then(res => {
this.card = res;
});
},
radioChange(val) {
if (val == 'COUPON') {
this.isCoupons = !this.isCoupons
} else {
this.isCoupons = !this.isCoupons
}
},
couponsChange(val) {
this.form = {
...this.form,
coupon: val,
card: '',
itemId: val
};
},
cardChange(val) {
this.form = {
...this.form,
coupon: '',
card: val,
itemId: val
}
},
},
watch: {
row() {
let rows = JSON.parse(JSON.stringify(this.row));
if (rows.type == "COUPON") {
rows.coupon = rows.itemId;
this.isCoupons = true;
} else {
rows.card = rows.itemId;
this.isCoupons = false;
}
this.form = rows;
}
}
}
</script>

57
src/views/marketingCenter/luckyFree/form.vue

@ -0,0 +1,57 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.state" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="未开始" value="PENDING"></el-option>
<el-option label="进行中" value="ACTIVE"></el-option>
<el-option label="已失效" value="DISABLED"></el-option>
<el-option label="已结束" value="ENDED"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: '',
state: '',
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: '',
state: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

273
src/views/marketingCenter/luckyFree/index.vue

@ -0,0 +1,273 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/luckyFree/luckyFreeDetails`" class="resetWH">
<el-button type="primary">
添加活动
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="state"
label="状态">
<template slot-scope="lists">
{{lists.row.state | filterState}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
v-if="lists.row.state != 'DISABLED'"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="enabledItem(lists.row)">
失效
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import {
GET_luckfree_LIST as GET_LIST,
DELETE_luckfree as DELETE_ITEM,
COUNT_luckfree as COUNT,
disable_luckfree
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
const FormContainer = () => import('./form.vue');
import {FormateYYMMDD ,dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "index",
data() {
return {
isLoading: false,
hackReset: true,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
state: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.permanent) {
item.date = '永久有效';
} else {
item.date = dateTimeFormateHHmm(item.startDate) + ' 至 ' + dateTimeFormateHHmm(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
state: res.state
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: ''
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
enabledItem(row) {
disable_luckfree(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
/**
* 编辑商品
*/
editItem(row) {
this.$router.push('/marketingCenter/luckyFree/luckyFreeDetails?id=' + row.id + '&state=' + row.state);
}
},
filters: {
filterState(val) {
switch (val) {
case 'PENDING':
return '未开始';
case 'ACTIVE':
return '进行中';
case 'DISABLED':
return '已失效';
case 'ENDED':
return '已结束';
case '':
return '全部';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

413
src/views/marketingCenter/luckyFree/luckyFreeDetails.vue

@ -0,0 +1,413 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" label-position="center" label-width="120px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input style="min-width: 120px;width: 400px;" v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="活动时间">
<el-switch
:disabled="disabled"
v-model="ruleForm.permanent"
active-text="永久有效">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.permanent" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
:disabled="disabled"
v-model="date"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="活动规则" prop="note" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input type="textarea" v-model="ruleForm.note"></el-input>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" placeholder="选择场地" multiple :clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<div class="bText">
<p>中奖设置</p>
</div>
<el-form-item label="中奖浮动比例">
<el-tooltip class="item" placement="top">
<div slot="content">注意事项:<br/>A.抽奖档位有三个档次:<br/> 1x3倍x5倍,<br/> 具体档位由该笔订单总金额决定; <br/>:<br/>订单总金额
> 5, 会出现三个大乐购档次;<br/> B.中奖概率 = 抽奖档次 / 订单金额 + (抽奖档次 / 订单金额 * 中奖浮动比例
</div>
<svg-icon icon-class="wen"
style="position: relative;right:10px;cursor: pointer;color: #188ae2;"></svg-icon>
</el-tooltip>
<el-switch
v-model="ruleForm.enableProbabilityAdjustment"
active-text="不设置">
</el-switch>
</el-form-item>
<el-form-item label="" prop="probabilityAdjustment" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]" v-if="!ruleForm.enableProbabilityAdjustment">
中奖概率上浮
<el-input style="width: 80px" v-model="ruleForm.probabilityAdjustment"></el-input>
%
</el-form-item>
<el-form-item label="显示真实概率" v-if="!ruleForm.enableProbabilityAdjustment">
<el-switch
v-model="ruleForm.showRealProbability"
active-text="显示">
</el-switch>
</el-form-item>
<el-form-item label="中奖阈值" prop="maxRate" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]" >
<el-tooltip class="item" placement="top">
<div slot="content">中奖阀值 - 累计收入大于等于订单金额 + 中奖阀值百分比 × 订单金额 必中奖<br/> 举例<br/> 假设订单金额20元
抽奖档次为1元/1 不设置中奖浮动比例 则单次中奖概率为1 / 20 = 5%<br/> 如果中奖阀值设置成10% 则累计收入大于等于 20 + 10% × 20 = 22
必中奖
</div>
<svg-icon icon-class="wen"
style="position: relative;right:10px;cursor: pointer;color: #188ae2;"></svg-icon>
</el-tooltip>
<el-input style="width: 80px" v-model="ruleForm.maxRate"></el-input>
%
</el-form-item>
<el-form-item label="中奖保底值" prop="minRate" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-tooltip class="item" placement="top">
<div slot="content">中奖保底值 - 累计收入若小于订单金额 × 中奖保底值% 必定不中奖 保证最低收入<br/> 举例<br/> 假设订单金额20元
抽奖档次为1元/1 不设置中奖浮动比例 则单次中奖概率为1 / 20 = 5% <br/>如果中奖保底值设置成10% 则累计收入小于 20 × 10% = 2 必定不中奖
</div>
<svg-icon icon-class="wen"
style="position: relative;right:10px;cursor: pointer;color: #188ae2;"></svg-icon>
</el-tooltip>
<el-input style="width: 80px" v-model="ruleForm.minRate"></el-input>
%
</el-form-item>
<div class="bText">
<p>概率计算</p>
</div>
<el-form-item label="订单金额">
<el-input style="width: 150px" v-model="ruleForm.orderTotal"></el-input>
</el-form-item>
<el-form-item label="档次">
<el-select v-model="ruleForm.times" placeholder="请选择档次">
<el-option label="1" value="1"></el-option>
<el-option label="3" value="3"></el-option>
<el-option label="5" value="5"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="success" @click="calculation">计算</el-button>
</el-form-item>
<div class="bText">
<p>计算结果</p>
</div>
<div class="result">
<div>
<p>真实概率 <span>{{calculationResults.realProbability||0}}</span> %</p>
<p>抽奖最多 <span>{{calculationResults.maxCount||0}}</span> 次必中,收入最高 <span>{{calculationResults.paidMax||0}}</span>
</p>
</div>
<div>
<p>显示概率 <span>{{calculationResults.probability||0}}</span> %</p>
<p>抽奖最少 <span>{{calculationResults.minCount||0}}</span> 次才有机会中奖,收入最底 <span>{{calculationResults.paidMin||0}}</span>
</p>
</div>
<div>
<p>中奖金额 <span>{{calculationResults.price||0}}</span> </p>
</div>
</div>
<el-form-item style="text-align: center;">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_luckfree as ADD_ITEM,
PUT_luckfree as UPDATE_ITEM,
DETAIL_luckfree as DETAIL_ITEM,
luckfree_calculate
} from '@/api/marketingCenter'
import {FormateYYMMDD} from "@/filters/index";
export default {
data() {
return {
date: [],
isLoading: false,
disabled: false,
locationIds: [],
calculationResults: {},
ruleForm: {
id: '',
name: '',
permanent: false,
enableProbabilityAdjustment: false,
showRealProbability: false,
startDate: '',
endDate: '',
date: '',
probabilityAdjustment: '',
maxRate: '',
minRate: '',
note: '',
orderTotal: '',
times: '',
locationIds: []
}
};
},
computed: {
id() {
return this.$route.query.id
},
state() {
return this.$route.query.state
}
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
this.locationIds = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: val[0],
endDate: val[1]
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
this.date.push(res.startDate);
this.date.push(res.endDate);
this.disabled = true;
this.ruleForm = res;
})
},
/**
* 计算
*/
calculation() {
if (!this.ruleForm.orderTotal) {
Alert.fail('订单金额必填');
return false;
}
if (!this.ruleForm.times) {
Alert.fail('档次必填');
return false;
}
let obj ={
times: this.ruleForm.times,
orderTotal:this.ruleForm.orderTotal,
probabilityAdjustment: this.ruleForm.probabilityAdjustment,
showRealProbability: this.ruleForm.showRealProbability,
minRate: this.ruleForm.minRate,
maxRate: this.ruleForm.maxRate,
};
luckfree_calculate({...obj}).then(res => {
console.log(res);
this.calculationResults = res
})
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
startDate: '',
endDate: ''
}
}
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let luckyFreeDetails = this.$refs['ruleForm'];
luckyFreeDetails.validate((val) => {
if (val) {
that.isLoading = true;
if (!that.ruleForm.id) {
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
Alert.fail(err);
that.isLoading = false;
})
} else {
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
Alert.fail(err);
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding-top: 30px;
}
.bText {
border-top: 1px solid #d9d9d9;
position: relative;
margin: 30px 0;
p {
position: absolute;
top: -25px;
left: 40px;
background: #fff;
font-weight: bolder;
padding: 0 10px;
}
}
.result {
padding-left: 30px;
div {
display: flex;
p:nth-child(1) {
min-width: 150px;
}
p:nth-child(2) {
position: relative;
top: 20px;
}
span {
color: #188ae2;
}
}
}
.el-textarea {
width: 400px;
height: 80px;
resize: none;
&.el-textarea__inner {
resize: none;
}
}
.el-form-item__content {
position: relative;
.info {
position: absolute;
font-size: 12px;
top: 48px;
color: #ccc;
line-height: normal;
}
}
</style>

57
src/views/marketingCenter/noviceCourtesy/form.vue

@ -0,0 +1,57 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.state" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="未开始" value="PENDING"></el-option>
<el-option label="进行中" value="ACTIVE"></el-option>
<el-option label="已失效" value="DISABLED"></el-option>
<el-option label="已结束" value="ENDED"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: '',
state: '',
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: '',
state: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

336
src/views/marketingCenter/noviceCourtesy/index.vue

@ -0,0 +1,336 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/noviceCourtesy/noviceCourtesyDetails`" class="resetWH">
<el-button type="primary">
添加活动
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="state"
label="状态">
<template slot-scope="lists">
{{lists.row.state | filterState}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
v-if="lists.row.state != 'DISABLED'"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="enabledItem(lists.row)">
失效
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
<el-dialog
width="815px"
:show-close="false"
:visible.sync="addMerchandise">
2323
<div slot="footer" class="dialog-footer">
<el-button @click="resetFormDialog('ruleForm'), addMerchandise = false">取消</el-button>
<el-button type="primary" @click="determine" :loading="isLoading">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
GET_couponOffers_LIST as GET_LIST,
DELETE_couponOffers as DELETE_ITEM,
COUNT_couponOffers as COUNT,
ENABLE_couponOffers,
DISABLE_couponOffers,
POST_couponOffers as ADD_ITEM,
PUT_couponOffers as UPDATE_ITEM,
disable_couponOffers
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
const FormContainer = () => import('./form.vue');
import {FormateYYMMDD, dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "index",
data() {
return {
isLoading: false,
hackReset: true,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
state: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.permanent) {
item.date = '永久有效';
} else {
item.date = dateTimeFormateHHmm(item.startDate) + ' 至 ' + dateTimeFormateHHmm(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
state: res.state
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: ''
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
enabledItem(row) {
disable_couponOffers(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
/**
* 编辑商品
*/
editItem(row) {
this.$router.push('/marketingCenter/noviceCourtesy/noviceCourtesyDetails?id=' + row.id + '&state=' + row.state);
},
/**
* 确定保存
*/
determine() {
let that = this;
let commodityDetails = this.$refs['commodityDetails'].$refs['ruleForm'];
commodityDetails.validate((val) => {
if (val) {
that.isLoading = true;
let list = this.$refs['commodityDetails'].ruleForm;
if (!list.id) {
ADD_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
} else {
UPDATE_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
}
setTimeout(() => {
that.getList();
that.isLoading = false;
}, 1500);
}
});
},
/**
* 取消弹层
*/
resetFormDialog() {
this.hackReset = false;//
this.$refs['commodityDetails'].$refs['ruleForm'].resetFields();
}
},
filters: {
filterState(val) {
switch (val) {
case 'PENDING':
return '未开始';
case 'ACTIVE':
return '进行中';
case 'DISABLED':
return '已失效';
case 'ENDED':
return '已结束';
case '':
return '全部';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

315
src/views/marketingCenter/noviceCourtesy/noviceCourtesyDetails.vue

@ -0,0 +1,315 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" label-width="120px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input :disabled="DISABLED" v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="活动时间" prop="permanent">
<el-switch
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]"
:disabled="disabled"
v-model="ruleForm.permanent"
active-text="永久有效">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.permanent" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
:disabled="disabled"
v-model="date"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="选择优惠券" prop="couponId" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-select v-model="ruleForm.couponId" :disabled="DISABLED" placeholder="选择优惠券" :clearable="true">
<el-option v-for="item in coupons" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" :disabled="DISABLED" placeholder="选择场地" multiple
:clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="text-align: center;" v-if="!DISABLED">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS, GET_COUPONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_couponOffers as ADD_ITEM,
PUT_couponOffers as UPDATE_ITEM,
DETAIL_couponOffers as DETAIL_ITEM
} from '@/api/marketingCenter'
import {FormateYYMMDD} from "@/filters/index";
export default {
data() {
return {
noThreshold: false, //
noRestriction: false, //
date: [],
locationIds: [],
disabled: false,
DISABLED: false,
isLoading: false,
coupons: [],
ruleForm: {
id: '',
name: '',
permanent: false,
startDate: '',
endDate: '',
date: '',
locationIds: '',
couponId: ''
},
equipmentType: []
};
},
props: ['currId'],
computed: {
id() {
return this.$route.query.id
},
state() {
return this.$route.query.state
}
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
this.locationIds = res
});
GET_COUPONS().then(res => {
this.coupons = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: val[0],
endDate: val[1]
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
if (this.state == 'DISABLED') {
this.DISABLED = true;
Alert.fail('已失效的活动不能编辑,只能查看');
}
this.date.push(res.startDate);
this.date.push(res.endDate);
this.disabled = true;
this.ruleForm = res;
})
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
startDate: '',
endDate: ''
}
}
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let noviceCourtesyDetails = this.$refs['ruleForm'];
noviceCourtesyDetails.validate((val) => {
if (val) {
that.isLoading = true;
if (!that.ruleForm.id) {
console.log(that.ruleForm);
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
Alert.fail(err);
that.isLoading = false;
})
} else {
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err=>{
Alert.fail(err);
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding: 30px 30px 30px 0;
}
.file {
position: relative;
top: 0;
display: inline-block;
border: 1px solid #e6e6e6;
border-radius: 4px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
width: 110px;
height: 140px;
text-align: center;
line-height: 85px;
font-size: 40px;
input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
.image {
width: 110px;
height: 140px;
position: relative;
img {
width: 100%;
height: 100%;
}
i {
position: absolute;
top: -6px;
right: -6px;
display: inline-block;
width: 15px;
height: 15px;
line-height: 15px;
text-align: center;
background: red;
border-radius: 50%;
color: #fff;
cursor: pointer;
}
}
.el-textarea {
width: 400px;
height: 80px;
resize: none;
&.el-textarea__inner {
resize: none;
}
}
.el-form-item__content {
position: relative;
.info {
position: absolute;
font-size: 12px;
top: 48px;
color: #ccc;
line-height: normal;
}
}
</style>

57
src/views/marketingCenter/paymentOfCourtesy/form.vue

@ -0,0 +1,57 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.state" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="未开始" value="PENDING"></el-option>
<el-option label="进行中" value="ACTIVE"></el-option>
<el-option label="已失效" value="DISABLED"></el-option>
<el-option label="已结束" value="ENDED"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: '',
state: '',
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: '',
state: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

272
src/views/marketingCenter/paymentOfCourtesy/index.vue

@ -0,0 +1,272 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails`" class="resetWH">
<el-button type="primary">
添加活动
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="state"
label="状态">
<template slot-scope="lists">
{{lists.row.state | filterState}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
v-if="lists.row.state != 'DISABLED'"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="enabledItem(lists.row)">
失效
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import {
GET_payGiftOffers_LIST as GET_LIST,
DELETE_payGiftOffers as DELETE_ITEM,
COUNT_payGiftOffers as COUNT,
disable_payGiftOffers
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
const FormContainer = () => import('./form.vue');
import {FormateYYMMDD ,dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "index",
data() {
return {
isLoading: false,
hackReset: true,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
state: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.permanent) {
item.date = '永久有效';
} else {
item.date = dateTimeFormateHHmm(item.startDate) + ' 至 ' + dateTimeFormateHHmm(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
state: res.state
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: ''
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
enabledItem(row) {
disable_payGiftOffers(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
/**
* 编辑商品
*/
editItem(row) {
this.$router.push('/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails?id=' + row.id + '&state=' + row.state);
}
},
filters: {
filterState(val) {
switch (val) {
case 'PENDING':
return '未开始';
case 'ACTIVE':
return '进行中';
case 'DISABLED':
return '已失效';
case 'ENDED':
return '已结束';
case '':
return '全部';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

430
src/views/marketingCenter/paymentOfCourtesy/paymentOfCourtesyDetails.vue

@ -0,0 +1,430 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" :rules="rules2" label-width="120px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input v-model="ruleForm.name" :disabled="DISABLED"></el-input>
</el-form-item>
<el-form-item label="门槛">
<el-switch
:disabled="DISABLED"
v-model="ruleForm.applyRule"
active-text="无门槛">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.applyRule" prop="isFull">
<el-radio-group v-model="ruleForm.isMinQuantity" :disabled="DISABLED" @change="applyRuleFun">
<el-radio label="minQuantity">
<el-input style="width: 80px" :disabled="DISABLED || !isMinQuantity"
@change="minQuantityFun" v-model="ruleForm.minQuantity"></el-input>
</el-radio>
<el-radio label="minAmount">
<el-input style="width: 80px" :disabled="DISABLED || isMinQuantity"
@change="minAmountFun" v-model="ruleForm.minAmount"></el-input>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="参与次数">
<el-switch
:disabled="DISABLED"
v-model="ruleForm.isUnlimited"
active-text="无限制">
</el-switch>
</el-form-item>
<el-form-item v-if="!ruleForm.isUnlimited" prop="limitPerCustomer"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
每人参与
<el-input style="width: 80px" :disabled="DISABLED" v-model="ruleForm.limitPerCustomer"></el-input>
</el-form-item>
<el-form-item label="活动时间">
<el-switch :disabled="disabled"
v-model="ruleForm.permanent"
active-text="永久有效">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.permanent" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
:disabled="disabled"
v-model="date"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="选择优惠券" prop="couponId" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-select v-model="ruleForm.couponId" :disabled="DISABLED" placeholder="选择优惠券">
<el-option v-for="item in coupons" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" :disabled="DISABLED" placeholder="选择场地" multiple
:clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="text-align: center;" v-if="!DISABLED">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS, GET_COUPONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_payGiftOffers as ADD_ITEM,
PUT_payGiftOffers as UPDATE_ITEM,
DETAIL_payGiftOffers as DETAIL_ITEM
} from '@/api/marketingCenter'
import {FormateYYMMDD, dateTimeFormateHHmm} from "@/filters/index";
export default {
data() {
let validatePass = (rule, value, callback) => {
if (!value) {
return callback(new Error('不能为空'));
}
callback()
};
return {
isLoading: false,
noThreshold: false, //
noRestriction: false, //
disabled: false,
DISABLED: false,
isMinQuantity: true,
date: [],
locationIds: [],
coupons: [],
ruleForm: {
id: '',
name: '',
isFull: '',
permanent: false,
startDate: '',
endDate: '',
date: '',
isMinQuantity: 'minQuantity',
limitPerCustomer: '',
applyRule: false,
isUnlimited: false,
locationIds: [],
couponId: ''
},
rules2: {
isFull: [
{validator: validatePass, trigger: 'blur'}
]
}
};
},
computed: {
id() {
return this.$route.query.id
},
state() {
return this.$route.query.state
}
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
this.locationIds = res
});
GET_COUPONS().then(res => {
this.coupons = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: val[0],
endDate: val[1]
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
this.date.push(res.startDate);
this.date.push(res.endDate);
this.disabled = true;
if (this.state == 'DISABLED') {
this.DISABLED = true
Alert.fail('已失效的活动不能编辑,只能查看');
}
if (res.limitPerCustomer === 0) {
res.isUnlimited = true
}
res.isFull = res.minQuantity || res.minAmount;
this.ruleForm = res;
if (res.minQuantity) {
this.ruleForm = {
...this.ruleForm,
isMinQuantity: 'minQuantity'
};
this.isMinQuantity = true
} else {
this.ruleForm = {
...this.ruleForm,
isMinQuantity: 'minAmount'
};
this.isMinQuantity = false
}
})
},
minQuantityFun(val) {
this.ruleForm = {
...this.ruleForm,
isFull: val
}
},
minAmountFun(val) {
this.ruleForm = {
...this.ruleForm,
isFull: val
}
},
applyRuleFun(val) {
if (val = 'minQuantity') {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
minQuantity: ''
};
this.isMinQuantity = !this.isMinQuantity
} else {
this.ruleForm = {
...this.ruleForm,
minQuantity: '',
minAmount: ''
};
this.isMinQuantity = !this.isMinQuantity
}
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
startDate: '',
endDate: ''
}
}
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let paymentOfCourtesyDetails = this.$refs['ruleForm'];
paymentOfCourtesyDetails.validate((val) => {
if (val) {
that.isLoading = true;
if (that.ruleForm.isUnlimited) {
that.ruleForm = {
...that.ruleForm,
limitPerCustomer: 0
}
}
if (!that.ruleForm.id) {
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
} else {
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding: 30px 30px 30px 0;
}
.file {
position: relative;
top: 0;
display: inline-block;
border: 1px solid #e6e6e6;
border-radius: 4px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
width: 110px;
height: 140px;
text-align: center;
line-height: 85px;
font-size: 40px;
input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
.image {
width: 110px;
height: 140px;
position: relative;
img {
width: 100%;
height: 100%;
}
i {
position: absolute;
top: -6px;
right: -6px;
display: inline-block;
width: 15px;
height: 15px;
line-height: 15px;
text-align: center;
background: red;
border-radius: 50%;
color: #fff;
cursor: pointer;
}
}
.el-textarea {
width: 400px;
height: 80px;
resize: none;
&.el-textarea__inner {
resize: none;
}
}
.el-form-item__content {
position: relative;
.info {
position: absolute;
font-size: 12px;
top: 48px;
color: #ccc;
line-height: normal;
}
}
</style>

57
src/views/marketingCenter/salesPromotion/form.vue

@ -0,0 +1,57 @@
<template>
<div class="form-container">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item :label="label">
<el-input v-model="formInline.name" placeholder="名称搜索"></el-input>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="formInline.state" value="" placeholder="状态">
<el-option label="全部" value=""></el-option>
<el-option label="未开始" value="PENDING"></el-option>
<el-option label="进行中" value="ACTIVE"></el-option>
<el-option label="已失效" value="DISABLED"></el-option>
<el-option label="已结束" value="ENDED"></el-option>
</el-select>
</el-form-item>
<el-form-item style="padding-left:30px">
<el-button type="default" @click="resetForm1('formInline')">重置</el-button>
<el-button type="primary" @click="onSubmit">查询</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
export default {
name: 'form-container',
props:['label'],
data() {
return {
formInline: {
name: '',
state: '',
}
}
},
methods: {
onSubmit() {
this.$emit('submit', this.formInline)
},
resetForm1() {
this.formInline = {
name: '',
state: ''
};
this.$emit('resetForm');
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.form-container {
padding: 20px;
background: #fff;
}
</style>

332
src/views/marketingCenter/salesPromotion/index.vue

@ -0,0 +1,332 @@
<template>
<div>
<form-container label="名称" @submit="submitForm" @resetForm="resetForm"></form-container>
<div class="table">
<el-row>
<router-link :to="`/marketingCenter/salesPromotion/salesPromotionDetails`" class="resetWH">
<el-button type="primary">
添加活动
</el-button>
</router-link>
</el-row>
<el-table
:data="lists"
style="width: 100%">
<el-table-column
prop="name"
label="名称">
</el-table-column>
<el-table-column
prop="state"
label="状态">
<template slot-scope="lists">
{{lists.row.state | filterState}}
</template>
</el-table-column>
<el-table-column
prop="date"
label="有效期">
</el-table-column>
<el-table-column
prop="createdDate"
label="创建时间">
<template slot-scope="lists">
{{lists.row.createdDate | filterCreatedDate}}
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
>
<template slot-scope="lists">
<span
size="small"
class="option-span"
style="margin: 0 5px;"
@click="editItem(lists.row)">
编辑
</span>
<span
v-if="lists.row.state != 'DISABLED'"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="enabledItem(lists.row)">
失效
</span>
<span
type="text"
size="small"
style="margin: 0 5px;"
class="option-span"
@click="removeItem(lists.row.id)"
>
删除
</span>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
:page-size="params.size"
layout="prev, pager, next"
:total="count"
@current-change="currentChange"
>
</el-pagination>
</div>
</div>
<el-dialog
width="815px"
:show-close="false"
:visible.sync="addMerchandise">
2323
<div slot="footer" class="dialog-footer">
<el-button @click="resetFormDialog('ruleForm'), addMerchandise = false">取消</el-button>
<el-button type="primary" @click="determine" :loading="isLoading">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import {
GET_discountOffers_LIST as GET_LIST,
DELETE_discountOffers as DELETE_ITEM,
COUNT_discountOffers as COUNT,
disable_discountOffers
} from '@/api/marketingCenter'
import Alert from "@/utils/alert";
import {pageSize} from '../../../config';
const FormContainer = () => import('./form.vue');
import {FormateYYMMDD, dateTimeFormateHHmm} from "@/filters/index";
export default {
name: "index",
data() {
return {
isLoading: false,
hackReset: true,
addMerchandise: false,
lists: [],
count: 0,
id: '',
params: {
from: 0,
size: pageSize,
query: '',
state: ''
}
}
},
mounted() {
this.getList();
this.getCount();
},
components: {
FormContainer
},
methods: {
/**
* 获取列表数据
*/
getList() {
GET_LIST(this.params).then(res => {
res.map((item) => {
if (item.permanent) {
item.date = '永久有效';
} else {
item.date = dateTimeFormateHHmm(item.startDate) + ' 至 ' + dateTimeFormateHHmm(item.endDate);
}
return item
});
this.lists = res
});
},
/**
* 获取总数
*/
getCount() {
COUNT(this.params).then(res => {
this.count = res
});
},
/**
* 查询
*/
submitForm(res) {
this.params = {
...this.params,
query: res.name,
state: res.state
};
this.getList();
this.getCount();
},
/**
* 重置
*/
resetForm() {
this.params = {
from: 0,
size: pageSize,
query: ''
};
this.getList();
this.getCount();
},
/**
* 翻页
*/
currentChange(res) {
this.params = {
...this.params,
from: parseInt(res - 1) * this.params.size,
size: pageSize,
};
this.getList()
},
enabledItem(row) {
disable_discountOffers(row.id).then(res => {
Alert.success("操作成功");
this.getList();
});
},
/**
* 删除商品
*/
removeItem(id) {
this.$confirm('确定删除此商品嘛?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
DELETE_ITEM(id).then((res) => {
let lists = [];
this.lists.map((item) => {
if (item.id != id) {
lists.push(item)
}
return item;
});
this.lists = lists;
});
Alert.success("删除成功");
}).catch(() => {
})
},
/**
* 编辑商品
*/
editItem(row) {
this.$router.push('/marketingCenter/salesPromotion/salesPromotionDetails?id=' + row.id + '&state=' + row.state);
},
/**
* 确定保存
*/
determine() {
let that = this;
let commodityDetails = this.$refs['commodityDetails'].$refs['ruleForm'];
commodityDetails.validate((val) => {
if (val) {
that.isLoading = true;
let list = this.$refs['commodityDetails'].ruleForm;
if (!list.id) {
ADD_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
} else {
UPDATE_ITEM(list).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.addMerchandise = false;
that.hackReset = false;
that.isLoading = false;
}, 1500);
})
}
setTimeout(() => {
that.getList();
that.isLoading = false;
}, 1500);
}
});
},
/**
* 取消弹层
*/
resetFormDialog() {
this.hackReset = false;//
this.$refs['commodityDetails'].$refs['ruleForm'].resetFields();
}
},
filters: {
filterState(val) {
switch (val) {
case 'PENDING':
return '未开始';
case 'ACTIVE':
return '进行中';
case 'DISABLED':
return '已失效';
case 'ENDED':
return '已结束';
case '':
return '全部';
}
},
filterCreatedDate(val) {
return dateTimeFormateHHmm(val)
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.table {
margin-top: 20px;
padding: 30px;
background: #fff;
.option-span {
color: #409EFF;
cursor: pointer;
}
}
.pagination {
margin-top: 20px;
}
</style>

505
src/views/marketingCenter/salesPromotion/salesPromotionDetails.vue

@ -0,0 +1,505 @@
<template>
<div class="form">
<el-form :model="ruleForm" ref="ruleForm" :rules="rules2" label-width="120px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name" :rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-input :disabled="DISABLED" v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="门槛">
<el-switch
:disabled="DISABLED"
v-model="ruleForm.applyRule"
active-text="无门槛">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.applyRule" prop="isFull">
<el-radio-group v-model="ruleForm.isMinQuantity" @change="applyRuleFun">
<el-radio label="minQuantity">
<el-input style="width: 80px" :disabled="DISABLED || !isMinQuantity"
@change="minQuantityFun" v-model="ruleForm.minQuantity"></el-input>
</el-radio>
<el-radio label="minAmount">
<el-input style="width: 80px" :disabled="DISABLED || isMinQuantity"
@change="minAmountFun" v-model="ruleForm.minAmount"></el-input>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="优惠方式" prop="isDiscount">
<el-radio-group v-model="ruleForm.discountType" :disabled="DISABLED" @change="discountTypeFun">
<el-radio label="DISCOUNT_RATE">
<el-input style="width: 80px" :disabled="DISABLED || !isDISCOUNT_RATE"
@change="discountFun" v-model="ruleForm.discount"></el-input>
</el-radio>
<el-radio label="AMOUNT_OFF">
<el-input style="width: 80px" :disabled="DISABLED || isDISCOUNT_RATE"
@change="reduceMoneyFun" v-model="ruleForm.reduceMoney"></el-input>
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="参与次数">
<el-switch
:disabled="DISABLED"
v-model="ruleForm.isUnlimited"
active-text="无限制">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.isUnlimited" prop="limitPerCustomer"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
每人参与
<el-input style="width: 80px" :disabled="DISABLED" v-model="ruleForm.limitPerCustomer"></el-input>
</el-form-item>
<el-form-item label="活动时间">
<el-switch
:disabled="disabled"
v-model="ruleForm.permanent"
active-text="永久有效">
</el-switch>
</el-form-item>
<el-form-item label="" v-if="!ruleForm.permanent" prop="date"
:rules="[{required: true, message: '不能为空', trigger: 'blur'}]">
<el-date-picker
:disabled="disabled"
v-model="date"
type="datetimerange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker>
</el-form-item>
<el-form-item label="选择场地">
<el-select v-model="ruleForm.locationIds" :disabled="DISABLED" placeholder="选择场地" multiple
:clearable="true">
<el-option v-for="item in locationIds" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item style="text-align: center;" v-if="!DISABLED">
<el-button type="primary" @click="submitForm('ruleForm')" :loading="isLoading">提交</el-button>
<el-button @click="resetForm('ruleForm')">重置</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import {GET_LOCATIONS} from '@/api/common'
import Alert from "@/utils/alert";
import {mapActions} from "vuex";
import {
POST_discountOffers as ADD_ITEM,
PUT_discountOffers as UPDATE_ITEM,
DETAIL_discountOffers as DETAIL_ITEM
} from '@/api/marketingCenter'
import {FormateYYMMDD} from "@/filters/index";
export default {
data() {
let validatePass = (rule, value, callback) => {
if (!value) {
return callback(new Error('不能为空'));
}
callback()
};
let isDiscount = (rule, value, callback) => {
if (!value) {
return callback(new Error('不能为空'));
}
callback()
};
return {
isMinQuantity: true,
isDISCOUNT_RATE: true,
DISABLED: false,
disabled: false,
isLoading: false,
date: [],
locationIds: [],
ruleForm: {
id: '',
name: '',
permanent: false,
startDate: '',
endDate: '',
date: '',
isFull: '',
isDiscount: '',
limitPerCustomer: '',
isMinQuantity: 'minQuantity',
applyRule: false,
discountType: 'DISCOUNT_RATE',
isUnlimited: false,
discount: '',
reduceMoney: '',
isPiece: '',
locationIds: []
},
rules2: {
isFull: [
{validator: validatePass, trigger: 'blur'}
],
isDiscount: [
{validator: isDiscount, trigger: 'blur'}
]
},
};
},
computed: {
id() {
return this.$route.query.id
},
state() {
return this.$route.query.state
}
},
mounted() {
if (this.id) {
this.getDetailItem();
this.ruleForm = {
...this.ruleForm,
id: this.id
}
}
GET_LOCATIONS().then(res => {
this.locationIds = res
})
},
watch: {
date(val) {
this.ruleForm = {
...this.ruleForm,
date: val,
startDate: val[0],
endDate: val[1]
};
}
},
methods: {
...mapActions([
"delVisitedView"
]),
/**
* 获取商品详情
*/
getDetailItem() {
DETAIL_ITEM(this.id).then(res => {
this.date.push(res.startDate);
this.date.push(res.endDate);
this.disabled = true;
if (this.state == 'DISABLED') {
this.DISABLED = true;
Alert.fail('已失效的活动不能编辑,只能查看');
}
if (res.limitPerCustomer === 0) {
res.isUnlimited = true
}
res.isFull = res.minQuantity || res.minAmount;
res.isDiscount = res.discount || res.reduceMoney;
this.ruleForm = res;
if (res.discountType == 'AMOUNT_OFF') {
this.ruleForm = {
...this.ruleForm,
reduceMoney: res.discount,
discount: '',
isDiscount: res.reduceMoney || res.discount
}
}
if (this.ruleForm.reduceMoney) {
this.isDISCOUNT_RATE = false
} else {
this.isDISCOUNT_RATE = true
}
if (res.minQuantity) {
this.ruleForm = {
...this.ruleForm,
isMinQuantity: 'minQuantity'
};
this.isMinQuantity = true
} else {
this.ruleForm = {
...this.ruleForm,
isMinQuantity: 'minAmount'
};
this.isMinQuantity = false
}
})
},
minQuantityFun(val) {
this.ruleForm = {
...this.ruleForm,
isFull: val
}
},
minAmountFun(val) {
this.ruleForm = {
...this.ruleForm,
isFull: val
}
},
discountFun(val) {
this.ruleForm = {
...this.ruleForm,
isDiscount: val
}
},
reduceMoneyFun(val) {
this.ruleForm = {
...this.ruleForm,
isDiscount: val
}
},
applyRuleFun(val) {
if (val = 'minQuantity') {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
minQuantity: ''
};
this.isMinQuantity = !this.isMinQuantity
} else {
this.ruleForm = {
...this.ruleForm,
minQuantity: '',
minAmount: ''
};
this.isMinQuantity = !this.isMinQuantity
}
},
discountTypeFun(val) {
if (val = 'DISCOUNT_RATE') {
this.ruleForm = {
...this.ruleForm,
discount: '',
reduceMoney: ''
};
this.isDISCOUNT_RATE = !this.isDISCOUNT_RATE
} else {
this.ruleForm = {
...this.ruleForm,
discount: '',
reduceMoney: ''
};
this.isDISCOUNT_RATE = !this.isDISCOUNT_RATE
}
},
/**
* 无门槛
*/
noThresholdFun(val) {
this.noThreshold = val;
if (val) {
this.ruleForm = {
...this.ruleForm,
minAmount: ' '
}
} else {
this.ruleForm = {
...this.ruleForm,
minAmount: '',
startDate: '',
endDate: ''
}
}
},
/**
* 不限制
*/
noRestrictionFun(val) {
this.noRestriction = val;
},
/**
* 重置
*/
resetForm() {
this.$refs['ruleForm'].resetFields();
},
/**
* 提交
*/
submitForm() {
let that = this;
let salesPromotionDetails = this.$refs['ruleForm'];
salesPromotionDetails.validate((val) => {
if (val) {
that.isLoading = true;
if (that.ruleForm.isUnlimited) {
that.ruleForm = {
...that.ruleForm,
limitPerCustomer: 0
}
}
if (this.ruleForm.discountType == 'AMOUNT_OFF') {
that.ruleForm = {
...that.ruleForm,
discount: this.ruleForm.reduceMoney
}
}
if (!that.ruleForm.id) {
ADD_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('新建成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
} else {
UPDATE_ITEM({...that.ruleForm}).then(res => {
setTimeout(() => {
Alert.success('更新成功');
that.isLoading = false;
that.delVisitedView(that.$route).then(res => {
that.$router.go(-1);
});
}, 1500);
}).catch(err => {
Alert.fail(err);
that.isLoading = false;
})
}
}
});
}
}
}
</script>
<style lang="scss" scoped>
.form {
height: 100%;
background: #fff;
padding: 30px 30px 30px 0;
}
.file {
position: relative;
top: 0;
display: inline-block;
border: 1px solid #e6e6e6;
border-radius: 4px;
overflow: hidden;
color: #1E88C7;
text-decoration: none;
text-indent: 0;
width: 110px;
height: 140px;
text-align: center;
line-height: 85px;
font-size: 40px;
input {
position: absolute;
font-size: 100px;
right: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
.image {
width: 110px;
height: 140px;
position: relative;
img {
width: 100%;
height: 100%;
}
i {
position: absolute;
top: -6px;
right: -6px;
display: inline-block;
width: 15px;
height: 15px;
line-height: 15px;
text-align: center;
background: red;
border-radius: 50%;
color: #fff;
cursor: pointer;
}
}
.el-textarea {
width: 400px;
height: 80px;
resize: none;
&.el-textarea__inner {
resize: none;
}
}
.el-form-item__content {
position: relative;
.info {
position: absolute;
font-size: 12px;
top: 48px;
color: #ccc;
line-height: normal;
}
}
</style>

2
src/views/order/salesOrder/index.vue

@ -116,7 +116,7 @@
GET_ORDER_LIST(this.params).then(res => {
let lists = res.map((item) => {
item.state = item.state == "COMPLETED" ? "支付成功" : "支付失败";
item.paymentGatewayType = item.paymentGatewayType == "wx" ? "微信" : "支付宝";
item.paymentGatewayType = item.paymentGatewayType.toLocaleLowerCase() == "wx" ? "微信" : "支付宝";
item.createdDate = moment(item.createdDate).format('YYYY-MM-DD HH:mm:ss');
return item;
});

Loading…
Cancel
Save