jiangping
2025-02-21 1baed91dd6c4cfc8a230c2857132ef6302cc4f3c
admin/src/views/combo/components/Edit.vue
@@ -1,35 +1,44 @@
<template>
  <GlobalWindow :title="param.id ? '编辑套餐' : '新建套餐'" :visible.sync="isShowModal" :confirm-working="isLoading"
    width="1000px" @close="close" @confirm="confirm">
    width="900px" @close="close" @confirm="confirm">
    <el-form :model="param" label-width="100px" ref="form" :rules="rules">
      <div class="form_title">基本信息</div>
      <el-form-item label="套餐名称" prop="name">
        <el-input class="w200" v-model="param.name" placeholder="请输入套餐名称" v-trim />
      </el-form-item>
      <el-form-item label="类型">
        <el-select class="w200" :disabled="true" v-model="param.warehouseId">
      <el-form-item label="类型" prop="type">
        <el-select class="w200" :disabled="true" v-model="param.type">
          <el-option label="期限卡" :value="0"></el-option>
          <el-option label="次卡" :value="1"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="每日骑行限制">
        <div>
          <el-radio v-model="param.aa" label="1">不限制</el-radio>
          <el-radio v-model="param.aa" label="2">限制时长</el-radio>
        <div class="df_ac">
          <div class="mr10">
            <el-radio @change="changeType" v-model="param.limitType" :label="0">不限制</el-radio>
            <el-radio @change="changeType" v-model="param.limitType" :label="1">限制时长</el-radio>
          </div>
          <el-input v-if="param.limitType == 1" class="w200" v-model="param.limitTime" v-trim />
          <span v-if="param.limitType == 1" class="ml10">分钟</span>
        </div>
      </el-form-item>
      <el-form-item label="销售价">
        <el-input class="w200" v-model="param.name" placeholder="请输入价格" v-trim />
      <el-form-item label="销售价" prop="price">
        <el-input class="w200"
          oninput="value=value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3').replace(/^\./g, '')"
          v-model="param.price" placeholder="请输入价格" v-trim />
      </el-form-item>
      <el-form-item label="划线价">
        <el-input class="w200" v-model="param.name" placeholder="请输入展示的划线价" v-trim />
        <el-input class="w200" v-model="param.linePrice"
          oninput="value=value.replace(/[^\d.]/g, '').replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.').replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3').replace(/^\./g, '')"
          placeholder="请输入展示的划线价" v-trim />
      </el-form-item>
      <el-form-item label="销售渠道">
        <el-checkbox v-model="param.ada">小程序端</el-checkbox>
      <el-form-item label="销售渠道" prop="channel">
        <el-checkbox v-model="param.channel" disabled :true-label="0" :false-label="1">小程序端</el-checkbox>
      </el-form-item>
      <el-form-item label="套餐图片">
        <div class="df_ac">
          <UploadAvatarImage :file="{ 'imgurlfull': param.fileFullUrl, 'imgurl': param.fileUrl }"
            :uploadData="{ folder: 'ywPatrol/' }" @uploadSuccess="uploadAvatarSuccess" @uploadEnd="isUploading = false"
            :uploadData="{ folder: 'DISCOUNT/' }" @uploadSuccess="uploadAvatarSuccess" @uploadEnd="isUploading = false"
            @uploadBegin="isUploading = true" />
          <div class="img_place">
            <div>上传图片不允许涉及政治敏感与色情;</div>
@@ -39,7 +48,7 @@
        </div>
      </el-form-item>
      <el-form-item label="套餐简介">
        <el-input class="w400" v-model="param.name" placeholder="请输入套餐简介" v-trim />
        <el-input class="w400" v-model="param.descs" placeholder="请输入套餐简介" v-trim />
      </el-form-item>
      <el-form-item label="套餐描述">
        <RichEditor :content="{ content: param.content }" @edit="param.content = $event"></RichEditor>
