|
|
|
@ -2,10 +2,12 @@ |
|
|
|
<div class="main-content12 "> |
|
|
|
<div class="flex-common"> |
|
|
|
<el-tabs v-model="curAddTab" class=""> |
|
|
|
<el-tab-pane :label="'新增'+item.name" v-for="(item,index) in numsList" :name="item.type" :key="index"></el-tab-pane> |
|
|
|
<el-tab-pane :label="'新增' + item.name" v-for="(item, index) in numsList" :name="item.type" |
|
|
|
:key="index"></el-tab-pane> |
|
|
|
</el-tabs> |
|
|
|
<div class="beforeNotice" v-if="curTabInfo"> |
|
|
|
<p class="noticeTop flex"><img src="@/assets/site/siteSemInfo_Icon.svg" alt=""> {{curTabInfo.name}}使用说明</p> |
|
|
|
<p class="noticeTop flex"><img src="@/assets/site/siteSemInfo_Icon.svg" alt=""> {{ curTabInfo.name }}使用说明 |
|
|
|
</p> |
|
|
|
<div class="noticeBot column"> |
|
|
|
<p>1. {{ curTabInfo.desc1 }}</p> |
|
|
|
<p>2. {{ curTabInfo.desc2 }}</p> |
|
|
|
@ -13,7 +15,8 @@ |
|
|
|
</div> |
|
|
|
<el-form class="baseRule_wrap"> |
|
|
|
<p class="littleTitle mb24 mt24">基础规则</p> |
|
|
|
<GuipRadio v-model="createType" :options="createTypeList" prop="type" label="选择生成方式" @change="domainTypeChange" /> |
|
|
|
<GuipRadio v-model="createType" :options="createTypeList" prop="type" label="选择生成方式" |
|
|
|
@change="domainTypeChange" /> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">卡券数量</label> |
|
|
|
<GuipInput v-model="link" width="488px" unit="张" placeholder="大于0的整数"></GuipInput> |
|
|
|
@ -21,10 +24,13 @@ |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">选择发放途径</label> |
|
|
|
<div v-for="item in walletList" :key="item.type"> |
|
|
|
<div v-if="item.show.includes(curAddTab)" class="wallet-item" :class="walletType == item.type ? 'wallet-item-active' : ''" @click="walletClick(item.type)"> |
|
|
|
<img src="@/assets/site/tem-active.svg" class="tem-active" alt="" v-if="walletType == item.type"> |
|
|
|
<div class="wallet-name">{{item.name}}</div> |
|
|
|
<div class="desc">{{ item.desc1 }}</div> |
|
|
|
<div v-if="item.show.includes(curAddTab)" class="wallet-item" |
|
|
|
:class="walletType == item.type ? 'wallet-item-active' : ''" |
|
|
|
@click="walletClick(item.type)"> |
|
|
|
<img src="@/assets/site/tem-active.svg" class="tem-active" alt="" |
|
|
|
v-if="walletType == item.type"> |
|
|
|
<div class="wallet-name">{{ item.name }}</div> |
|
|
|
<div class="desc">{{ item.desc1 }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -32,14 +38,16 @@ |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">选择公众号</label> |
|
|
|
<GuipSelect :options="[]" v-model="link" placeholder="选择品牌" width="488px"></GuipSelect> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">关键词</label> |
|
|
|
<GuipTextarea v-model="link" width="488px" placeholder="用户获取优惠券在在公众号里回复的词语" height="38px"></GuipTextarea> |
|
|
|
</div> |
|
|
|
<GuipTextarea v-model="link" width="488px" placeholder="用户获取优惠券在在公众号里回复的词语" maxlength="25" |
|
|
|
height="38px"></GuipTextarea> |
|
|
|
</div> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">回复内容</label> |
|
|
|
<GuipTextarea v-model="link" width="488px" placeholder="自动回复用户关键词时，会把这段话回复给用户" height="56px"></GuipTextarea> |
|
|
|
<GuipTextarea v-model="link" width="488px" placeholder="自动回复用户关键词时，会把这段话回复给用户" maxlength="100" |
|
|
|
height="56px"></GuipTextarea> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
@ -51,64 +59,40 @@ |
|
|
|
<div class="wrap"> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">卡券名称</label> |
|
|
|
<GuipInput v-model="link" width="488px"></GuipInput> |
|
|
|
<GuipInput v-model="link" width="488px" maxlength="25"></GuipInput> |
|
|
|
</div> |
|
|
|
<div class="flex gap12 mb24"> |
|
|
|
<span>适用服务类型</span> |
|
|
|
<!-- :options="allData" |
|
|
|
<div class="flex gap12 mb24"> |
|
|
|
<span>适用服务类型</span> |
|
|
|
<!-- :options="allData" |
|
|
|
labelKey="name" |
|
|
|
valueKey="id" --> |
|
|
|
<el-select |
|
|
|
style="width:238px" |
|
|
|
width="238px" |
|
|
|
v-model="firstSelected" |
|
|
|
label="适用服务类型" |
|
|
|
@change="handleFirstChange" |
|
|
|
> |
|
|
|
<div class="fastSearch column"> |
|
|
|
<GuipInput class="mb12" v-model="searchWord" width="206px" height="30px"></GuipInput> |
|
|
|
<div class="flex gap8"> |
|
|
|
<span class="tag-item" v-for="item in fastWords" :key="item.id" @click="checkFastWord(item.name)" |
|
|
|
:class="searchWord == item.name ? 'tag-item-active':''">{{ item.name }}</span> |
|
|
|
<el-select style="width:238px" width="238px" v-model="firstSelected" label="适用服务类型" |
|
|
|
@change="handleFirstChange"> |
|
|
|
<div class="fastSearch column"> |
|
|
|
<GuipInput class="mb12" v-model="searchWord" width="206px" height="30px"></GuipInput> |
|
|
|
<div class="flex gap8"> |
|
|
|
<span class="tag-item" v-for="item in fastWords" :key="item.id" |
|
|
|
@click="checkFastWord(item.name)" |
|
|
|
:class="searchWord == item.name ? 'tag-item-active' : ''">{{ item.name }}</span> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<el-option |
|
|
|
class="flex-between" |
|
|
|
v-for="item in allData" |
|
|
|
:key="item.id" |
|
|
|
:label="item.name" |
|
|
|
:value="item.id"> |
|
|
|
<span style="float: left">{{ item.name }}</span> |
|
|
|
<img v-if="firstSelected == item.id" src="@/assets/site/dropdown_chose_ic.svg" alt=""> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<!-- 二级选择框，只有当有二级数据时才显示 --> |
|
|
|
<el-select |
|
|
|
style="width:238px" |
|
|
|
v-if="showSecondSelect" |
|
|
|
v-model="secondSelected" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
class="flex-between" |
|
|
|
v-for="item in allData" |
|
|
|
:key="item.id" |
|
|
|
:label="item.name" |
|
|
|
:value="item.id"> |
|
|
|
<span style="float: left">{{ item.name }}</span> |
|
|
|
<img v-if="secondSelected == item.id" src="@/assets/site/dropdown_chose_ic.svg" alt=""> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<!-- <el-select |
|
|
|
style="width:238px" |
|
|
|
width="238px" |
|
|
|
v-if="showSecondSelect" |
|
|
|
labelKey="name" |
|
|
|
valueKey="id" |
|
|
|
:options="secondOptions" |
|
|
|
v-model="secondSelected" |
|
|
|
></el-select> --> |
|
|
|
</div> |
|
|
|
<el-option class="flex-between" v-for="item in allData" :key="item.id" :label="item.name" |
|
|
|
:value="item.id"> |
|
|
|
<span style="float: left">{{ item.name }}</span> |
|
|
|
<img v-if="firstSelected == item.id" src="@/assets/site/dropdown_chose_ic.svg" alt=""> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
<!-- 二级选择框，只有当有二级数据时才显示 --> |
|
|
|
<el-select style="width:238px" v-if="showSecondSelect" v-model="secondSelected"> |
|
|
|
<el-option class="flex-between" v-for="item in allData" :key="item.id" :label="item.name" |
|
|
|
:value="item.id"> |
|
|
|
<span style="float: left">{{ item.name }}</span> |
|
|
|
<img v-if="secondSelected == item.id" src="@/assets/site/dropdown_chose_ic.svg" alt=""> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">满减规则</label> |
|
|
|
<div class="flex gap8"> |
|
|
|
@ -119,18 +103,29 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<GuipRadio v-if="curAddTab == 1" v-model="domainType" :options="domainTypes" prop="type" label="可用时间范围" @change="domainTypeChange" /> |
|
|
|
<GuipRadio v-if="curAddTab == 1" v-model="domainType" :options="domainTypes" prop="type" |
|
|
|
label="可用时间范围" @change="domainTypeChange" /> |
|
|
|
<div class="flex coupon_name mb24 gap12"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">{{ curAddTab == 1 ?'每日可用次数' :'可用次数' }}</label> |
|
|
|
<GuipInput v-model="link" unit="次"></GuipInput> |
|
|
|
<label for="" style="width: 90px;text-align: right;">{{ curAddTab == 1 ? '每日可用次数' : '可用次数' |
|
|
|
}}</label> |
|
|
|
<GuipInput v-model="link" unit="次" width="488px"></GuipInput> |
|
|
|
</div> |
|
|
|
<div class="flex coupon_name mb24 gap12" v-if="curAddTab != '2'"> |
|
|
|
<label for="" style="width: 90px;text-align: right;">领取起止时间</label> |
|
|
|
<el-date-picker class="mr-32" v-model="searchDate" type="daterange" range-separator="至" |
|
|
|
start-placeholder="开始日期" end-placeholder="结束日期" style="min-width:210px;flex:1" format="yyyy-MM-dd" value-format="yyyy-MM-dd"> |
|
|
|
<el-date-picker |
|
|
|
style="min-width:210px;flex:1" |
|
|
|
v-model="dateRange" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
:picker-options="pickerOptions" |
|
|
|
start-placeholder="起始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
:default-value="defaultDateRange"> |
|
|
|
</el-date-picker> |
|
|
|
</div> |
|
|
|
<GuipInput v-if="curAddTab != 2" v-model="link" :label="curAddTab == 1 ?'初次使用时间':'使用有效时间'"></GuipInput> |
|
|
|
</div> |
|
|
|
|
|
|
|
<GuipInput v-if="curAddTab != 2" v-model="link" :label="curAddTab == 1 ? '初次使用时间' : '使用有效时间'" unit="天"> |
|
|
|
</GuipInput> |
|
|
|
</div> |
|
|
|
|
|
|
|
</el-form> |
|
|
|
@ -155,63 +150,86 @@ export default { |
|
|
|
GuipRadio, |
|
|
|
}, |
|
|
|
data() { |
|
|
|
const today = new Date(); |
|
|
|
const fixedStartDate = this.formatDate(today); |
|
|
|
|
|
|
|
// 计算默认结束日期（例如：一周后） |
|
|
|
const defaultEndDate = new Date(today); |
|
|
|
defaultEndDate.setDate(today.getDate() + 7); |
|
|
|
|
|
|
|
return { |
|
|
|
fastWords:[ |
|
|
|
// 日期范围值 - 固定起始日期为今天 |
|
|
|
dateRange: [fixedStartDate, ''], |
|
|
|
defaultDateRange: [new Date(), ''], |
|
|
|
pickerOptions: { |
|
|
|
disabledDate: (time) => { |
|
|
|
// 禁用今天之前的日期 |
|
|
|
const today = new Date(); |
|
|
|
today.setHours(0, 0, 0, 0); |
|
|
|
return time.getTime() < today.getTime(); |
|
|
|
}, |
|
|
|
|
|
|
|
}, |
|
|
|
// 固定起始日期（不可修改） |
|
|
|
fixedStartDate: fixedStartDate, |
|
|
|
// 是否显示日期信息 |
|
|
|
fastWords: [ |
|
|
|
|
|
|
|
{ |
|
|
|
name:'不限', |
|
|
|
id:0, |
|
|
|
name: '不限', |
|
|
|
id: 0, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'查重服务', |
|
|
|
id:1, |
|
|
|
name: '查重服务', |
|
|
|
id: 1, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'写作辅助', |
|
|
|
id:2, |
|
|
|
name: '写作辅助', |
|
|
|
id: 2, |
|
|
|
} |
|
|
|
], |
|
|
|
searchDate:[], |
|
|
|
// 标记是否正在修正日期（防止无限循环） |
|
|
|
// 选择器选项配置 |
|
|
|
curAddTab: this.$route.query.type || '1', |
|
|
|
searchWord:'', |
|
|
|
searchWord: '', |
|
|
|
// curTabInfo:null, |
|
|
|
numsList:[ |
|
|
|
numsList: [ |
|
|
|
{ |
|
|
|
name:'满减卡', |
|
|
|
type:'1', |
|
|
|
desc1:'使用规则：领卡用户消费满额立减，永久有效。一张卡券只能使用一次，适用于名下所有站点。', |
|
|
|
desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
name: '满减卡', |
|
|
|
type: '1', |
|
|
|
desc1: '使用规则：领卡用户消费满额立减，永久有效。一张卡券只能使用一次，适用于名下所有站点。', |
|
|
|
desc2: '资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
}, |
|
|
|
|
|
|
|
{ |
|
|
|
name:'现金卡', |
|
|
|
type:'2', |
|
|
|
desc1:'使用规则：领卡用户使用无门槛、永久有效，每订单限用1张', |
|
|
|
desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
name: '现金卡', |
|
|
|
type: '2', |
|
|
|
desc1: '使用规则：领卡用户使用无门槛、永久有效，每订单限用1张', |
|
|
|
desc2: '资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'次数卡', |
|
|
|
type:'3', |
|
|
|
desc1:'使用规则：领卡用户使用无门槛、永久有效，每订单限用1张', |
|
|
|
desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
name: '次数卡', |
|
|
|
type: '3', |
|
|
|
desc1: '使用规则：领卡用户使用无门槛、永久有效，每订单限用1张', |
|
|
|
desc2: '资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'折扣卡', |
|
|
|
type:'4', |
|
|
|
title:'满减卡使用说明', |
|
|
|
desc1:'使用规则：领卡用户付款时按比例打折，每订单限用1张，每张检测卡限用1次。', |
|
|
|
desc2:'资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
name: '折扣卡', |
|
|
|
type: '4', |
|
|
|
title: '满减卡使用说明', |
|
|
|
desc1: '使用规则：领卡用户付款时按比例打折，每订单限用1张，每张检测卡限用1次。', |
|
|
|
desc2: '资金冻结：发卡即冻结面额资金；用户使用或卡券过期，资金解冻。CopyCheck不冻结资金，按单独约定结算。' |
|
|
|
}, |
|
|
|
{ |
|
|
|
name:'时间卡', |
|
|
|
type:'5', |
|
|
|
title:'满减卡使用说明', |
|
|
|
desc1:'使用规则：领卡用户在规定时间范围内，每天有免费次数，用完后当天不可再用，但第二天次数会重置。适用于名下所有站点。', |
|
|
|
desc2:'开放范围：仅开放给图尼丁、CopyCheck、Grammarly、AI智能降重、AI范文、AI论文工具、AI校园写作、AI职业写作下的检测服务类型' |
|
|
|
name: '时间卡', |
|
|
|
type: '5', |
|
|
|
title: '满减卡使用说明', |
|
|
|
desc1: '使用规则：领卡用户在规定时间范围内，每天有免费次数，用完后当天不可再用，但第二天次数会重置。适用于名下所有站点。', |
|
|
|
desc2: '开放范围：仅开放给图尼丁、CopyCheck、Grammarly、AI智能降重、AI范文、AI论文工具、AI校园写作、AI职业写作下的检测服务类型' |
|
|
|
}, |
|
|
|
], |
|
|
|
|
|
|
|
createType:1, |
|
|
|
createType: 1, |
|
|
|
createTypeList: [ |
|
|
|
{ |
|
|
|
value: 1, |
|
|
|
@ -222,7 +240,7 @@ export default { |
|
|
|
label: '单张生成，适用于临时场景，一次仅生成一张券。', |
|
|
|
} |
|
|
|
], |
|
|
|
domainType:1, |
|
|
|
domainType: 1, |
|
|
|
domainTypes: [ |
|
|
|
{ |
|
|
|
value: 1, |
|
|
|
@ -245,67 +263,67 @@ export default { |
|
|
|
label: '一年', |
|
|
|
}, |
|
|
|
], |
|
|
|
walletList:[ |
|
|
|
walletList: [ |
|
|
|
{ |
|
|
|
type: 1, |
|
|
|
name: '卡密自提', |
|
|
|
desc1:'生成链接，用户点击自提', |
|
|
|
show:['3','4','5'] |
|
|
|
desc1: '生成链接，用户点击自提', |
|
|
|
show: ['3', '4', '5'] |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: 2, |
|
|
|
name: '自有渠道发放', |
|
|
|
desc1:'生成卡号，自行发放', |
|
|
|
show:['1','2','3','4','5'] |
|
|
|
desc1: '生成卡号，自行发放', |
|
|
|
show: ['1', '2', '3', '4', '5'] |
|
|
|
}, |
|
|
|
{ |
|
|
|
type: 3, |
|
|
|
name: '公众号发放', |
|
|
|
desc1:'通过公众号回复，自动发放', |
|
|
|
show:['3','4','5'] |
|
|
|
desc1: '通过公众号回复，自动发放', |
|
|
|
show: ['3', '4', '5'] |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
], |
|
|
|
walletType:1, |
|
|
|
link:'', |
|
|
|
walletType: 1, |
|
|
|
link: '', |
|
|
|
allData: [ |
|
|
|
{ |
|
|
|
id: '1', |
|
|
|
name: '餐饮服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '11', name: '中餐厅' }, |
|
|
|
{ id: '12', name: '西餐厅' }, |
|
|
|
{ id: '13', name: '快餐店' } |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '2', |
|
|
|
name: '医疗服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '21', name: '综合医院' }, |
|
|
|
{ id: '22', name: '专科医院' }, |
|
|
|
{ id: '23', name: '诊所' } |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '3', |
|
|
|
name: '教育培训', |
|
|
|
children: [] // 没有二级数据 |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '4', |
|
|
|
name: '金融服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '41', name: '银行' }, |
|
|
|
{ id: '42', name: '证券' }, |
|
|
|
{ id: '43', name: '保险' } |
|
|
|
] |
|
|
|
} |
|
|
|
], |
|
|
|
|
|
|
|
{ |
|
|
|
id: '1', |
|
|
|
name: '餐饮服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '11', name: '中餐厅' }, |
|
|
|
{ id: '12', name: '西餐厅' }, |
|
|
|
{ id: '13', name: '快餐店' } |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '2', |
|
|
|
name: '医疗服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '21', name: '综合医院' }, |
|
|
|
{ id: '22', name: '专科医院' }, |
|
|
|
{ id: '23', name: '诊所' } |
|
|
|
] |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '3', |
|
|
|
name: '教育培训', |
|
|
|
children: [] // 没有二级数据 |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: '4', |
|
|
|
name: '金融服务', |
|
|
|
children: [ |
|
|
|
{ id: '0', name: '不限服务' }, |
|
|
|
{ id: '41', name: '银行' }, |
|
|
|
{ id: '42', name: '证券' }, |
|
|
|
{ id: '43', name: '保险' } |
|
|
|
] |
|
|
|
} |
|
|
|
], |
|
|
|
|
|
|
|
firstSelected: '', // 一级选择值 |
|
|
|
secondSelected: '0', // 二级选择值，默认为"不限服务" |
|
|
|
showSecondSelect: false, // 是否显示二级选择框 |
|
|
|
@ -314,20 +332,26 @@ export default { |
|
|
|
} |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
// this.firstOptions = this.allData.map(item => ({ |
|
|
|
// value: item.id, |
|
|
|
// label: item.name |
|
|
|
// })); |
|
|
|
}, |
|
|
|
created() { |
|
|
|
// 确保初始值正确显示 |
|
|
|
|
|
|
|
}, |
|
|
|
computed: { |
|
|
|
// 计算当前tab的信息 |
|
|
|
curTabInfo() { |
|
|
|
const tab = this.numsList.find(item => item.type == this.curAddTab); |
|
|
|
return tab || this.numsList[0]; // 如果找不到，返回第一个 |
|
|
|
}, |
|
|
|
displayDateRange() { |
|
|
|
if (this.dateRange[1]) { |
|
|
|
return `${this.fixedStartDate} 至 ${this.dateRange[1]}`; |
|
|
|
} |
|
|
|
return this.fixedStartDate; |
|
|
|
} |
|
|
|
}, |
|
|
|
watch: { |
|
|
|
'$route.query.type': function(newVal) { |
|
|
|
'$route.query.type': function (newVal) { |
|
|
|
if (newVal && newVal !== this.curAddTab) { |
|
|
|
this.curAddTab = newVal; |
|
|
|
} |
|
|
|
@ -337,33 +361,59 @@ export default { |
|
|
|
console.log('curAddTab变化:', newVal, '类型:', typeof newVal); |
|
|
|
}, |
|
|
|
immediate: true |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
checkFastWord(name){ |
|
|
|
this.searchWord = name |
|
|
|
// 禁用今天之前的日期 |
|
|
|
disabledDate(time) { |
|
|
|
const today = new Date(); |
|
|
|
today.setHours(0, 0, 0, 0); |
|
|
|
return time.getTime() < today.getTime(); |
|
|
|
}, |
|
|
|
// 格式化日期为 YYYY-MM-DD |
|
|
|
formatDate(date) { |
|
|
|
const year = date.getFullYear(); |
|
|
|
const month = String(date.getMonth() + 1).padStart(2, '0'); |
|
|
|
const day = String(date.getDate()).padStart(2, '0'); |
|
|
|
return `${year}-${month}-${day}`; |
|
|
|
}, |
|
|
|
// 处理日期变化 |
|
|
|
handleDateChange(value) { |
|
|
|
console.log('日期范围变化:', value); |
|
|
|
|
|
|
|
// 确保起始日期始终为固定值 |
|
|
|
if (value && value[0] !== this.fixedStartDate) { |
|
|
|
// 如果用户尝试修改起始日期，强制改回固定值 |
|
|
|
setTimeout(() => { |
|
|
|
this.dateRange = [this.fixedStartDate, value[1] || '']; |
|
|
|
}, 0); |
|
|
|
} |
|
|
|
|
|
|
|
// 更新显示信息 |
|
|
|
this.showDateInfo = true; |
|
|
|
}, |
|
|
|
checkFastWord(item) { |
|
|
|
this.searchWord = item.name; |
|
|
|
this.searchWordId = item.id; |
|
|
|
}, |
|
|
|
handleFirstChange(value) { |
|
|
|
// 根据一级选择的值，找到对应的数据项 |
|
|
|
// 根据一级选择的值，找到对应的数据项 |
|
|
|
const selectedItem = this.allData.find(item => item.id === value); |
|
|
|
|
|
|
|
|
|
|
|
if (selectedItem && selectedItem.children && selectedItem.children.length > 0) { |
|
|
|
// 有二级数据，显示二级选择框 |
|
|
|
this.showSecondSelect = true; |
|
|
|
|
|
|
|
|
|
|
|
// 动态赋值二级选项 |
|
|
|
this.secondOptions = selectedItem.children |
|
|
|
// .map(child => ({ |
|
|
|
// value: child.id, |
|
|
|
// label: child.name |
|
|
|
// })); |
|
|
|
|
|
|
|
this.secondOptions = selectedItem.children; |
|
|
|
|
|
|
|
// 设置默认值为"不限服务" |
|
|
|
const hasUnlimited = selectedItem.children.some(child => child.id === '0'); |
|
|
|
if (hasUnlimited) { |
|
|
|
this.secondSelected = '0'; |
|
|
|
} else if (this.secondOptions.length > 0) { |
|
|
|
// 如果没有"不限服务"选项，默认选择第一个 |
|
|
|
// 如果没有"不限服务"选项，默认选择第一个 |
|
|
|
this.secondSelected = this.secondOptions[0].value; |
|
|
|
} |
|
|
|
} else { |
|
|
|
@ -373,14 +423,6 @@ export default { |
|
|
|
this.secondSelected = ''; |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
handleClickCopy(){ |
|
|
|
this.$copy(this.form.input1, { |
|
|
|
successMsg: '内容已复制到剪贴板', |
|
|
|
errorMsg: '复制失败，请按Ctrl+C手动复制', |
|
|
|
vm: this |
|
|
|
}); |
|
|
|
}, |
|
|
|
validateSelection() { |
|
|
|
this.departType = this.departType.filter(item => item !== 0); |
|
|
|
}, |
|
|
|
@ -405,12 +447,12 @@ export default { |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
|
|
.fastSearch{ |
|
|
|
.fastSearch { |
|
|
|
padding: 12px; |
|
|
|
.tag-item{ |
|
|
|
|
|
|
|
.tag-item { |
|
|
|
border-radius: 32px; |
|
|
|
background: #FFFFFF; |
|
|
|
box-sizing: border-box; |
|
|
|
@ -427,71 +469,80 @@ export default { |
|
|
|
color: #626573; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.tag-item-active{ |
|
|
|
|
|
|
|
.tag-item-active { |
|
|
|
color: #006AFF; |
|
|
|
background: #F6F7FA; |
|
|
|
} |
|
|
|
} |
|
|
|
.wallet-item{ |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
text-align: left; |
|
|
|
padding: 16px 14px; |
|
|
|
width: 282px; |
|
|
|
height: auto; |
|
|
|
|
|
|
|
.wallet-item { |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
text-align: left; |
|
|
|
padding: 16px 14px; |
|
|
|
width: 282px; |
|
|
|
height: auto; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
border-radius: 8px; |
|
|
|
background: rgba(255, 255, 255, 0.47); |
|
|
|
box-sizing: border-box; |
|
|
|
border: 1px solid #DFE2E6; |
|
|
|
|
|
|
|
.desc { |
|
|
|
font-size: 12px; |
|
|
|
color: #626573; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
border-radius: 8px; |
|
|
|
background: rgba(255, 255, 255, 0.47); |
|
|
|
box-sizing: border-box; |
|
|
|
border: 1px solid #DFE2E6; |
|
|
|
.desc{ |
|
|
|
font-size: 12px; |
|
|
|
color: #626573; |
|
|
|
letter-spacing: 0.08em; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-name{ |
|
|
|
.wallet-name { |
|
|
|
color: #1E2226; |
|
|
|
font-size: 14px; |
|
|
|
font-weight: bold; |
|
|
|
margin-bottom: 12px; |
|
|
|
} |
|
|
|
.wallet-num{ |
|
|
|
font-size: 12px; |
|
|
|
color: #626573; |
|
|
|
padding: 0 2px; |
|
|
|
display: flex; |
|
|
|
align-items: baseline; |
|
|
|
} |
|
|
|
.wallet-price{ |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-num { |
|
|
|
font-size: 12px; |
|
|
|
color: #626573; |
|
|
|
padding: 0 2px; |
|
|
|
display: flex; |
|
|
|
align-items: baseline; |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-price { |
|
|
|
font-size: 22px; |
|
|
|
font-weight: bold; |
|
|
|
color: #626573; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-item-active { |
|
|
|
position: relative; |
|
|
|
background: #F2F7FF; |
|
|
|
border-color: #006AFF; |
|
|
|
|
|
|
|
.wallet-item-active{ |
|
|
|
position: relative; |
|
|
|
background: #F2F7FF; |
|
|
|
border-color: #006AFF; |
|
|
|
.tem-active{ |
|
|
|
.tem-active { |
|
|
|
position: absolute; |
|
|
|
right: 0; |
|
|
|
top: 0; |
|
|
|
width: 30px; |
|
|
|
height: 30px; |
|
|
|
} |
|
|
|
.wallet-name{ |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-name { |
|
|
|
color: #006AFF; |
|
|
|
} |
|
|
|
} |
|
|
|
.coupon_name{ |
|
|
|
.el-form-item{ |
|
|
|
} |
|
|
|
|
|
|
|
.coupon_name { |
|
|
|
.el-form-item { |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
} |
|
|
|
.baseRule_wrap{ |
|
|
|
.coupon_name{ |
|
|
|
|
|
|
|
.baseRule_wrap { |
|
|
|
.coupon_name { |
|
|
|
// align-items: flex-start; |
|
|
|
} |
|
|
|
} |
|
|
|
@ -515,8 +566,8 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
.wrap{ |
|
|
|
|
|
|
|
.wrap { |
|
|
|
width: 590px; |
|
|
|
} |
|
|
|
|
|
|
|
</style> |
zq
1 month ago