goods.php 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <template id="order">
  2. <el-row>
  3. <el-col :span="24">
  4. <el-form-item label-width="180px" label="商品详情页推荐设置">
  5. <el-col :span="14">
  6. <el-switch v-model="ruleForm.goods.is_recommend_status.value" :active-value="1" :inactive-value="0"></el-switch>
  7. </el-col>
  8. <el-col :span="14" v-if="ruleForm.goods.is_recommend_status.value==1">
  9. <div class="goods-list" flex="cross:center wrap:wrap">
  10. <div class="goods-item" v-for="(goods,goodsIndex) in ruleForm.goods.goods_list.value">
  11. <el-tooltip effect="dark" content="移除商品" placement="top">
  12. <el-button @click="deleteGoods(goodsIndex, 'goods')" circle
  13. class="goods-delete" type="danger"
  14. icon="el-icon-close"></el-button>
  15. </el-tooltip>
  16. <div class="goods-pic" :style="'background-image:url('+goods.cover_pic+')'"></div>
  17. </div>
  18. </div>
  19. </el-col>
  20. <el-col :span="14">
  21. <div v-if="ruleForm.goods.goods_list.value.length < goodsDialog.max" class="goods-add">
  22. <el-tooltip effect="dark" content="添加商品" placement="top">
  23. <el-button @click="showGoodsDialog('goods')"
  24. icon="el-icon-plus"></el-button>
  25. </el-tooltip>
  26. </div>
  27. </el-col>
  28. </el-form-item>
  29. <el-form-item label-width="180px" label="订单完成后推荐设置">
  30. <el-col :span="14">
  31. <el-switch v-model="ruleForm.order_pay.is_recommend_status.value" :active-value="1" :inactive-value="0"></el-switch>
  32. </el-col>
  33. <el-col :span="14" v-if="ruleForm.order_pay.is_recommend_status.value==1">
  34. <div class="goods-list" flex="cross:center wrap:wrap">
  35. <div class="goods-item" v-for="(goods,goodsIndex) in ruleForm.order_pay.goods_list.value">
  36. <el-tooltip effect="dark" content="移除商品" placement="top">
  37. <el-button @click="deleteGoods(goodsIndex, 'order_pay')" circle
  38. class="goods-delete" type="danger"
  39. icon="el-icon-close"></el-button>
  40. </el-tooltip>
  41. <div class="goods-pic" :style="'background-image:url('+goods.cover_pic+')'"></div>
  42. </div>
  43. </div>
  44. </el-col>
  45. <el-col :span="14">
  46. <div v-if="ruleForm.order_pay.goods_list.value.length < goodsDialog.max" class="goods-add">
  47. <el-tooltip effect="dark" content="添加商品" placement="top">
  48. <el-button @click="showGoodsDialog('order_pay')"
  49. icon="el-icon-plus"></el-button>
  50. </el-tooltip>
  51. </div>
  52. </el-col>
  53. </el-form-item>
  54. <el-form-item label-width="180px" label="评论后推荐设置">
  55. <el-col :span="14">
  56. <el-switch v-model="ruleForm.order_comment.is_recommend_status.value" :active-value="1" :inactive-value="0"></el-switch>
  57. </el-col>
  58. <el-col :span="14" v-if="ruleForm.order_comment.is_recommend_status.value==1">
  59. <div class="goods-list" flex="cross:center wrap:wrap">
  60. <div class="goods-item" v-for="(goods,goodsIndex) in ruleForm.order_comment.goods_list.value">
  61. <el-tooltip effect="dark" content="移除商品" placement="top">
  62. <el-button @click="deleteGoods(goodsIndex, 'order_comment')" circle
  63. class="goods-delete" type="danger"
  64. icon="el-icon-close"></el-button>
  65. </el-tooltip>
  66. <div class="goods-pic" :style="'background-image:url('+goods.cover_pic+')'"></div>
  67. </div>
  68. </div>
  69. </el-col>
  70. <el-col :span="14">
  71. <div v-if="ruleForm.order_comment.goods_list.value.length < goodsDialog.max" class="goods-add">
  72. <el-tooltip effect="dark" content="添加商品" placement="top">
  73. <el-button @click="showGoodsDialog('order_comment')"
  74. icon="el-icon-plus"></el-button>
  75. </el-tooltip>
  76. </div>
  77. </el-col>
  78. </el-form-item>
  79. </el-col>
  80. </el-row>
  81. <el-dialog @open="getGoods" title="选择商品" :visible.sync="goodsDialog.visible" :close-on-click-modal="false">
  82. <el-form size="small" :inline="true" @submit.native.prevent>
  83. <el-form-item>
  84. <div class="input-item">
  85. <el-input @clear="toSearch" clearable @keyup.enter.native="toSearch" size="small"
  86. placeholder="请输入商品ID/名称搜索"
  87. v-model="keyword">
  88. <el-button slot="append" icon="el-icon-search" @click="toSearch"></el-button>
  89. </el-input>
  90. </div>
  91. </el-form-item>
  92. </el-form>
  93. <el-table :data="goodsDialog.list" v-loading="goodsDialog.loading" @selection-change="goodsSelectionChange">
  94. <el-table-column label="选择" type="selection"></el-table-column>
  95. <el-table-column label="ID" prop="id" width="100px"></el-table-column>
  96. <el-table-column label="封面图" width="100px" prop="cover_pic">
  97. <template slot-scope="scope">
  98. <com-image mode="aspectFill" width='50px' height='50px' :src="scope.row.cover_pic ? scope.row.cover_pic : ''"></com-image>
  99. </template>
  100. </el-table-column>
  101. <el-table-column label="名称" prop="goods_name"></el-table-column>
  102. </el-table>
  103. <div style="text-align: center; margin-top: 15px;">
  104. <el-pagination
  105. v-if="goodsDialog.pagination"
  106. style="display: inline-block"
  107. background
  108. @current-change="goodsDialogPageChange"
  109. layout="prev, pager, next"
  110. :page-size.sync="goodsDialog.pagination.pageSize"
  111. :total="Number(goodsDialog.pagination.totalCount)">
  112. </el-pagination>
  113. </div>
  114. <div slot="footer">
  115. <el-button @click="goodsDialog.visible = false">取 消</el-button>
  116. <el-button type="primary" @click="addGoods">确 定</el-button>
  117. </div>
  118. </el-dialog>
  119. </template>