@@ -48,50 +57,56 @@
        <div>适用规则</div>
        <div class="placeholder9">销售时间、使用时间等设置</div>
      </div>
      <el-form-item label="销售时段">
        <el-date-picker class="w400" v-model="param.value1" value-format="yyyy-MM-dd" type="daterange" range-separator=" ~ " />
      <el-form-item label="销售时段" prop="saleDate">
        <el-date-picker class="w400" v-model="param.saleDate" value-format="yyyy-MM-dd" type="daterange"
          range-separator=" ~ " />
      </el-form-item>
      <div class="df_ac">
        <el-form-item label="使用时间" class="mr16">
          <el-select v-model="param.aaadd" style="width: 140px;">
        <el-form-item prop="useType" label="使用时间" class="mr16">
          <el-select @change="changeUseDate" v-model="param.useType" style="width: 140px;">
            <el-option label="固定日期" :value="0"></el-option>
            <el-option label="购买后生效" :value="1"></el-option>
            <el-option label="指定日期生效" :value="1"></el-option>
            <el-option label="指定日期生效" :value="2"></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label-width="80px" label="固定日期">
          <el-date-picker v-model="param.value1" value-format="yyyy-MM-dd" type="daterange" range-separator=" ~ " />
        </el-form-item> -->
        <!-- <el-form-item label-width="60px" label="有效期">
          <el-input style="width: 130px;" v-model="param.name" placeholder="请输入有效天数" v-trim />
        </el-form-item> -->
        <el-form-item label-width="0px">
        <el-form-item v-if="param.useType == 0" label-width="80px" label="固定日期">
          <el-date-picker v-model="param.useDate" value-format="yyyy-MM-dd" type="daterange" range-separator=" ~ " />
        </el-form-item>
        <el-form-item v-if="param.useType == 1" label-width="60px" label="有效期">
          <el-input style="width: 130px;" oninput="value=value.replace(/^(0+)|[^\d]+/g, '').slice(0, 8)"
            v-model="param.useDays" placeholder="请输入有效天数" v-trim />
          <span class="ml10">天</span>
        </el-form-item>
        <el-form-item v-if="param.useType == 2" label-width="0px">
          <div class="df_ac">
            <el-date-picker class="w200" v-model="param.dasdas" value-format="yyyy-MM-dd" type="date" />
            <el-date-picker class="w200" v-model="param.useStartDate" value-format="yyyy-MM-dd" type="date" />
            <span class="ml10 mr10">开始生效,有效期</span>
            <el-input style="width: 130px;" v-model="param.name" placeholder="请输入有效天数" v-trim />
            <el-input style="width: 130px;" v-model="param.useDays"
              oninput="value=value.replace(/^(0+)|[^\d]+/g, '').slice(0, 8)" placeholder="请输入有效天数" v-trim />
            <span class="ml10">天</span>
          </div>
        </el-form-item>
      </div>
      <el-form-item label="适用范围">
        <el-checkbox-group v-model="param.checkList">
          <el-checkbox label="工作日"></el-checkbox>
          <el-checkbox label="节假日"></el-checkbox>
        </el-checkbox-group>
      <el-form-item :prop="param.useWorkday == 1 ? 'useWorkday' : 'useHoliday'" label="适用范围">
        <div class="df_ac">
          <el-checkbox v-model="param.useWorkday" :true-label="1" :false-label="0" label="工作日"></el-checkbox>
          <el-checkbox v-model="param.useHoliday" :true-label="1" :false-label="0" label="节假日"></el-checkbox>
        </div>
      </el-form-item>
      <el-form-item label="适用项目">
        <el-checkbox-group v-model="param.checkList">
          <el-checkbox label="自行车"></el-checkbox>
          <el-checkbox label="电动车"></el-checkbox>
        </el-checkbox-group>
      <el-form-item :prop="param.isbike == 1 ? 'isbike' : 'iselecbike'" label="适用项目">
        <div class="df_ac">
          <el-checkbox v-model="param.isbike" :true-label="1" :false-label="0" label="自行车"></el-checkbox>
          <el-checkbox v-model="param.iselecbike" :true-label="1" :false-label="0" label="电动车"></el-checkbox>
        </div>
      </el-form-item>
      <el-form-item label="总限额">
        <el-input class="w400" v-model="param.name" placeholder="请输入总发售数量" v-trim />
        <el-input class="w400" v-model="param.saleLimit" oninput="value=value.replace(/^(0+)|[^\d]+/g, '').slice(0, 12)"
          placeholder="请输入总发售数量" v-trim />
        <div class="placeholder9">请输入总发售数量,销量大于该数量后,不再支持销售;为空表示不限制</div>
      </el-form-item>
      <el-form-item label="日限额">
        <el-input class="w400" v-model="param.name" placeholder="请输入单日发售数量" v-trim />
        <el-input class="w400" v-model="param.saleDayLimit"
          oninput="value=value.replace(/^(0+)|[^\d]+/g, '').slice(0, 12)" placeholder="请输入单日发售数量" v-trim />
        <div class="placeholder9">请输入日发售数量,当日销量大于该数量后,不再支持销售;为空表示不限制</div>
      </el-form-item>
