车型套餐关联

2025-04-23 09:57:09 +08:00 · 2025-04-23 09:57:09 +08:00 · 494c279018
commit 494c279018
parent aa43b0c3d6
7 changed files with 53 additions and 18 deletions
--- a/src/components/BaseRemoteSelect/index.vue
+++ b/src/components/BaseRemoteSelect/index.vue
@ -48,6 +48,7 @@ export default {
        pageNum: 1,
        pageSize: 999
      },
+      opened: false,
    }
  },
  computed: {
@ -67,7 +68,7 @@ export default {
  watch: {
    value: {
      handler(nv, ov) {
-        if (isEmpty(ov) && !isEmpty(nv) && this.loadApi) {
+        if (isEmpty(ov) && !isEmpty(nv) && !this.opened && this.loadApi) {
          this.loadData(nv);
        } 
      },
@ -102,7 +103,10 @@ export default {
    // 下拉框可见性变化
    handleVisibleChange(visible) {
      if (visible) {
+        this.opened = true;
        this.getOptions();
+      } else {
+        this.opened = false;
      }
    },
    // 全选
@ -123,6 +127,7 @@ export default {
        let item = this.options.find(item => value.includes(item[this.prop]));
        this.$emit('change', item);
      }
+      this.selectedValue = value;
    },
    // 获取选项
    getOptions() {
--- a/src/components/ImagePreview/index.vue
+++ b/src/components/ImagePreview/index.vue
@ -4,6 +4,7 @@
    fit="cover"
    :style="`width:${realWidth};height:${realHeight};`"
    :preview-src-list="realSrcList"
+    :class="{ 'blur-effect': blur }"
  >
    <div slot="error" class="image-slot">
      <i class="el-icon-picture-outline"></i>
@ -28,6 +29,10 @@ export default {
    height: {
      type: [Number, String],
      default: ""
+    },
+    blur: {
+      type: Boolean,
+      default: false
    }
  },
  computed: {
@ -86,5 +91,10 @@ export default {
    color: #909399;
    font-size: 30px;
  }
+  &.blur-effect {
+    ::v-deep .el-image__inner {
+      filter: blur(5px);
+    }
+  }
 }
 </style>
--- a/src/views/bst/model/components/ModelEditDialog.vue
+++ b/src/views/bst/model/components/ModelEditDialog.vue
@ -51,7 +51,6 @@
            v-model="form.suitIds"
            :query="suitQuery"
            multiple
-            :init-options="initSuitOptions"
            :before-get-options="beforeOpenSuit"
          />
        </form-col>
@ -148,16 +147,6 @@ export default {
        userId: this.form.userId
      }
    },
-    // 套餐初始化选项
-    initSuitOptions() {
-      if (this.form.suitList == null || this.form.suitList.length === 0) {
-        return [];
-      }
-      return this.form.suitList.map(item => ({
-        id: item.id,
-        name: item.name
-      }));
-    }
  },
  methods: {
    handleChangeUser() {
--- a/src/views/bst/model/index.vue
+++ b/src/views/bst/model/index.vue
@ -77,7 +77,7 @@
              {{d.row[column.key]}}
            </template>
            <template v-else-if="column.key === 'lowBatteryReminderSwitch'">
-              <boolean-tag :value="d.row[column.key]" true-text="开启" false-text="关闭"/>
+              <boolean-tag :value="d.row[column.key]" true-text="开启" false-text="关闭" size="mini"/>
              <template v-if="d.row.lowBatteryReminderSwitch">
                {{d.row.lowBatteryReminder | dv}} %
              </template>
@ -91,6 +91,9 @@
            <template v-else-if="column.key === 'userName'">
              <user-link :id="d.row.userId" :text="d.row.userName" />
            </template>
+            <template v-else-if="column.key === 'suitNames'">
+              <el-tag type="primary" v-for="suitName of d.row.suitNames" :key="suitName" size="mini" style="margin-right: 4px;">{{suitName | dv}}</el-tag>
+            </template>
            <template v-else>
              {{d.row[column.key]}}
            </template>
@ -169,8 +172,9 @@ export default {
        {key: 'fullVoltage', visible: true, label: '满电电压', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
        {key: 'lowVoltage', visible: true, label: '亏电电压', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
        {key: 'fullEndurance', visible: true, label: '满电续航', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
-        {key: 'remark', visible: true, label: '备注', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
        {key: 'lowBatteryReminderSwitch', visible: true, label: '低电量提醒', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
+        {key: 'suitNames', visible: true, label: '应用套餐', minWidth: "200", sortable: false, overflow: false, align: 'center', width: null},
+        {key: 'remark', visible: true, label: '备注', minWidth: null, sortable: true, overflow: true, align: 'center', width: null},
        {key: 'createTime', visible: true, label: '创建时间', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
      ],
      // 排序方式
--- a/src/views/bst/realName/index.vue
+++ b/src/views/bst/realName/index.vue
@ -64,7 +64,7 @@
              {{d.row[column.key]}}
            </template>
            <template v-else-if="column.key === 'picture'">
-              <image-preview :src="d.row[column.key]" :width="50" :height="50" />
+              <image-preview :src="d.row[column.key]" :width="50" :height="50" blur/>
            </template>
            <template v-else-if="column.key === 'status'">
              <dict-tag :options="dict.type.real_name_status" :value="d.row[column.key]" />
--- a/src/views/bst/suit/components/SuitEditDialog.vue
+++ b/src/views/bst/suit/components/SuitEditDialog.vue
@ -15,6 +15,15 @@
        <form-col :span="span"  label="套餐名称" prop="name">
          <el-input v-model="form.name" placeholder="请输入套餐名称" />
        </form-col>
+        <form-col :span="24"  label="适用车型" prop="modelIds">
+          <model-remote-select 
+            :before-get-options="beforeGetModelOptions"
+            v-model="form.modelIds" 
+            multiple 
+            :query="modelQuery" 
+            style="width: 100%;" 
+          />
+        </form-col>
        <form-col :span="span"  label="套餐类型" prop="type">
          <el-select v-model="form.type" placeholder="请选择套餐类型" style="width: 100%;">
            <el-option
@ -205,10 +214,11 @@ import { SuitRentalUnit, SuitRidingRule, SuitStatus, RoleKeys, SuitType } from '
 import CollapsePanel from '@/components/CollapsePanel/index.vue';
 import { deepClone, dictLabel } from '@/utils';
 import { mapGetters } from 'vuex';
+import ModelRemoteSelect from '@/components/Business/Model/ModelRemoteSelect.vue';

 export default {
  name: 'SuitEditDialog',
-  components: { FormCol, UserInput, CollapsePanel },
+  components: { FormCol, UserInput, CollapsePanel, ModelRemoteSelect },
  dicts: ['suit_status', 'suit_rental_unit', 'suit_riding_rule', 'suit_type'],
  props: {
    visible: {
@ -313,9 +323,21 @@ export default {
      return (value) => {
        return dictLabel(this.dict.type.suit_rental_unit, value);
      }
+    },
+    modelQuery() {
+      return {
+        userId: this.form.userId,
+      }
    }
  },
  methods: {
+    beforeGetModelOptions() {
+      if (this.form.userId == null) {
+        this.$message.warning("请先选择用户");
+        return false;
+      }
+      return true;
+    },
    // 添加计费规则
    addRidingRule(index) {
      let current = this.form.intervalRule[index];
@ -354,6 +376,7 @@ export default {
        freeRideTime: null,
        rentalUnit: SuitRentalUnit.MINUTE,
        ridingRule: SuitRidingRule.START,
+        modelIds: [],
        startRule: {
          startingTime: 60,
          startingPrice: 5,
--- a/src/views/bst/suit/index.vue
+++ b/src/views/bst/suit/index.vue
@ -133,6 +133,9 @@
            <template v-else-if="column.key === 'userName'">
              <user-link :id="d.row.userId" :text="d.row.userName" />
            </template>
+            <template v-else-if="column.key === 'modelNames'">
+              <el-tag type="primary" v-for="modelName of d.row.modelNames" :key="modelName" size="mini" style="margin-right: 4px;">{{modelName | dv}}</el-tag>
+            </template>
            <template v-else>
              {{d.row[column.key]}}
            </template>
@ -210,8 +213,9 @@ export default {
        {key: 'instructions', visible: true, label: '说明', minWidth: null, sortable: true, overflow: true, align: 'center', width: null},
        {key: 'freeRideTime', visible: true, label: '免费时长', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
        {key: 'orderNum', visible: true, label: '排序', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
-        {key: 'seconds', visible: true, label: '可用时长', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
-        {key: 'createTime', visible: true, label: '创建时间', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
+        {key: 'seconds', visible: true, label: '可用时长', minWidth: null, sortable: true, overflow: false, align: 'center', width: "180"},
+        {key: 'modelNames', visible: true, label: '适用车型', minWidth: "200", sortable: false, overflow: false, align: 'center', width: null},
+        {key: 'createTime', visible: true, label: '创建时间', minWidth: null, sortable: true, overflow: false, align: 'center', width: "180"},
      ],
      // 排序方式
      orderSorts: ['ascending', 'descending', null],