areaDividend.js 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. define({
  2. name: "areaDividend",
  3. template: `
  4. <div>
  5. <el-form ref="setForm" :model="jsonData" label-width="130px">
  6. <div id="vue_head">
  7. <div class="base_set">
  8. <div class="vue-main-title">
  9. <div class="vue-main-title-left"></div>
  10. <div class="vue-main-title-content">区域分红设置</div>
  11. </div>
  12. <el-divider></el-divider>
  13. <div class="vue-main-form">
  14. <el-form-item label="开启区域分红">
  15. <el-radio v-model="jsonData.is_dividend" :label="0">关闭</el-radio>
  16. <el-radio v-model="jsonData.is_dividend" :label="1">开启</el-radio>
  17. <div class="help-block">如果不开启区域分红,则不产生分红佣金</div>
  18. </el-form-item>
  19. <el-form-item label="独立规则">
  20. <el-switch v-model="jsonData.has_dividend" :active-value="1" :inactive-value="0"></el-switch>
  21. <span>启用独立佣金比例</span>
  22. <div class="help-block">启用独立分红金额设置,此商品拥有独自的分红金额,不受默认设置限制</div>
  23. </el-form-item>
  24. <el-form-item label="独立分红金额" v-show="jsonData.has_dividend">
  25. <el-col :span="6">
  26. <el-form-item>
  27. <el-input placeholder="请输入金额" v-model="jsonData.has_dividend_rate" maxlength="10" size="small" oninput="if(value<0)value=''" type="number">
  28. <template slot="append">% 固定</template>
  29. </el-input>
  30. </el-form-item>
  31. </el-col>
  32. <el-col :span="6">
  33. <el-form-item>
  34. <el-input placeholder="请输入金额" v-model="jsonData.has_dividend_price" maxlength="10" size="small" oninput="if(value<0)value=''" type="number">
  35. <template slot="append">元</template>
  36. </el-input>
  37. </el-form-item>
  38. </el-col>
  39. </el-form-item>
  40. <el-form-item v-show="jsonData.has_dividend">
  41. <div class="help-block">如果比例为空或等于0,则使用固定规则,如果都为空或等于0则使用默认规则</div>
  42. </el-form-item>
  43. <el-form-item label="独立设置">
  44. <el-switch v-model="jsonData.alone_rule" :active-value="1" :inactive-value="0"></el-switch>
  45. <span>启用独立佣金比例</span>
  46. <div class="help-block">启用独立设置,如果比例为空为0则无分红佣金(开启了第一个独立规则,独立设置就无法开启)</div>
  47. </el-form-item>
  48. <div v-show="jsonData.alone_rule">
  49. <el-form-item>
  50. <el-input style="width: 300px;" v-model="jsonData.province_rate" >
  51. <template slot="prepend">省</template>
  52. <template slot="append">%</template>
  53. </el-input>
  54. </el-form-item>
  55. <el-form-item>
  56. <el-input style="width: 300px;" v-model="jsonData.city_rate" >
  57. <template slot="prepend">市</template>
  58. <template slot="append">%</template>
  59. </el-input>
  60. </el-form-item>
  61. <el-form-item>
  62. <el-input style="width: 300px;" v-model="jsonData.area_rate" >
  63. <template slot="prepend">区/县</template>
  64. <template slot="append">%</template>
  65. </el-input>
  66. </el-form-item>
  67. <el-form-item>
  68. <el-input style="width: 300px;" v-model="jsonData.street_rate" >
  69. <template slot="prepend">街道/乡镇</template>
  70. <template slot="append">%</template>
  71. </el-input>
  72. </el-form-item>
  73. </div>
  74. <el-divider></el-divider>
  75. </div>
  76. </div>
  77. </div>
  78. </el-form>
  79. </div>
  80. `,
  81. style: `
  82. .help-block{
  83. font-size:12px;
  84. }
  85. .location{
  86. display:flex;
  87. justify-content:flex-end;
  88. }
  89. `,
  90. props: {
  91. form: {
  92. type: Object,
  93. default() {
  94. return {}
  95. }
  96. },
  97. },
  98. data(){
  99. return {
  100. jsonData: {
  101. is_dividend: 0,
  102. has_dividend: 0,
  103. has_dividend_rate: '',
  104. has_dividend_price: '',
  105. alone_rule: 0,
  106. province_rate:'',
  107. city_rate:'',
  108. area_rate: '',
  109. street_rate: '',
  110. },
  111. }
  112. },
  113. mounted() {
  114. if (this.form.item && !Array.isArray(this.form.item)) {
  115. this.jsonData = {...this.form.item};
  116. }
  117. },
  118. methods: {
  119. validate(){
  120. let result = {
  121. is_dividend: this.jsonData.is_dividend,
  122. has_dividend: this.jsonData.has_dividend,
  123. alone_rule:this.jsonData.alone_rule,
  124. };
  125. if (this.jsonData.has_dividend) {
  126. result.has_dividend_rate = this.jsonData.has_dividend_rate?this.jsonData.has_dividend_rate:0;
  127. result.has_dividend_price = this.jsonData.has_dividend_price?this.jsonData.has_dividend_price:0;
  128. }
  129. if (this.jsonData.alone_rule) {
  130. result.province_rate = this.jsonData.province_rate?this.jsonData.province_rate:0;
  131. result.city_rate = this.jsonData.city_rate?this.jsonData.city_rate:0;
  132. result.area_rate = this.jsonData.area_rate?this.jsonData.area_rate:0;
  133. result.street_rate = this.jsonData.street_rate?this.jsonData.street_rate:0;
  134. }
  135. return result;
  136. },
  137. },
  138. });