@@ -104,10 +119,9 @@
<script>
import GlobalWindow from '@/components/common/GlobalWindow'
// import { fetchList as getStoreList } from '@/api/ywWarehouse'
// import { ywOutinboundCreate } from '@/api/store/index'
import { comboAddPost, comboEditPost, comboDetailPost } from '@/api/business/combo.js'
import UploadAvatarImage from '@/components/common/UploadAvatarImage'
import { StoreTypeOps, rules } from './config'
import { rulesCombo } from './config'
import { Message } from 'element-ui'
import RichEditor from '@/components/common/RichEditor'
// import dayjs from 'dayjs'
@@ -117,13 +131,25 @@
  data() {
    return {
      // 表单数据
      param: { checkList: [], content: '' },
      param: {
        type: 0,
        limitType: 0,
        channel: 0,
        useType: 0,
        useWorkday: 1,
        useHoliday: 0,
        iselecbike: 0,
        isbike: 1,
        checkList: [],
        content: ''
      },
      isShowModal: false,
      isShowSel: false,
      isLoading: false,
      isUploading: false,
      // 验证规则
      rules,
      rules: rulesCombo,
      storeList: [],
      list: [],
      StoreTypeOps: [],
@@ -137,47 +163,48 @@
  },
  methods: {
    confirm() {
      const { param } = this
      this.$refs['form'].validate((valid) => {
        if (valid) {
          const { param, list } = this
          if (list.length == 0) return Message.warning('请先选择物料信息')
          let count = 0 // 入库数量必填
          list.forEach(item => {
            if (!item.stock) count++
          })
          if (count > 0) return Message.warning('请输入正确的入库数量')
          if (param.useDate && param.useDate.length > 0) {
            param.useStartDate = param.useDate[0]
            param.useEndDate = param.useDate[1]
          } else {
            param.useStartDate = param.useType == 2 ? param.useStartDate : null
            param.useEndDate = null
          }
          if (param.saleDate && param.saleDate.length > 0) {
            param.startDate = param.saleDate[0]
            param.endDate = param.saleDate[1]
          } else {
            param.startDate = null
            param.endDate = null
          }
          this.isLoading = true
          ywOutinboundCreate({
            ...param,
            recordList: list
          let fn = param.id ? comboEditPost : comboAddPost
          fn({
            ...param
          }).then(res => {
            this.isLoading = false
            Message.success('提交成功')
            this.$emit('success')
            this.close()
            if (res) {
              Message.success('提交成功')
              this.$emit('success')
              this.close()
            }
          }, () => {
            this.isLoading = false
          })
        }
      })
    },
    initData() {
      this.$set(this.param, 'doneDate', dayjs().format('YYYY-MM-DD'))
      getStoreList({ capacity: 9999, page: 1, model: { status: 0 } }).then(res => {
        this.storeList = res.records || []
      })
    changeType() {
      this.$set(this.param, 'limitTime', null)
    },
    changeSel(val) {
      const list = val
      list.forEach(item => {
        const index = this.list.findIndex(i => i.id == item.id)
        if (index == -1) {
          item.materialId = item.id
          item.multifile = null
          item.createDate = null
          this.list.push(item)
        }
      })
    changeUseDate() {
      this.$set(this.param, 'useDate', null)
      this.$set(this.param, 'useDays', null)
      this.$set(this.param, 'useStartDate', null)
      this.$set(this.param, 'useEndDate', null)
    },
    uploadAvatarSuccess(file) {
      this.$set(this.param, 'fileUrl', file.imgurl)
@@ -191,12 +218,19 @@
      })
    },
    close() {
      console.log('------');
      this.isShowModal = false
      this.$emit('close')
    },
    getDetail(id) {
      getInfoById(id).then(res => {
    getDetail(id, type) {
      comboDetailPost(id).then(res => {
        this.param = res
        this.$set(this.param, 'saleDate', [res.startDate, res.endDate])
        if (res.useStartDate && res.useEndDate) {
          this.$set(this.param, 'useDate', [res.useStartDate, res.useEndDate])
        }
        this.$set(this.param, id, type == 'copy' ? null : this.param.id)
      })
    },
  }
@@ -217,7 +251,8 @@
    margin-left: 12px;
  }
}
.img_place{
.img_place {
  display: flex;
  flex-direction: column;
  justify-content: space-between;