wayne
/
utel_h5
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改

Browse Source
dev
DESKTOP-8UQ1PPR\09158 3 years ago
parent d3176e17c4
commit 87547750c5
1 changed files with 421 additions and 434 deletions
Show Stats Download Patch File Download Diff File

851
src/views/Card/Edit.vue
Unescape View File

@ -442,411 +442,228 @@ export default defineComponent({
<h6 class="text-darkBlue"><strong>卡片設定</strong></h6> <h6 class="text-darkBlue"><strong>卡片設定</strong></h6>
</template> </template>
<template #value> <template #value>
<van-button size="small" class="ml-1 btn-moBlue" icon="tv-o" hairline>教學影片</van-button> <van-button size="small" class="ml-1 btn-moBlue" icon="tv-o" hairline @click="$router.push('/card/video')">教學影片</van-button>
<van-button size="small" class="ml-1 btn-skyBlue" icon="eye-o" hairline>預覽</van-button> <van-button size="small" class="ml-1 btn-skyBlue" icon="eye-o" hairline @click="handlePreview">預覽</van-button>
</template> </template>
</van-cell> </van-cell>
<div class="form-group mb-2 was-validated"> <div class="card">
<label for="utel-altText">標題文字</label> <div class="card-body">
<input <div class="form-group mb-2 was-validated">
pattern=".+" <label for="utel-altText">標題文字</label>
required="required" <input
id="utel-altText" pattern=".+"
class="form-control form-control-sm" required="required"
v-model="form.title" id="utel-altText"
/> class="form-control form-control-sm"
<small class="form-text text-muted" v-model="form.title"
>與我的名片切換時顯示的文字。</small />
> <small class="form-text text-muted">與我的名片切換時顯示的文字。</small>
</div> </div>
<div class="form-group mb-2 was-validated"> <div class="form-group mb-2 was-validated">
<label for="utel-showNfc">是否顯示於感應名片</label> <label for="utel-showNfc">是否顯示於感應名片</label>
<br /> <br />
<van-switch v-model="form.showNfc" /> <van-switch v-model="form.showNfc" />
<small class="form-text text-muted" <small class="form-text text-muted">與我的名片切換時顯示的文字。</small>
>與我的名片切換時顯示的文字。</small </div>
> </div>
</div> </div>
</van-cell-group> </van-cell-group>
</div> <van-cell-group inset class="mt-3">
<keep-alive>
<van-cell-group inset class="mt-3"> <div id="app">
<keep-alive>
<div id="app" class="container my-4"> <div class="card">
<div class="card-header bg-lightPink">
<div class="card my-2"> <ul class="card-header-tabs nav nav-tabs">
<div class="card-header"> <li
<ul class="card-header-tabs nav nav-tabs"> class="nav-item"
<li class="nav-item" @click="form.page = 'setting'"> v-for="(card, index) in form.json5.cards"
<button :key="index"
type="button" @click="form.page = index + 1"
class="nav-link"
:class="{ active: form.page === 'setting' }"
> >
設定 <button
</button> type="button"
</li> class="nav-link"
<li :class="{ active: form.page === index + 1 }"
class="nav-item" >
v-for="(card, index) in form.json5.cards" {{ index + 1 }}
:key="index" </button>
@click="form.page = index + 1" </li>
> <li
<button class="nav-item"
type="button" @click="addCard"
class="nav-link" v-if="form.json5.cards.length < 10"
:class="{ active: form.page === index + 1 }"
> >
{{ index + 1 }} <button type="button" class="nav-link">
</button> <i class="fa fa-plus-circle"></i> +
</li> </button>
<li </li>
class="nav-item" </ul>
@click="addCard"
v-if="form.json5.cards.length < 10"
>
<button type="button" class="nav-link">
<i class="fa fa-plus-circle"></i> +
</button>
</li>
</ul>
</div>
<!---->
<div class="card-content" v-if="form.page === 'setting'">
<div class="card-body">
</div> </div>
</div> <!---->
<div class="card-content" v-else>
<div class="card-body pb-2 pt-3"> <div class="card-content">
<div class="row"> <div class="card-body pb-2 pt-3">
<div class="col-sm-12" v-if="form.json5.cards.length > 1">
<div class="form-group mb-2 mb-2">
<label>控制卡片</label>
<div class="d-flex btn-group mb-1">
<button
type="button"
class="btn btn-sm btn-outline-info"
@click="moveCard(0, form.page)"
>
<i class="iconfont icon-arrow-o-l"></i> 前移
</button>
<button
type="button"
class="btn btn-sm btn-outline-info"
@click="moveCard(1, form.page)"
>
<i class="iconfont icon-arrow-o-r"></i> 後移
</button>
<button
type="button"
class="btn btn-sm btn-outline-danger"
@click="delCard(form.page)"
>
<i class="iconfont icon-delete"></i> 刪除
</button>
</div>
<small class="form-text text-muted"
>你可以點選前後移按鈕來移動卡片。</small
>
</div>
</div>
<div class="col-sm-12">
<div class="form-group mb-2 was-validated">
<label for="vcard-ratio">圖片長寬比</label>
<input
pattern=".+"
required="required"
id="vcard-ratio"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].ratio"
/>
<small class="form-text text-muted">20:13 1:1 6:8。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-image"> 卡片圖片 </label>
<div>
<van-uploader
:after-read="afterRead"
:max-count="1"
name="cardimage"
@delete="handleDelete"
>
<template
v-if="form.json5.cards[form.page - 1].image.length > 0"
>
<div class="upload-main">
<img
class="upload-img"
:src="form.json5.cards[form.page - 1].image"
alt=""
/>
</div>
</template>
<template v-else>
<div class="upload-main">
<img
class="upload-img"
src="@/assets/images/upload.jpg"
/>
<p>請上傳圖片</p>
</div>
</template>
</van-uploader>
</div>
<small class="form-text text-muted"></small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-link">圖片網址連結</label>
<input
pattern="(https?://|line://|tel:|mailto:)\S+"
id="vcard-link"
inputmode="url"
type="url"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].link"
/>
<small class="form-text text-muted">
連結(需輸入完整網址,http://..,https://...)
</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">卡片底色</label>
<div class="input-group input-group-sm">
<input
pattern="#[0-9a-fA-F]{6}"
required="required"
id="vcard-bgColor"
inputmode="url"
class="form-control"
v-model="form.json5.cards[form.page - 1].bgColor"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="form.json5.cards[form.page - 1].bgColor"
/>
&nbsp;色卡
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-title">卡片標題</label>
<input
pattern=".+"
required="required"
id="vcard-title"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].title"
/>
<small class="form-text text-muted">請填寫卡片標題。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleSize">標題文字大小(最大5xl，最小xxs)</label>
<div class="input-group input-group-sm">
<input
pattern="[0-9a-zA-Z]+"
required="required"
id="vcard-titleSize"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].titleSize"
/>
<div class="input-group-append">
<button
type="button"
data-toggle="dropdown"
class="btn btn-outline-secondary dropdown-toggle"
aria-expanded="false"
>
請選擇文字大小
</button>
<div class="dropdown-menu py-0" style="">
<button type="button" class="dropdown-item" @click="changeSize('titleSize',size)" v-for="(size,index) in sizeArr" :key="index">{{size}}</button>
</div>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">標題文字顏色</label>
<div class="input-group input-group-sm">
<input
pattern="#[0-9a-fA-F]{6}"
required="required"
id="vcard-titleColor"
inputmode="url"
class="form-control"
v-model="form.json5.cards[form.page - 1].titleColor"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="form.json5.cards[form.page - 1].titleColor"
/>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-desc">卡片說明</label>
<textarea
id="vcard-desc"
pattern=".+"
required="required"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].desc"
style="height: 100px"
></textarea>
<small class="form-text text-muted">請填寫卡片說明。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-descSize">說明文字大小(最大5xl，最小xxs)</label>
<div class="input-group input-group-sm">
<input
pattern="[0-9a-zA-Z]+"
required="required"
id="vcard-descSize"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].descSize"
/>
<div class="input-group-append">
<button
type="button"
data-toggle="dropdown"
class="btn btn-outline-secondary dropdown-toggle"
aria-expanded="false"
>
請選擇文字大小
</button>
<div class="dropdown-menu py-0" style="">
<button type="button" class="dropdown-item" @click="changeSize('descSize',size)" v-for="(size,index) in sizeArr" :key="index">{{size}}</button>
</div>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">說明文字顏色</label>
<div class="input-group input-group-sm">
<input
pattern="#[0-9a-fA-F]{6}"
required="required"
id="vcard-titleColor"
inputmode="url"
class="form-control"
v-model="form.json5.cards[form.page - 1].descColor"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="form.json5.cards[form.page - 1].descColor"
/>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
>
</div>
<!-- <div class="form-group mb-2 was-validated">
<label for="vcard-title">卡片連結</label>
<input
pattern=".+"
required="required"
id="vcard-title"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].title"
/>
<small class="form-text text-muted">請填寫卡片標題。</small>
</div> -->
</div>
</div>
</div>
<ul class="list-group list-group-flush">
<li
class="list-group-item pb-2 pt-3"
v-for="(btn, index) in form.json5.cards[form.page - 1].btns"
:key="index"
>
<div class="row"> <div class="row">
<div class="col-sm-12"> <div class="col-sm-12" v-if="form.json5.cards.length > 1">
<div class="form-group mb-2"> <div class="form-group mb-2 mb-2">
<label>控制按鈕 {{ index + 1 }}</label> <label>控制卡片</label>
<div class="d-flex btn-group mb-1"> <div class="d-flex btn-group mb-1">
<button <button
type="button" type="button"
class="btn btn-sm btn-outline-info" class="btn btn-sm btn-outline-info"
@click="moveBtn(0, index)" @click="moveCard(0, form.page)"
v-if="form.json5.cards[form.page - 1].btns.length > 1"
> >
<i class="iconfont icon-arrow-o-u"></i> 上移 <i class="iconfont icon-arrow-o-l"></i> 前移
</button> </button>
<button <button
type="button" type="button"
class="btn btn-sm btn-outline-info" class="btn btn-sm btn-outline-info"
@click="moveBtn(1, index)" @click="moveCard(1, form.page)"
v-if="form.json5.cards[form.page - 1].btns.length > 1"
> >
<i class="iconfont icon-arrow-o-d"></i> 下移 <i class="iconfont icon-arrow-o-r"></i> 後移
</button> </button>
<button <button
type="button" type="button"
class="btn btn-sm btn-outline-danger" class="btn btn-sm btn-outline-danger"
@click="delBtn(index)" @click="delCard(form.page)"
> >
<i class="iconfont icon-delete"></i> 刪除 <i class="iconfont icon-delete"></i> 刪除
</button> </button>
</div> </div>
<small class="form-text text-muted"
>你可以點選前後移按鈕來移動卡片。</small
>
</div> </div>
</div> </div>
<div class="col-sm-12"> <div class="col-sm-12">
<div class="form-group mb-2 was-validated"> <div class="form-group mb-2 was-validated">
<label for="cardbtn-text-0" <label for="vcard-ratio">圖片長寬比</label>
>按鈕 {{ index + 1 }} 文字</label
>
<input <input
pattern=".+" pattern=".+"
required="required" required="required"
id="cardbtn-text-0" id="vcard-ratio"
class="form-control form-control-sm" class="form-control form-control-sm"
v-model="btn.text" v-model="form.json5.cards[form.page - 1].ratio"
/> />
<small class="form-text text-muted">20:13 1:1 6:8。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-image"> 卡片圖片 </label>
<div>
<van-uploader
:after-read="afterRead"
:max-count="1"
name="cardimage"
@delete="handleDelete"
>
<template
v-if="form.json5.cards[form.page - 1].image.length > 0"
>
<div class="upload-main">
<img
class="upload-img"
:src="form.json5.cards[form.page - 1].image"
alt=""
/>
</div>
</template>
<template v-else>
<div class="upload-main">
<img
class="upload-img"
src="@/assets/images/upload.jpg"
/>
<p>請上傳圖片</p>
</div>
</template>
</van-uploader>
</div>
<small class="form-text text-muted"></small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-link">圖片網址連結</label>
<input
pattern="(https?://|line://|tel:|mailto:)\S+"
id="vcard-link"
inputmode="url"
type="url"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].link"
/>
<small class="form-text text-muted">
連結(需輸入完整網址,http://..,https://...)
</small>
</div> </div>
<div class="form-group mb-2 was-validated"> <div class="form-group mb-2 was-validated">
<label for="cardbtn-link-0" <label for="vcard-titleColor">卡片底色</label>
>按鈕 <div class="input-group input-group-sm">
{{ <input
index + 1 pattern="#[0-9a-fA-F]{6}"
}} required="required"
連結(需輸入完整網址,http://..,https://...)</label id="vcard-bgColor"
inputmode="url"
class="form-control"
v-model="form.json5.cards[form.page - 1].bgColor"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="form.json5.cards[form.page - 1].bgColor"
/>
&nbsp;色卡
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
> >
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-title">卡片標題</label>
<input <input
pattern="(https?://|line://|tel:|mailto:)\S+" pattern=".+"
required="required" required="required"
inputmode="url" id="vcard-title"
type="url"
id="cardbtn-link-0"
class="form-control form-control-sm" class="form-control form-control-sm"
v-model="btn.link" v-model="form.json5.cards[form.page - 1].title"
/> />
<small class="form-text text-muted">請填寫卡片標題。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleSize">標題文字大小(最大5xl，最小xxs)</label>
<div class="input-group input-group-sm">
<input
pattern="[0-9a-zA-Z]+"
required="required"
id="vcard-titleSize"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].titleSize"
/>
<div class="input-group-append">
<button
type="button"
data-toggle="dropdown"
class="btn btn-outline-secondary dropdown-toggle"
aria-expanded="false"
>
請選擇文字大小
</button>
<div class="dropdown-menu py-0" style="">
<button type="button" class="dropdown-item" @click="changeSize('titleSize',size)" v-for="(size,index) in sizeArr" :key="index">{{size}}</button>
</div>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div> </div>
<div class="form-group mb-2 was-validated"> <div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">按鈕背景顏色</label> <label for="vcard-titleColor">標題文字顏色</label>
<div class="input-group input-group-sm"> <div class="input-group input-group-sm">
<input <input
pattern="#[0-9a-fA-F]{6}" pattern="#[0-9a-fA-F]{6}"
@ -854,107 +671,277 @@ export default defineComponent({
id="vcard-titleColor" id="vcard-titleColor"
inputmode="url" inputmode="url"
class="form-control" class="form-control"
v-model="btn.color" v-model="form.json5.cards[form.page - 1].titleColor"
/> />
<div class="input-group-append"> <div class="input-group-append">
<input <input
type="color" type="color"
class="form-control form-control-color" class="form-control form-control-color"
v-model="btn.color" v-model="form.json5.cards[form.page - 1].titleColor"
/>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-desc">卡片說明</label>
<textarea
id="vcard-desc"
pattern=".+"
required="required"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].desc"
style="height: 100px"
></textarea>
<small class="form-text text-muted">請填寫卡片說明。</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-descSize">說明文字大小(最大5xl，最小xxs)</label>
<div class="input-group input-group-sm">
<input
pattern="[0-9a-zA-Z]+"
required="required"
id="vcard-descSize"
class="form-control form-control-sm"
v-model="form.json5.cards[form.page - 1].descSize"
/>
<div class="input-group-append">
<button
type="button"
data-toggle="dropdown"
class="btn btn-outline-secondary dropdown-toggle"
aria-expanded="false"
>
請選擇文字大小
</button>
<div class="dropdown-menu py-0" style="">
<button type="button" class="dropdown-item" @click="changeSize('descSize',size)" v-for="(size,index) in sizeArr" :key="index">{{size}}</button>
</div>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">說明文字顏色</label>
<div class="input-group input-group-sm">
<input
pattern="#[0-9a-fA-F]{6}"
required="required"
id="vcard-titleColor"
inputmode="url"
class="form-control"
v-model="form.json5.cards[form.page - 1].descColor"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="form.json5.cards[form.page - 1].descColor"
/> />
</div> </div>
</div> </div>
<!-- <small class="form-text text-muted">請填寫卡片標題文字的顏色。</small> --> <small class="form-text text-muted"
>請填寫卡片標題文字的顏色。</small
>
</div> </div>
<div class="form-group mb-2 was-validated"> <!-- <div class="form-group mb-2 was-validated">
<label for="vcard-btnHeight">按鈕大小</label> <label for="vcard-title">卡片連結</label>
<div class="input-group input-group-sm">
<input <input
pattern="[0-9a-zA-Z]+" pattern=".+"
required="required" required="required"
id="vcard-btnHeight" id="vcard-title"
class="form-control form-control-sm" class="form-control form-control-sm"
v-model="btn.btnHeight" v-model="form.json5.cards[form.page - 1].title"
/> />
<div class="input-group-append"> <small class="form-text text-muted">請填寫卡片標題。</small>
<button </div> -->
type="button" </div>
data-toggle="dropdown" </div>
class="btn btn-outline-secondary dropdown-toggle" </div>
aria-expanded="false" <ul class="list-group list-group-flush">
<li
class="list-group-item pb-2 pt-3"
v-for="(btn, index) in form.json5.cards[form.page - 1].btns"
:key="index"
>
<div class="row">
<div class="col-sm-12">
<div class="form-group mb-2">
<label>控制按鈕 {{ index + 1 }}</label>
<div class="d-flex btn-group mb-1">
<button
type="button"
class="btn btn-sm btn-outline-info"
@click="moveBtn(0, index)"
v-if="form.json5.cards[form.page - 1].btns.length > 1"
>
<i class="iconfont icon-arrow-o-u"></i> 上移
</button>
<button
type="button"
class="btn btn-sm btn-outline-info"
@click="moveBtn(1, index)"
v-if="form.json5.cards[form.page - 1].btns.length > 1"
>
<i class="iconfont icon-arrow-o-d"></i> 下移
</button>
<button
type="button"
class="btn btn-sm btn-outline-danger"
@click="delBtn(index)"
>
<i class="iconfont icon-delete"></i> 刪除
</button>
</div>
</div>
</div>
<div class="col-sm-12">
<div class="form-group mb-2 was-validated">
<label for="cardbtn-text-0"
>按鈕 {{ index + 1 }} 文字</label
> >
請選擇按鈕大小 <input
</button> pattern=".+"
<div class="dropdown-menu py-0" style=""> required="required"
<button type="button" class="dropdown-item" @click="btn.btnHeight='sm'" >sm</button> id="cardbtn-text-0"
<button type="button" class="dropdown-item" @click="btn.btnHeight='md'" >md</button> class="form-control form-control-sm"
v-model="btn.text"
/>
</div>
<div class="form-group mb-2 was-validated">
<label for="cardbtn-link-0"
>按鈕
{{
index + 1
}}
連結(需輸入完整網址,http://..,https://...)</label
>
<input
pattern="(https?://|line://|tel:|mailto:)\S+"
required="required"
inputmode="url"
type="url"
id="cardbtn-link-0"
class="form-control form-control-sm"
v-model="btn.link"
/>
</div>
<div class="form-group mb-2 was-validated">
<label for="vcard-titleColor">按鈕背景顏色</label>
<div class="input-group input-group-sm">
<input
pattern="#[0-9a-fA-F]{6}"
required="required"
id="vcard-titleColor"
inputmode="url"
class="form-control"
v-model="btn.color"
/>
<div class="input-group-append">
<input
type="color"
class="form-control form-control-color"
v-model="btn.color"
/>
</div>
</div> </div>
<!-- <small class="form-text text-muted">請填寫卡片標題文字的顏色。</small> -->
</div> </div>
<div class="form-group mb-2 was-validated">
<label for="vcard-btnHeight">按鈕大小</label>
<div class="input-group input-group-sm">
<input
pattern="[0-9a-zA-Z]+"
required="required"
id="vcard-btnHeight"
class="form-control form-control-sm"
v-model="btn.btnHeight"
/>
<div class="input-group-append">
<button
type="button"
data-toggle="dropdown"
class="btn btn-outline-secondary dropdown-toggle"
aria-expanded="false"
>
請選擇按鈕大小
</button>
<div class="dropdown-menu py-0" style="">
<button type="button" class="dropdown-item" @click="btn.btnHeight='sm'" >sm</button>
<button type="button" class="dropdown-item" @click="btn.btnHeight='md'" >md</button>
</div>
</div>
</div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div> </div>
<small class="form-text text-muted"
>請填寫卡片標題的文字大小。
</small>
</div>
</div>
</div> </div>
</div> </li>
</li> <li class="list-group-item">
<li class="list-group-item"> <button
<button type="button"
type="button" class="btn btn-outline-success"
class="btn btn-outline-success" @click="addBtn(form.page)"
@click="addBtn(form.page)" >
> <i class="fa fa-plus-circle"></i> 新增按鈕
<i class="fa fa-plus-circle"></i> 新增按鈕 </button>
</button> <button
<button type="button"
type="button" class="btn btn-outline-success"
class="btn btn-outline-success" @click="addShareBtn(form.page)"
@click="addShareBtn(form.page)" >
> <i class="fa fa-plus-circle"></i> 新增分享按鈕
<i class="fa fa-plus-circle"></i> 新增分享按鈕 </button>
</button> </li>
</li> </ul>
</ul> </div>
</div>
<div class="p-5">
<van-button block class="btn-darkBlue" @click="handleSubmit">
建立名片
</van-button>
</div> </div>
</div>
<div class="p-5">
<van-button block class="btn-darkBlue" @click="handleSubmit">
建立名片
</van-button>
</div>
<div
id="modal-exportimport"
data-backdrop="static"
data-keyboard="false"
tabindex="-1"
class="fade modal"
>
<div <div
class="align-items-stretch modal-dialog modal-dialog-centered modal-xl" id="modal-exportimport"
data-backdrop="static"
data-keyboard="false"
tabindex="-1"
class="fade modal"
> >
<div class="modal-content"> <div
<div class="d-flex flex-column modal-body"> class="align-items-stretch modal-dialog modal-dialog-centered modal-xl"
<textarea >
class="form-control form-control-sm flex-fill" <div class="modal-content">
></textarea> <div class="d-flex flex-column modal-body">
<small class="form-text text-muted" <textarea
>請複製匯出的資料，或貼上之前的資料並點一下「匯入」按鈕。</small class="form-control form-control-sm flex-fill"
> ></textarea>
</div> <small class="form-text text-muted"
<div class="modal-footer"> >請複製匯出的資料，或貼上之前的資料並點一下「匯入」按鈕。</small
<button type="button" class="btn btn-outline-success"> >
複製 </div>
</button> <div class="modal-footer">
<button type="button" class="btn btn-secondary">關閉</button> <button type="button" class="btn btn-outline-success">
<button type="button" class="btn btn-primary">匯入</button> 複製
</button>
<button type="button" class="btn btn-secondary">關閉</button>
<button type="button" class="btn btn-primary">匯入</button>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </keep-alive>
</keep-alive> </van-cell-group>
</van-cell-group> </div>
</div> </div>

Write Preview
Loading…
Cancel
Save