mirror of
https://gitlab.com/CIEFWorldwideSdnBhd/shipping-portal.git
synced 2026-08-19 04:24:12 +00:00
fulfilment banner module
This commit is contained in:
jiasheng224
+38
@@ -0,0 +1,38 @@
|
||||
<template>
|
||||
<div class="row bg-white padding-25">
|
||||
<div class="col">
|
||||
<loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
|
||||
<div class="row justify-content-center" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h3>欲知更多详情，请浏览 <a href="https://bit.ly/4a5v34p" target="_blank" class="text-underline">https://bit.ly/4a5v34p</a> 或联系 Whatsapp: <a href="https://wa.me/601136814520" target="_blank" class="text-underline text-success">+6011-36814520</a></h3>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row p-t-15">
|
||||
<div class="col p-r-5">
|
||||
<div class="btn btn-lg block btn m-b-5 no-border bg-master-lighter" data-dismiss="modal">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-lg block btn m-b-5 no-border text-white bg-primary pointer" @click="activateService(10)">Confirm</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import ModalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props: {
|
||||
activateService: {
|
||||
type: Function,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
mixins: [componentHandler, ModalFormHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,78 @@
|
||||
<template>
|
||||
<div class="row bg-white padding-25">
|
||||
<div class="col">
|
||||
<loading-component style="height: 300px; top: 0;" key="1" color="success" v-show="isLoading" ></loading-component>
|
||||
<div class="row justify-content-center" v-show="!isLoading">
|
||||
<div class="col">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h3>Please provide your Whatsapp phone number:</h3>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="row m-t-20 m-b-15">
|
||||
<div class="col-12">
|
||||
<validation-wrapper-component :validator="$v.parameters.name">
|
||||
<label>Name</label>
|
||||
<input class="form-control" v-model="parameters.name">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
<div class="col-12 p-t-15">
|
||||
<validation-wrapper-component :validator="$v.parameters.phone">
|
||||
<label>Phone</label>
|
||||
<input class="form-control" v-model="parameters.phone">
|
||||
</validation-wrapper-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row p-t-15">
|
||||
<div class="col p-r-5">
|
||||
<div class="btn btn-lg block btn m-b-5 no-border bg-master-lighter" data-dismiss="modal">Cancel</div>
|
||||
</div>
|
||||
<div class="col p-l-5">
|
||||
<div class="btn btn-lg block btn m-b-5 no-border text-white bg-primary pointer" @click="activateLater">Confirm</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { required } from 'vuelidate/lib/validators';
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
import modalFormHandler from '../../../general/mixins/modalFormHandler';
|
||||
export default {
|
||||
props: {
|
||||
company:{
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
parameters: {
|
||||
name: '',
|
||||
phone: '',
|
||||
}
|
||||
}
|
||||
},
|
||||
validations: {
|
||||
parameters: {
|
||||
name: { required },
|
||||
phone: { required },
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
activateLater(){
|
||||
this.parameters.segment_id = 11
|
||||
|
||||
this.submit(this.route('api.company.connection.assign', this.company.id, this.company.company_module.connections[0].id), 'post', 'activateService', true, false);
|
||||
},
|
||||
successHandler(){
|
||||
location.reload();
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler, modalFormHandler]
|
||||
|
||||
}
|
||||
</script>
|
||||
+94
@@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div class="row m-t-15 m-b-15 align-items-end parentContainer" v-if="company">
|
||||
<div class="col">
|
||||
<!-- 1688 consent -->
|
||||
<div class="row m-l-0 m-r-0 m-b-15 animate__animated animate__tada animate__repeat-2 animate__delay-3s" v-if="!company.segments.some(item => item.id === 10 || item.id === 11 || item.id === 12)">
|
||||
<div class="col bg-white padding-15">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<div class="row ">
|
||||
<div class="col">
|
||||
<h5 class="m-t-0 text-justify">重磅消息! CIEF 正式开通 <span class="bold">3PL fulfillment 服务</span>!! 你从中国进来的货物, 我们可以直接帮你仓储, 分拣打包, 直接送货到您的顾客手上, 只需系统对接你的 Lazada , Shopee , Tiktok 网店, 就能实现全自动化! 一个月只需 <span class="bold">RMX88</span>! </h5>
|
||||
<h5 class="m-t-0 text-justify">Exciting news! CIEF has officially launched its <span class="bold">3PL fulfillment service</span>! We can assist with warehousing, sorting, packaging, and direct delivery of your goods from China to your customers. Simply integrate your Lazada, Shopee, or TikTok online stores with our system for full automation! Only <span class="bold">RMX88</span> per month!</h5>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">
|
||||
<div class="btn btn-md block btn m-b-5 no-border text-white pointer bg-success requestModal" data-type="fulfilment-interested">Interested now (感兴趣)</div>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<div class="btn btn-md block btn m-b-5 pointer requestModal" data-type="fulfilment-later">Interested later (感兴趣，但现在不需要)</div>
|
||||
</div>
|
||||
<div class="col-12 text-center">
|
||||
<div class="btn btn-md block btn m-b-5 no-border text-white pointer bg-danger" @click="activateService(12)">Not interested (不感兴趣)</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="fulfilment-interested" styleType="fill-in" size="large">
|
||||
<fulfilment-confirmation-form-component
|
||||
class="text-center"
|
||||
section="activateService"
|
||||
:activateService="activateService"
|
||||
>
|
||||
</fulfilment-confirmation-form-component>
|
||||
</modal-component>
|
||||
<modal-component class="animate__animated animate__fast animate__fadeIn" type="fulfilment-later" styleType="fill-in" size="large">
|
||||
<fulfilment-later-form-component
|
||||
section="activateService"
|
||||
:company="company"
|
||||
>
|
||||
</fulfilment-later-form-component>
|
||||
</modal-component>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import componentHandler from '../../../general/mixins/componentHandler';
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
section: 'newServiceList',
|
||||
parameters: {
|
||||
segment_id: ''
|
||||
},
|
||||
expanded: false,
|
||||
failed: false,
|
||||
part: 0,
|
||||
isFetchCompany: false,
|
||||
company: null
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.fetchCompany();
|
||||
},
|
||||
methods: {
|
||||
fetchCompany(){
|
||||
this.parameters = null;
|
||||
this.isFetchCompany = true;
|
||||
this.submit(route('api.company.show', this.$store.getters.getCompanyId), 'get', this.section, false, false)
|
||||
},
|
||||
activateService(segmentId){
|
||||
this.parameters = {
|
||||
segment_id: segmentId
|
||||
};
|
||||
this.part = 1;
|
||||
this.submit(this.route('api.company.connection.assign', this.company.id, this.company.company_module.connections[0].id), 'post', 'activateService', true, false);
|
||||
},
|
||||
successHandler(response){
|
||||
if (this.isFetchCompany) {
|
||||
this.company = response.payload.data;
|
||||
this.isFetchCompany = false;
|
||||
}
|
||||
if(this.part == 1 || this.part == 4){
|
||||
location.reload();
|
||||
}
|
||||
}
|
||||
},
|
||||
mixins: [componentHandler]
|
||||
}
|
||||
</script>
|
||||
@@ -206,8 +206,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-margin d-none" :class="[{'d-flex': !$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)}]" v-if="!$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)">
|
||||
<div class="absolute hint-text dotted-grid" style="width: 80px;height: 80px; right: 27px; bottom: 28px; z-index: 1; opacity: 0.3;"></div>
|
||||
<div class="row no-margin d-none relative" :class="[{'d-flex': !$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)}]" v-if="!$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)">
|
||||
<div class="absolute hint-text dotted-grid" style="width: 80px;height: 80px; right: 0; bottom: 0; z-index: 1; opacity: 0.3;"></div>
|
||||
<div class="absolute hint-text dotted-grid" style="width: 80px;height: 80px; z-index: 1; opacity: 0.3;"></div>
|
||||
<div class="col bg-info text-white padding-25">
|
||||
<div class="row">
|
||||
@@ -223,6 +223,9 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row no-margin d-none" :class="[{'d-flex': !$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)}]" v-if="!$store.getters.isAdmin && ![7,8].includes($store.getters.getCompanyModuleType)">
|
||||
<new-service-announcement-component></new-service-announcement-component>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user