xiaowang/nailart
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1.0版本

Browse Source
This commit is contained in:
xiaowang 2025-08-18 00:04:55 +08:00
parent fd043bb9f2
commit 6d06a72689
14 changed files with 912 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
na-core/src/main/java/com/nailart/controller/TagInfoController.java
View File

@ -30,13 +30,13 @@ public class TagInfoController {
respVO.setMsg("标签信息不能为空");
return respVO;
}
if (tagInfoService.saveTagInfo(tagDO) == 0) {
if (!tagInfoService.save(tagDO)) {
respVO.setCode(500);
respVO.setMsg("保存标签信息失败");
return respVO;
}
respVO.setCode(200);
respVO.setData(tagInfoService.saveTagInfo(tagDO));
respVO.setData("保存标签信息成功");
return respVO;
}
@ -48,7 +48,7 @@ public class TagInfoController {
respVO.setMsg("标签id不能为空");
return respVO;
}
TagDO tagInfoById = tagInfoService.getTagInfoById(id);
TagDO tagInfoById = tagInfoService.getById(id);
if (tagInfoById == null) {
respVO.setCode(500);
respVO.setMsg("查询标签信息失败");
@ -62,7 +62,7 @@ public class TagInfoController {
}
@PostMapping("/deleteById")
public RespVO deleteTagInfoById(@RequestBody Long id) {
public RespVO deleteTagInfoById(Long id) {
RespVO respVO = new RespVO();
if (id == null) {
@ -70,19 +70,18 @@ public class TagInfoController {
respVO.setMsg("标签id不能为空");
return respVO;
}
TagDO tagInfoById = tagInfoService.getTagInfoById(id);
if (tagInfoById == null) {
boolean i = tagInfoService.removeById(id);
if (!i) {
respVO.setCode(500);
respVO.setMsg("查询标签信息失败");
respVO.setMsg("删除标签信息失败");
return respVO;
}
respVO.setCode(200);
respVO.setData(tagInfoById);
respVO.setData("删除标签信息成功");
return respVO;
}
@PostMapping("/updateById")
public RespVO updateTagInfoById(@RequestBody TagDO tagDO) {
RespVO respVO = new RespVO();
@ -91,14 +90,14 @@ public class TagInfoController {
respVO.setMsg("标签信息不能为空");
return respVO;
}
TagDO tagInfoById = tagInfoService.getTagInfoById(tagDO.getId());
if (tagInfoById == null) {
Boolean i = tagInfoService.updateById(tagDO);
if (!i) {
respVO.setCode(500);
respVO.setMsg("查询标签信息失败");
respVO.setMsg("更新标签信息失败");
return respVO;
}
respVO.setCode(200);
respVO.setData(tagInfoById);
respVO.setData("更新标签信息成功");
return respVO;
}
@ -106,7 +105,7 @@ public class TagInfoController {
@GetMapping("/getAll")
public RespVO getAllTagInfo() {
RespVO respVO = new RespVO();
List<TagDO> allTagInfo = tagInfoService.getAllTagInfo();
List<TagDO> allTagInfo = tagInfoService.list();
if (allTagInfo == null || allTagInfo.isEmpty()) {
respVO.setCode(500);
respVO.setMsg("获取标签信息失败");

1
na-core/src/main/java/com/nailart/dataobj/MainInfoDO.java
View File

@ -30,7 +30,6 @@ public class MainInfoDO {
private String introduce;
/**
* 状态
*
*/
private Integer status;
/**

39
na-core/src/main/java/com/nailart/service/TagInfoService.java
View File

@ -13,43 +13,4 @@ import java.util.List;
* @Created by 21616
*/
public interface TagInfoService extends IService<TagDO> {
/**
* 保存标签信息
*
* @param tagDO 标签信息
* @return 是否成功
*/
public Integer saveTagInfo(TagDO tagDO);
/**
* 根据id查询标签信息
*
* @param id 标签id
* @return 标签信息
*/
public TagDO getTagInfoById(Long id);
/**
* 根据id删除标签信息
*
* @param id 标签id
* @return 是否成功
*/
public Integer deleteTagInfoById(Long id);
/**
* 根据id更新标签信息
*
* @param tagDO 标签信息
* @return 是否成功
*/
public Integer updateTagInfoById(TagDO tagDO);
/**
* 查询所有标签信息
*
* @return 标签信息列表
*/
public List<TagDO> getAllTagInfo();
}

41
na-core/src/main/java/com/nailart/service/impl/TagInfoServiceImpl.java
View File

@ -16,45 +16,4 @@ import java.util.List;
*/
@Service
public class TagInfoServiceImpl extends ServiceImpl<TagInfoMapper, TagDO> implements TagInfoService {
@Override
public Integer saveTagInfo(TagDO tagDO) {
if (tagDO == null) {
return 0;
}
try {
return this.saveTagInfo(tagDO);
} catch (Exception e) {
return 0;
}
}
@Override
public TagDO getTagInfoById(Long id) {
if (id == null) {
return null;
}
return this.getTagInfoById(id);
}
@Override
public Integer deleteTagInfoById(Long id) {
if (id == null) {
return 0;
}
return this.deleteTagInfoById(id);
}
@Override
public Integer updateTagInfoById(TagDO tagDO) {
if (tagDO == null) {
return 0;
}
return this.updateTagInfoById(tagDO);
}
@Override
public List<TagDO> getAllTagInfo() {
return this.list();
}
}

11
na-frontend/src/components/ManTabBar.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="tab-bar">
<van-tabbar v-model="active" route :placeholder="true">
<van-tabbar v-model="active" route :placeholder="false">
<van-tabbar-item replace to="/yumi">
<span>主页管理</span>
<template #icon="props">
@ -15,7 +15,7 @@
<template #icon="props">
<img :src="props.active ? icon.active : icon.inactive" />
</template></van-tabbar-item>
<van-tabbar-item replace to="/tagManPage" icon="setting-o"><span>标签管理</span>
<van-tabbar-item replace to="/tagManPage" icon="setting-o"><span>标签管理</span>
<template #icon="props">
<img :src="props.active ? icon.active : icon.inactive" />
</template></van-tabbar-item>
@ -44,4 +44,9 @@ export default {
mounted() { }
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.tab-bar {
max-width: 800px;
margin: 0 auto;
}
</style>

16
na-frontend/src/components/NavBar.vue
View File

@ -1,7 +1,11 @@
<template>
<div class="nav-bar">
<van-nav-bar title="屿 ● Nail" left-text="" :placeholder="true" :safe-area-inset-top="true" z-index="50" :fixed="true">
<van-nav-bar
title="屿 ● Nail"
left-text=""
z-index="50"
:placeholder="true"
:fixed="true">
</van-nav-bar>
</div>
</template>
@ -23,4 +27,10 @@ export default {
mounted() { }
};
</script>
<style lang="scss" scoped></style>
<style lang="less" scoped>
.nav-bar {
max-width: 800px;
margin: 0 auto;
}
</style>

7
na-frontend/src/components/TabBar.vue
View File

@ -40,4 +40,9 @@ export default {
mounted() { }
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.tab-bar {
max-width: 800px;
margin: 0 auto;
}
</style>

1
na-frontend/src/main.js
View File

@ -73,6 +73,7 @@ Vue.config.productionTip = false;
// 全局挂载 axios
Vue.prototype.$axios = axios
Vue.prototype.$dialog = Dialog;
new Vue({
router,
render: (h) => h(App),

395
na-frontend/src/pages/HomePage.vue
View File

@ -3,20 +3,80 @@
<!-- 固定顶部导航栏 -->
<NavBar class="nav-bar" />
<div class="images">
<h1>轮播图区域</h1>
<van-swipe class="swipe" :autoplay="2000" indicator-color="white">
<van-swipe-item v-for="(image, index) in info.headImgs" :key="index">
<img fill="contain" v-lazy="image.url" />
</van-swipe-item>
</van-swipe>
</div>
<div class="info">
<h1>信息展示区，包含店名，营业时间，状态，地址，电话图标，微信图标</h1>
<div class="title">
<div class="name">{{ info.name }}</div>
<div class="environment" @click="showEnvironmentPopup = true">
<span>查看店内环境</span>
</div>
</div>
<van-divider />
<div class="worktime">
<div>{{ info.status }} {{ info.worktime }}</div>
</div>
<van-divider />
<div class="location">
<div class="left">
<span style="color: black; font-size: 15px;">{{ info.location }}</span>
<br>
<van-icon name="location-o" size="12" />
<span>距您驾车或者打车8.0公里 需10分钟</span>
<br>
<van-icon name="guide-o" size="12" />
<span>距离1号线微电园站1号口步行400米 需8分钟</span>
</div>
<div class="right">
<van-icon name="wechat" size="25" @click="clickWechatAndPhone('wechat')" />
<van-icon name="phone" size="25" @click="clickWechatAndPhone('phone')" />
</div>
</div>
</div>
<van-divider>新品展示</van-divider>
<div class="new">
<h1>新品展示</h1>
</div>
<div class="navigation">
<h1>暂定导航组件</h1>
<van-swipe class="swipe" :autoplay="2000" indicator-color="white">
<van-swipe-item v-for="(image, index) in info.newPortfolioImgs" :key="index">
<img fill="contain" v-lazy="image.url" />
</van-swipe-item>
</van-swipe>
</div>
<van-popup v-model="showEnvironmentPopup" position="bottom" closeable style="height: 50vh;">
<div class="environment-images">
<van-swipe class="swipe" :autoplay="2000" indicator-color="white">
<van-swipe-item v-for="(image, index) in info.environmentImgs" :key="index">
<img fill="contain" v-lazy="image.url" />
</van-swipe-item>
</van-swipe>
</div>
</van-popup>
<van-overlay :show="showpublicityImg" @click="show = false">
<div class="wrapper" @click.stop>
<div class="block">
<img v-lazy="info.publicityImg.length > 0 ? info.publicityImg[0].url : ''" />
<div class="coress">
<van-icon name="add" @click="showpublicityImg = false" size="24" style="transform: rotate(45deg)"
color="white" />
</div>
</div>
</div>
</van-overlay>
<div style="height: 200px;"></div>
<!-- 固定底部TabBar -->
<TabBar class="tab-bar" />
</div>
</template>
<script>
@ -31,39 +91,350 @@ export default {
props: {},
data() {
return {
info: {
id: 1,
headImgs: [],
guide: '距离1号线微电园站1号口步行400米 需8分钟',
wechat: '',
phone: '',
newPortfolioImgs: [],
locationImgs: [],
environmentImgs: [
],
publicityImg: [],
status: ""
},
storageUrl: 'http://xiaowangnas.com:9000/yumiartnail',
showEnvironmentPopup: false,
showpublicityImg: false,
};
},
watch: {},
computed: {},
methods: {},
created() { },
mounted() { }
methods: {
async getInfo() {
const res = await this.$axios.get('/mainInfo/getMainInfo');
if (res.code == 200) {
this.id = res.data.id;
this.info.headImgs = this.convertToObjectArray(res.data.headImg.split('&&'));
this.info.name = res.data.name;
this.info.status = res.data.status == 0 ? '休息中' : '营业中';
this.info.worktime = res.data.worktime;
this.info.location = res.data.address;
this.info.wechat = res.data.wechat;
this.info.phone = res.data.phone;
this.info.locationImgs = this.convertToObjectArray(res.data.locationImg.split('&&'));
this.info.newPortfolioImgs = this.convertToObjectArray(res.data.newPortfolioImg.split('&&'));
this.info.environmentImgs = this.convertToObjectArray(res.data.environmentImg.split('&&'));
this.info.publicityImg = [{ url: this.storageUrl + res.data.publicityImg }];
}
if (this.info.publicityImg.length > 0) {
this.showpublicityImg = true;
} else {
this.showpublicityImg = false;
}
console.log(this.info);
},
convertToObjectArray(urls) {
return urls.map(url => {
if (!url) return { url: '' }; // 处理空字符串
const modifiedUrl = this.storageUrl + url;
return { url: modifiedUrl }
});
},
convertUrlsToString(arr) {
return arr.map(item => {
let modifiedUrl = item.url.replace(this.storageUrl, '');
return modifiedUrl;
}).join('&&');
},
clickWechatAndPhone(type) {
this.$dialog.confirm({
title: type == 'wechat' ? '微信号' : '电话号码',
message: type == 'wechat' ? this.info.wechat : this.info.phone,
confirmButtonText: '一键复制',
})
.then(() => {
this.textToCopy = type == 'wechat' ? this.info.wechat : this.info.phone;
this.handleCopy();
})
.catch(() => {
// on cancel
});
},
async handleCopy() {
try {
// 首先检查是否支持navigator.clipboard
if (navigator.clipboard) {
// 请求剪贴板写入权限（适用于需要权限的浏览器）
if ('permissions' in navigator) {
const permissionStatus = await navigator.permissions.query({ name: 'clipboard-write' });
if (permissionStatus.state === 'granted' || (permissionStatus.state === 'prompt' && await permissionStatus.request() === 'granted')) {
await navigator.clipboard.writeText(this.textToCopy);
this.$toast.success('已复制到剪贴板');
} else {
console.error('未获得剪贴板写入权限');
this.$toast.fail('未获得剪贴板写入权限，请手动复制');
}
} else {
// 如果不需要权限请求，直接复制
await navigator.clipboard.writeText(this.textToCopy);
this.$toast.success('已复制到剪贴板');
}
} else {
// 如果不支持navigator.clipboard，尝试使用document.execCommand（旧方法，兼容性更好但有局限性）
const textArea = document.createElement('textarea');
textArea.value = this.textToCopy;
document.body.appendChild(textArea);
textArea.select();
try {
document.execCommand('copy');
this.$toast.success('已复制到剪贴板');
} catch (err) {
console.error('复制失败:', err);
this.$toast.fail('复制失败，请手动复制');
}
document.body.removeChild(textArea);
}
} catch (err) {
console.error('复制失败:', err);
this.$toast.fail('复制失败，请手动复制');
}
},
// 记录当前时间到localStorage
recordCurrentTime(storageKey = 'recordedTime') {
// 获取当前时间的时间戳（毫秒）
const currentTime = new Date().getTime();
// 存储到localStorage
localStorage.setItem(storageKey, currentTime.toString());
return currentTime;
},
// 从localStorage获取记录的时间并计算与当前时间的差值（秒）
getTimeDifference(storageKey = 'recordedTime') {
// 从localStorage获取记录的时间
const storedTimeStr = localStorage.getItem(storageKey);
// 检查是否存在记录
if (!storedTimeStr) {
console.error('没有找到记录的时间');
return null;
}
// 转换为数字类型
const storedTime = parseInt(storedTimeStr, 10);
// 检查转换是否成功
if (isNaN(storedTime)) {
console.error('存储的时间格式不正确');
return null;
}
// 获取当前时间戳
const currentTime = new Date().getTime();
// 计算差值（毫秒）并转换为秒
const differenceInSeconds = Math.floor((currentTime - storedTime) / 1000);
return differenceInSeconds;
}
},
created() {
// 检查是否有记录的时间
const recordedTime = localStorage.getItem('recordedTime');
if (recordedTime) {
// 如果有记录的时间，计算与当前时间的差值
const timeDifference = this.getTimeDifference();
console.log(`与上次记录的时间差为 ${timeDifference} 秒`);
if (timeDifference >= 60 * 60 * 24) {
// 超过24小时，执行相应操作
this.recordCurrentTime();
this.showpublicityImg = true;
} else {
// 在24小时内，执行相应操作
console.log('在24小时内');
this.showpublicityImg = false;
}
} else {
console.log('没有找到记录的时间');
}
},
mounted() {
this.getInfo();
},
beforeDestroy() {
// 在组件销毁前，可以清理一些资源或状态
this.showEnvironmentPopup = false;
this.showpublicityImg = false;
this.recordCurrentTime();
}
};
</script>
<style lang="less" scoped>
@base-bg: #f9fafb;
@card-bg: white;
@text-primary: #1f2937;
@text-secondary: #6b7280;
@accent-color: #3b82f6;
@accent-dark: #2563eb;
@danger-color: #ef4444;
@gray-light: #d1d5db;
@shadow-base: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
@shadow-active: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
.homepage {
width: 100vw;
height: 100vh;
overflow: auto;
max-width: 800px;
margin: 0 auto;
.images {
width: 100%;
height: 25vh;
height: 35vh;
overflow: hidden;
min-height: 200px;
max-height: 500px;
.swipe {
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
}
}
}
.info {
width: 100%;
height: 20vh;
padding: 10px;
.title {
display: flex;
justify-content: space-between;
align-items: center;
.name {
font-size: 40px;
color: @text-primary;
font-weight: bold;
cursor: pointer;
}
.environment {
cursor: pointer;
span {
font-size: 12px;
color: #525050;
}
}
}
.location {
display: flex;
.left {
width: 70%;
span {
font-size: 12px;
color: #a19e9e;
margin-bottom: 10px;
}
}
.right {
width: 30%;
display: flex;
justify-content: space-evenly;
align-items: center;
color: #a19e9e;
}
}
}
.new {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
width: 95%;
height: 25vh;
overflow: hidden;
min-height: 200px;
max-height: 500px;
margin: auto;
border-radius: 10px;
.swipe {
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
}
}
}
.navigation {
width: 100%;
}
.environment-images {
width: 100%;
overflow: hidden;
max-height: 500px;
.swipe {
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
}
}
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
position: relative;
width: 100%;
.block {
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
img {
width: 100%;
object-fit: contain;
border-radius: 10px;
}
.coress {
padding-top: 20px;
}
}
}
}
</style>

6
na-frontend/src/pages/PortfolioPage.vue
View File

@ -146,6 +146,10 @@ export default {
for (let tagID of item.tagId.split("&&")) {
tagInfo.push(this.idToObjectMap[tagID])
}
console.log(">>>>");
console.log(tagInfo);
return {
id: item.id,
title: item.title,
@ -346,7 +350,7 @@ export default {
// 卡片容器（滚动区域）
.cards-container {
padding: 0 5px;
padding: 10px;
overflow: auto;
// 卡片网格布局

270
na-frontend/src/pages/man/HomeManPage.vue
View File

@ -11,8 +11,11 @@
</div>
<div class="info">
<div class="title" @click="showpop">
<div>{{ info.name }}</div>
<div class="title">
<div class="name" @click="showpop">{{ info.name }}</div>
<div class="environment" @click="showEnvironmentPopup = true">
<span>查看店内环境</span>
</div>
</div>
<van-divider />
<div class="worktime">
@ -30,9 +33,8 @@
<span>距离1号线微电园站1号口步行400米 需8分钟</span>
</div>
<div class="right">
<van-icon name="wechat" size="25" />
<van-icon name="phone" size="25" />
<van-icon name="wechat" size="25" @click="clickWechatAndPhone('wechat')" />
<van-icon name="phone" size="25" @click="clickWechatAndPhone('phone')" />
</div>
</div>
</div>
@ -46,7 +48,11 @@
</div>
<van-popup position="bottom" v-model="show" style="height: 80%;" closeable :close-on-click-overlay="false">
<div style="height: 200px;"></div>
<van-popup position="bottom" v-model="show" closeable :close-on-click-overlay="false">
<van-form @submit="saveChangeInfo">
<van-field name="headImgs" label="主页店图">
<template #input>
@ -57,7 +63,8 @@
:rules="[{ required: true, message: '请填写店名' }]" />
<van-field v-model="info.worktime" name="worktime" label="营业信息" placeholder="营业信息"
:rules="[{ required: true, message: '请填写营业信息' }]" />
<van-field readonly clickable label="营业状态" :value="info.status" placeholder="选择营业状态" @click="showPicker = true" />
<van-field readonly clickable label="营业状态" :value="info.status" placeholder="选择营业状态"
@click="showPicker = true" />
<van-popup v-model="showPicker" round position="bottom">
<van-picker show-toolbar :columns="columns" @cancel="showPicker = false" @confirm="onPicker" />
</van-popup>
@ -83,12 +90,38 @@
<van-uploader v-model="info.environmentImgs" :after-read="uploadEnvironmentImgs" />
</template>
</van-field>
<van-field name="publicityImg" label="广告图">
<template #input>
<van-uploader v-model="info.publicityImg" :after-read="uploadPublicityImg" :max-count="1" />
</template>
</van-field>
<div style="margin: 16px;">
<van-button round block type="info" native-type="submit">提交</van-button>
</div>
</van-form>
</van-popup>
<van-popup v-model="showEnvironmentPopup" position="bottom" closeable style="height: 50vh;">
<div class="environment-images">
<van-swipe class="swipe" :autoplay="2000" indicator-color="white">
<van-swipe-item v-for="(image, index) in info.environmentImgs" :key="index">
<img fill="contain" v-lazy="image.url" />
</van-swipe-item>
</van-swipe>
</div>
</van-popup>
<van-overlay :show="showpublicityImg" @click="show = false">
<div class="wrapper" @click.stop>
<div class="block">
<img v-lazy="info.publicityImg.length > 0 ? info.publicityImg[0].url : ''" />
<div class="coress">
<van-icon name="add" @click="showpublicityImg = false" size="24" style="transform: rotate(45deg)"
color="white" />
</div>
</div>
</div>
</van-overlay>
<!-- 固定底部TabBar -->
@ -120,7 +153,7 @@ export default {
environmentImgs: [
],
publicityImg: '',
publicityImg: [],
status: ""
},
storageUrl: 'http://xiaowangnas.com:9000/yumiartnail',
@ -139,6 +172,9 @@ export default {
},
showPicker: false,
columns: ['营业中', '休息中'],
showEnvironmentPopup: false,
showpublicityImg: true,
textToCopy: '', // 要复制的文本
};
},
watch: {},
@ -146,7 +182,6 @@ export default {
methods: {
async getInfo() {
const res = await this.$axios.get('/mainInfo/getMainInfo');
console.log(res);
if (res.code == 200) {
this.id = res.data.id;
this.info.headImgs = this.convertToObjectArray(res.data.headImg.split('&&'));
@ -159,7 +194,15 @@ export default {
this.info.locationImgs = this.convertToObjectArray(res.data.locationImg.split('&&'));
this.info.newPortfolioImgs = this.convertToObjectArray(res.data.newPortfolioImg.split('&&'));
this.info.environmentImgs = this.convertToObjectArray(res.data.environmentImg.split('&&'));
this.info.publicityImg = [{ url: this.storageUrl + res.data.publicityImg }];
}
if (this.info.publicityImg.length > 0) {
this.showpublicityImg = true;
} else {
this.showpublicityImg = false;
}
console.log(this.info);
},
async saveChangeInfo() {
this.show = false;
@ -173,6 +216,8 @@ export default {
this.saveInfo.locationImg = this.convertUrlsToString(this.info.locationImgs);
this.saveInfo.newPortfolioImg = this.convertUrlsToString(this.info.newPortfolioImgs);
this.saveInfo.environmentImg = this.convertUrlsToString(this.info.environmentImgs);
this.saveInfo.publicityImg = this.info.publicityImg.length > 0 ? this.info.publicityImg[0].url.replace(this.storageUrl, '') : '';
this.saveInfo.status = this.info.status == '营业中' ? 0 : 1;
console.log(this.saveInfo);
const res = await this.$axios.post('/mainInfo/updateMainInfo', this.saveInfo);
console.log(res);
@ -197,6 +242,9 @@ export default {
uploadEnvironmentImgs(file) {
this.uploadImgs(file, 'environmentImgs')
},
uploadPublicityImg(file) {
this.uploadImgs(file, 'publicityImg')
},
//上传文件
async uploadImgs(file, type) {
try {
@ -225,9 +273,14 @@ export default {
this.info.environmentImgs.pop();
this.info.environmentImgs.push({ url: result });
break;
case 'publicityImg':
this.info.publicityImg.pop();
this.info.publicityImg.push({ url: result });
break;
default:
break;
}
this.$toast.success('上传成功');
} catch (error) {
// this.uploadResult = `上传失败: ${error.message}`;
this.$toast.fail('上传失败');
@ -238,6 +291,7 @@ export default {
},
convertToObjectArray(urls) {
return urls.map(url => {
if (!url) return { url: '' }; // 处理空字符串
const modifiedUrl = this.storageUrl + url;
return { url: modifiedUrl }
});
@ -249,9 +303,128 @@ export default {
}).join('&&');
},
onPicker(value) {
this.info.status = value=='营业中'?1:0;
this.info.status = value == '营业中' ? 1 : 0;
this.showPicker = false;
},
clickWechatAndPhone(type) {
this.$dialog.confirm({
title: type == 'wechat' ? '微信号' : '电话号码',
message: type == 'wechat' ? this.info.wechat + '\n（点击一键复制后,可自动复制并跳转微信）' : this.info.phone,
confirmButtonText: '一键复制',
})
.then(() => {
this.textToCopy = type == 'wechat' ? this.info.wechat : this.info.phone;
this.handleCopy(type);
})
.catch(() => {
// on cancel
});
},
async handleCopy(type) {
try {
// 首先检查是否支持navigator.clipboard
if (navigator.clipboard) {
// 请求剪贴板写入权限（适用于需要权限的浏览器）
if ('permissions' in navigator) {
const permissionStatus = await navigator.permissions.query({ name: 'clipboard-write' });
if (permissionStatus.state === 'granted' || (permissionStatus.state === 'prompt' && await permissionStatus.request() === 'granted')) {
await navigator.clipboard.writeText(this.textToCopy);
this.$toast.success('已复制到剪贴板');
} else {
console.error('未获得剪贴板写入权限');
this.$toast.fail('未获得剪贴板写入权限，请手动复制');
}
} else {
// 如果不需要权限请求，直接复制
await navigator.clipboard.writeText(this.textToCopy);
this.$toast.success('已复制到剪贴板');
}
} else {
// 如果不支持navigator.clipboard，尝试使用document.execCommand（旧方法，兼容性更好但有局限性）
const textArea = document.createElement('textarea');
textArea.value = this.textToCopy;
document.body.appendChild(textArea);
textArea.select();
try {
document.execCommand('copy');
this.$toast.success('已复制到剪贴板');
} catch (err) {
console.error('复制失败:', err);
this.$toast.fail('复制失败，请手动复制');
}
document.body.removeChild(textArea);
}
this.handleSpecialAction(type)
} catch (err) {
console.error('复制失败:', err);
this.$toast.fail('复制失败，请手动复制');
}
},
handleSpecialAction(type) {
// 检查是否是微信环境
const isWechatEnv = /MicroMessenger/i.test(navigator.userAgent);
if (type === 'wechat') {
// 微信跳转处理
if (isWechatEnv) {
this.$toast.fail('请在微信外部浏览器中打开以跳转微信');
return;
}
try {
// 尝试打开微信
const wechatLink = 'weixin://';
const startTime = Date.now();
// 创建隐藏的iframe尝试打开协议，解决部分浏览器直接跳转失败问题
const iframe = document.createElement('iframe');
iframe.style.display = 'none';
iframe.src = wechatLink;
document.body.appendChild(iframe);
// 检查是否成功打开
setTimeout(() => {
document.body.removeChild(iframe);
if (Date.now() - startTime < 1000) {
this.$toast.fail('未检测到微信客户端，请手动打开微信');
} else {
this.$toast.info('正在打开微信...');
}
}, 800);
} catch (error) {
this.$toast.fail('打开微信失败，请手动操作');
console.error('微信跳转错误:', error);
}
} else if (type === 'phone') {
// 电话号码处理
if (!this.info?.phone) {
this.$toast.fail('电话号码不存在');
return;
}
// 标准化电话号码格式
const phoneNumber = this.info.phone.replace(/\s/g, '');
if (!/^\d{11}$/.test(phoneNumber)) {
this.$toast.fail('请检查电话号码格式');
return;
}
try {
// 检查是否在支持电话功能的环境
if (/Android|iPhone/i.test(navigator.userAgent)) {
// 移动设备直接调用拨号
window.location.href = `tel:${phoneNumber}`;
this.$toast.info(`正在拨打 ${phoneNumber}...`);
} else {
// 桌面设备提示
this.$toast.info(`电话号码: ${phoneNumber}\n请在手机上使用此功能`);
}
} catch (error) {
this.$toast.fail('拨打电话失败，请手动拨号');
console.error('拨打电话错误:', error);
}
}
}
},
created() { },
mounted() {
@ -276,10 +449,11 @@ export default {
width: 100vw;
height: 100vh;
overflow: auto;
max-width: 800px;
margin: 0 auto;
.images {
width: 100%;
height: 25vh;
height: 35vh;
overflow: hidden;
min-height: 200px;
max-height: 500px;
@ -297,7 +471,30 @@ export default {
.info {
width: 100%;
padding: 20px;
padding: 10px;
.title {
display: flex;
justify-content: space-between;
align-items: center;
.name {
font-size: 40px;
color: @text-primary;
font-weight: bold;
cursor: pointer;
}
.environment {
cursor: pointer;
span {
font-size: 12px;
color: #525050;
}
}
}
.location {
display: flex;
@ -330,12 +527,13 @@ export default {
align-items: center;
justify-content: center;
overflow: hidden;
width: 90%;
width: 95%;
height: 25vh;
overflow: hidden;
min-height: 200px;
max-height: 500px;
margin: auto;
border-radius: 10px;
.swipe {
width: 100%;
@ -353,6 +551,50 @@ export default {
width: 100%;
}
.environment-images {
width: 100%;
overflow: hidden;
max-height: 500px;
.swipe {
width: 100%;
height: 100%;
img {
width: 100%;
height: 100%;
}
}
}
.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
position: relative;
width: 100%;
.block {
padding: 10px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
img {
width: 100%;
object-fit: contain;
border-radius: 10px;
}
.coress {
padding-top: 20px;
}
}
}
}
</style>

4
na-frontend/src/pages/man/PortfolioManPage.vue
View File

@ -673,14 +673,14 @@ export default {
// 卡片容器（滚动区域）
.cards-container {
padding: 0 20px;
padding: 10px;
overflow: auto;
// 卡片网格布局
.card-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
gap: 10px;
// // 移动端适配
// @media (max-width: 600px) {

4
na-frontend/src/pages/man/SampleCollectionManPage.vue
View File

@ -670,14 +670,14 @@ export default {
// 卡片容器（滚动区域）
.cards-container {
padding: 0 20px;
padding:10px;
overflow: auto;
// 卡片网格布局
.card-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
gap: 10px;
// // 移动端适配
// @media (max-width: 600px) {

225
na-frontend/src/pages/man/TagManPage.vue
View File

@ -2,14 +2,67 @@
<div class="tag-man-page">
<!-- 固定顶部导航栏 -->
<NavBar class="nav-bar" />
<!-- 内容区域 -->
<div class="content">
<div class="tag" v-for="(tag, index) in tags" :key="index">
<van-tag :color="tag.tagBgColor" :text-color="tag.tagColor" size="large">{{ tag.tagName }}</van-tag>
<div class="btn">
<van-button type="primary" size="mini" round @click="editTag(tag)">编辑</van-button>
<van-button type="danger" size="mini" round @click="deleteTag(tag)">删除</van-button>
</div>
</div>
<div style="height: 300px;" v-if="tags.length > 10"></div>
<div class="addTag">
<van-button type="primary" @click="addNewTag" block>新增标签</van-button>
</div>
</div>
<!-- 固定底部TabBar -->
<ManTabBar class="tab-bar" />
<van-popup v-model="showPopup" closeable position="bottom" style="height: 80vh; " lazy-render
:close-on-click-overlay="false">
<div class="tagModify">
<van-tag :color="editTagInfo.tagBgColor" :text-color="editTagInfo.tagColor" size="large">{{
editTagInfo.tagName }}</van-tag>
</div>
<div class="popup-content">
<van-field label="标签名" v-model="editTagInfo.tagName" placeholder="请输入标签名" />
<div class="colorChoose">
<van-field label="字色" v-model="editTagInfo.tagColor" type="color" />
<van-field label="背景色" v-model="editTagInfo.tagBgColor" type="color" />
</div>
<van-button type="primary" @click="saveChange" block>确认修改</van-button>
</div>
</van-popup>
<van-popup v-model="showaddPopup" closeable position="bottom" style="height: 80vh; " lazy-render
:close-on-click-overlay="false">
<div class="tagModify">
<van-tag :color="editTagInfo.tagBgColor" :text-color="editTagInfo.tagColor" size="large">{{
editTagInfo.tagName }}</van-tag>
</div>
<div class="popup-content">
<van-field label="标签名" v-model="editTagInfo.tagName" placeholder="请输入标签名" />
<div class="colorChoose">
<van-field label="字色" v-model="editTagInfo.tagColor" type="color" />
<van-field label="背景色" v-model="editTagInfo.tagBgColor" type="color" />
</div>
<van-button type="primary" @click="saveAdd" block>确认新增</van-button>
</div>
</van-popup>
</div>
</template>
<script>
import NavBar from '@/components/NavBar.vue';
import ManTabBar from '@/components/ManTabBar.vue';
import { Dialog } from 'vant';
export default {
name: 'TagManPage',
components: {
@ -19,13 +72,179 @@ export default {
props: {},
data() {
return {
tags: [],
showPopup: false,
editTagInfo: { tagName: '', tagBgColor: '', tagColor: '' },
showaddPopup: false,
};
},
watch: {},
computed: {},
methods: {},
methods: {
getAllTags() {
this.$axios.get('/tagInfo/getAll').then(res => {
console.log(res);
if (res.code === 200) {
this.tags = res.data;
} else {
this.$toast.fail('获取标签失败');
}
}).catch(() => {
this.$toast.fail('网络错误，请稍后再试');
});
},
addTag() {
if (this.newTagName) {
this.$axios.post('/tagInfo/add', {
tagName: this.newTagName,
tagBgColor: '#f2826a',
tagColor: '#fff'
}).then(res => {
console.log(res);
if (res.code === 200) {
this.$toast.success('添加标签成功');
} else {
this.$toast.fail('添加标签失败');
}
}).catch(() => {
this.$toast.fail('网络错误，请稍后再试');
});
}
},
editTag(tag) {
this.editTagInfo = JSON.parse(JSON.stringify(tag));
this.showPopup = true;
},
deleteTag(tag) {
Dialog.confirm({
title: '确认删除标签',
message: '点击取消可继续编辑',
}).then(() => {
console.log(tag);
this.$axios.post('/tagInfo/deleteById', null, {
params: {
id: tag.id
}
}).then(res => {
console.log(res);
if (res.code === 200) {
this.$toast.success('删除标签成功');
this.getAllTags();
}
else {
this.$toast.fail('删除标签失败');
}
}).catch(() => {
this.$toast.fail('网络错误，请稍后再试');
});
})
.catch(() => {
})
console.log(tag);
},
saveChange() {
Dialog.confirm({
title: '确认保存修改',
message: '点击取消可继续编辑',
}).then(() => {
console.log(this.editTagInfo);
this.$axios.post('/tagInfo/updateById', this.editTagInfo).then(res => {
console.log(res);
if (res.code === 200) {
this.$toast.success('修改标签成功');
this.showPopup = false;
this.getAllTags();
}
else {
this.$toast.fail('修改标签失败');
}
}).catch(() => {
this.$toast.fail('网络错误，请稍后再试');
this.showPopup = false;
});
})
.catch(() => {
// on cancel
});
},
addNewTag() {
this.editTagInfo = { tagName: '标签', tagBgColor: '#f2826a', tagColor: '#fff' };
this.showaddPopup = true;
},
saveAdd() {
Dialog.confirm({
title: '确认新增标签',
message: '点击取消可继续编辑',
}).then(() => {
console.log(this.editTagInfo);
this.$axios.post('/tagInfo/save', this.editTagInfo).then(res => {
console.log(res);
if (res.code === 200) {
this.$toast.success('新增标签成功');
this.showaddPopup = false;
this.getAllTags();
}
else {
this.$toast.fail('新增标签失败');
}
}).catch(() => {
this.$toast.fail('网络错误，请稍后再试');
this.showaddPopup = false;
});
})
.catch(() => {
// on cancel
});
},
},
created() { },
mounted() { }
mounted() {
this.getAllTags();
}
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.tag-man-page {
padding: 10px;
height: 100vh;
overflow: hidden;
.content {
overflow-y: auto;
height: calc(100vh - 110px);
.tag {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
padding: 10px;
.btn {
display: flex;
}
}
}
.tagModify {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 50px;
margin-top: 50px;
}
.colorChoose {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}
}
</style>