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

nfc版型修改

Browse Source
dev
Wayne 3 years ago
parent bdcac9a8d8
commit 5ada3bf890
3 changed files with 127 additions and 35 deletions
Show Stats Download Patch File Download Diff File

7
src/api/system.js
Unescape View File

@ -0,0 +1,7 @@
import ajax from "./ajax";
export const getAreaList = async () =>
ajax(`/system/getAreaList`);
export const getWorkList = async () =>
ajax(`/system/getWorkList`);

12
src/views/Home/index.vue
Unescape View File

@ -5,7 +5,6 @@ import { toClipboard } from "@soerenmartius/vue3-clipboard";
import { ref, computed, onBeforeMount } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useStore } from "vuex";
import { useUserStore } from '@/store/user';
import { showToast, showSuccessToast, showConfirmDialog } from "vant";
@ -19,7 +18,6 @@ import noUserImg from '@/assets/images/upload.jpg'
const router = useRouter();
const route = useRoute();
const store = useStore();
const userStore = useUserStore();
@ -112,8 +110,6 @@ onBeforeMount(async () => {
router.push("/login");
}
}
store.dispatch("user/getUserInfo");
await userStore.getUserData();
@ -192,13 +188,13 @@ const userInfo = computed(() => {
});
const nfcurl = computed(() => {
return encodeURI(store.state.user.userInfo.ufcurl);
return encodeURI(userStore.userData.ufcurl);
});
const overdue = computed(() => {
if (store.state.user.userInfo.overdue_time > 0) {
if (userStore.userData.overdue_time > 0) {
return moment
.unix(store.state.user.userInfo.overdue_time)
.unix(userStore.userData.overdue_time)
.format("YYYY-MM-DD");
} else {
return "無期限";
@ -234,7 +230,7 @@ const doCopyUid = () => {
};
const doShare = () => {
toClipboard(`https://liff.line.me/${import.meta.env.VITE_APP_LINE_LIFF_ID}/?aid=${store.state.user.userInfo.agent_prefix}`)
toClipboard(`https://liff.line.me/${import.meta.env.VITE_APP_LINE_LIFF_ID}/?aid=${userInfo.value.user_id}`)
showToast("已放入剪貼簿");
};

143
src/views/Member/index.vue
Unescape View File

@ -7,9 +7,6 @@ import { ref, onBeforeMount, onMounted } from 'vue'
import { Cropper } from 'vue-advanced-cropper';
import 'vue-advanced-cropper/dist/style.css';
// import Footer from '@/components/Footer.vue'
import { useStore } from 'vuex'
import { useUserStore } from '@/store/user'
import { useRouter } from 'vue-router'
@ -19,16 +16,16 @@ import { showToast, showFailToast, showLoadingToast, showSuccessToast } from 'va
import { getUserInfo, updateUserInfo, updateCard, searchConnection, addUserFavi, setUserNfcTpl } from '@/api'
import { updateUserExtra, updateUserLink, updateUserAddon } from '@/api/user';
import { getAreaList, getWorkList } from '@/api/system';
import imgTp1 from '@/assets/images/tp/tp_1.jpg'
import imgTp2 from '@/assets/images/tp/tp_2.jpg'
import imgTp3 from '@/assets/images/tp/tp_3.jpg'
import imgTp4 from '@/assets/images/tp/tp_4.jpg'
import { computed } from 'vue';
const URL = window.URL || window.webkitURL;
const store = useStore()
const userStore = useUserStore()
const router = useRouter()
@ -72,6 +69,7 @@ const validatorTel = (val) => {
// START: 基本資料
const crop = ref({
show: false,
img: null,
@ -85,6 +83,26 @@ onMounted(async () => {
}
//取得區域資料
let areaRes = await getAreaList()
if (areaRes.code === 200) {
areaColumns.value = areaRes.data
//取得區域名稱
if (areaRes.data.length > 0) {
areaName.value = _.find(areaRes.data, { value: form.value.area }).text
}
}
//取得工作性質資料
let workRes = await getWorkList()
if (workRes.code === 200) {
workColumns.value = workRes.data
//取得工作性質名稱
if (workRes.data.length > 0) {
workName.value = _.find(workRes.data, { value: form.value.work }).text
}
}
if (userRes.data.nfc_addon && (userRes.data.nfc_addon.length > 0)) {
form.value.addon = JSON.parse(userRes.data.nfc_addon)
}
@ -174,7 +192,6 @@ const onSubmit = async () => {
let res = await updateCard(form.value)
if (res.code === 200) {
showSuccessToast('更新成功')
store.commit('user/setUserInfo', form.value)
router.push('/member')
} else {
showToast.fail('更新失敗')
@ -187,11 +204,13 @@ const userInfoSubmit = async (values) => {
message: '資料更新中...',
forbidClick: true,
});
console.log("test", values);
values.area = form.value.area
values.work = form.value.work
let res = await updateUserInfo(values)
if (res.code === 200) {
showSuccessToast('更新成功')
store.commit('user/setUserInfo', values)
userStore.getUserData();
router.push('/member')
} else {
showToast.fail('更新失敗')
@ -224,6 +243,28 @@ const userExtraSubmit = async (values) => {
}
};
// 區域
const showAreaPicker = ref(false);
const areaColumns = ref([]);
const areaName = ref('');
const onAreaConfirm = (value) => {
areaName.value = value.selectedOptions[0].text
form.value.area = value.selectedOptions[0].value
showAreaPicker.value = false
}
// 工作性質
const showWorkPicker = ref(false);
const workColumns = ref([]);
const workName = ref('');
const onWorkConfirm = (value) => {
workName.value = value.selectedOptions[0].text
form.value.work = value.selectedOptions[0].value
showAreaPicker.value = false
}
// END: 基本資料
// START: 社群分享
@ -271,6 +312,9 @@ const search = ref({
const tab2result = ref('你所需要的資源');
const tab2showPicker = ref(false);
const loading = ref(false);
const finished = ref(false);
const tab2columns = [
{ text: '你所需要的資源', value: 0 },
{ text: '你能提供的資源', value: 1 },
@ -320,6 +364,7 @@ const tab2ListonLoad = () => {
};
const handleAddFavi = async (uf_user_id) => {
console.log(uf_user_id)
let res = await addUserFavi({ uf_user_id });
if (res.code === 200) {
@ -336,13 +381,46 @@ const handleAddFavi = async (uf_user_id) => {
// END: 人脈資源
const tab3list = ref([]);
onBeforeMount(async () => {
let res = await setUserNfcTpl();
const tab3list = ref([
{
id: 0,
image: imgTp1,
},
{
id: 1,
image: imgTp2,
},
{
id: 2,
image: imgTp3,
},
{
id: 3,
image: imgTp4,
}
]);
const selectedTpl = computed(() => {
if (form.value.nfc_template) {
return tab3list.value[form.value.nfc_template].image
} else {
return tab3list.value[0].image
}
})
const handleSelectTpl = (id) => {
form.value.nfc_template = id
}
const handleChangeTplSubmit = async() => {
let res = await setUserNfcTpl(form.value.nfc_template);
if (res.code === 200) {
tab3list.value = res.data;
showSuccessToast('修改成功')
} else {
showFailToast('修改失敗')
}
});
}
</script>
@ -408,8 +486,16 @@ onBeforeMount(async () => {
</template>
</van-field>
<van-field v-model="form.area" label="區域" name="area" placeholder="請選擇縣市區域" />
<van-field v-model="form.work" label="工作性質" name="work" placeholder="請選擇工作性質" />
<van-field v-model="areaName" is-link readonly name="area" label="區域" placeholder="請選擇區域"
@click="showAreaPicker = true" />
<van-popup v-model:show="showAreaPicker" position="bottom">
<van-picker :columns="areaColumns" @confirm="onAreaConfirm" @cancel="showAreaPicker = false" />
</van-popup>
<van-field v-model="workName" is-link readonly name="work" label="工作性質" placeholder="請選擇工作性質"
@click="showWorkPicker = true" />
<van-popup v-model:show="showWorkPicker" position="bottom">
<van-picker :columns="workColumns" @confirm="onWorkConfirm" @cancel="showWorkPicker = false" />
</van-popup>
<van-field readonly>
<template #label>是否公開<br />資料搜尋</template>
@ -486,7 +572,7 @@ onBeforeMount(async () => {
<van-field v-model="form.line" label="Line" name="line" placeholder="請輸入您的Line ID" />
<van-field v-model="form.facebook" label="Facebook" name="facebook" placeholder="請輸入您的Facebook" />
<van-field v-model="form.ig" label="IG" name="ig" placeholder="請輸入您的IG" />
<van-field v-model="form.youTube" label="YouTube" name="youtube" placeholder="請輸入您的YouTube" />
<van-field v-model="form.youtube" label="YouTube" name="youtube" placeholder="請輸入您的YouTube" />
<van-field v-model="form.wechat" label="WeChat" name="wechat" placeholder="請輸入您的WeChat" />
<van-field v-model="form.tiktok" label="Tiktok" name="tiktok" placeholder="請輸入您的Tiktok" />
@ -602,7 +688,7 @@ onBeforeMount(async () => {
<div class="avatar"><img :src="item.avatar"></div>
<div class="text">
<h5 class="name ellipsis">{{ item.real_name }}</h5>
<div class="desc ellipsis">@{{ item.note }}</div>
<div class="desc ellipsis">@{{ item.introduction }}</div>
</div>
</div>
<div class="right">
@ -610,18 +696,21 @@ onBeforeMount(async () => {
aria-expanded="false" :aria-controls="`c${index}`">
<h5><i class="fa-solid fa-layer-group text-darkBlue"></i></h5>
</van-button>
<van-button size="normal" class="border-0" @click="handleAddFavi(item.user_id)">
<van-button v-if="(item.is_favorite) == 0" size="normal" class="border-0"
@click="handleAddFavi(item.user_id)">
<h5><i class="fa-solid fa-comment-medical text-darkBlue"></i></h5>
</van-button>
</div>
<div class="bottom collapse" :id="`c${index}`" data-parent="#accordion">
<h6 class="text-darkBlue"><strong>我能分享的資源</strong></h6>
<div class="desc">{{ item.supply }}</div>
<div class="url py-2">網址：<a :href="item.supply_link" class="text-moBlue">{{ item.supply_link }}</a></div>
<div class="url py-2">網址：<a :href="item.supply_link" target="_blank" class="text-moBlue">{{ item.supply_link
}}</a></div>
<hr />
<h6 class="text-darkBlue"><strong>我需要的資源</strong></h6>
<div class="desc">{{ item.demand }}</div>
<div class="url py-2">網址：<a :href="item.demand_link" class="text-moBlue">{{ item.demand_link }}</a></div>
<div class="url py-2">網址：<a :href="item.demand_link" target="_blank" class="text-moBlue">{{ item.demand_link
}}</a></div>
</div>
</div>
@ -634,7 +723,7 @@ onBeforeMount(async () => {
<div class="content cnt3" v-show="tabActive === 3">
<van-cell-group inset>
<van-form @submit="onSubmit">
<van-form>
<van-cell class="text-center bg-lightPink py-3">
<template #title>
<h6 class="text-darkBlue"><strong>感應式版型切換</strong></h6>
@ -642,14 +731,14 @@ onBeforeMount(async () => {
</van-cell>
<div class="block">
<van-image width="100%" position="top" fit="cover" :src="imgTp1" />
<van-image width="100%" position="top" fit="cover" :src="selectedTpl" />
</div>
<div class="d-flex justify-content-center py-3">
<van-button class="btn-tomatoRed px-5 mr-2">
預覽
</van-button>
<van-button class="btn-darkBlue px-5" native-type="submit">
<van-button class="btn-darkBlue px-5" @click="handleChangeTplSubmit">
確認修改
</van-button>
</div>
@ -659,9 +748,10 @@ onBeforeMount(async () => {
<van-cell-group inset>
<van-row>
<van-col span="12" v-for="(item, index) in tab3list" :key="index">
<div class="imgBtn" :data-id="index">
<div class="imgBtn" :data-id="index" @click="handleSelectTpl(item.id)">
<div class="imgCnt">
<van-image :src="imgTp1" />
{{ item.image }}
<van-image :src="item.image" />
</div>
</div>
</van-col>
@ -783,5 +873,4 @@ onBeforeMount(async () => {
}
}
}
}
</style>
}</style>
Write Preview
Loading…
Cancel
Save