333
This commit is contained in:
zpc
parent
d8709a0844
commit
39f0da3a44
|
|
@ -5,9 +5,8 @@
|
|||
</image>
|
||||
<uniNoticeBar showIcon single scrollable text="赠品仅限线下购买设备的用户领取，需人工审核，预计3个工作日内完成！"
|
||||
style="width: 100%;position:fixed;top:10%" background-color="transparent" color="#000" />
|
||||
|
||||
|
||||
<view class="auto-scroll-container" catchtouchmove="return false">
|
||||
<view style="height:230rpx;"></view>
|
||||
<view class="auto-scroll-container" catchtouchmove="return false" v-if="imageList.length>0">
|
||||
<!-- 滚动容器 -->
|
||||
<scroll-view class="scroll-view" scroll-x :scroll-with-animation="false" ref="scrollView"
|
||||
@scroll="onScroll">
|
||||
|
|
@ -16,14 +15,16 @@
|
|||
catchtouchmove="return false">
|
||||
<view class="image-list" ref="imageList">
|
||||
<view class="image-item" v-for="(item, index) in imageList" :key="index">
|
||||
<image :src="item.url" mode="aspectFill" class="item-image" :alt="item.alt"></image>
|
||||
<image :src="item.accessUrl" mode="aspectFill" class="item-image" :alt="item.realName">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 复制一份列表用于无缝衔接 -->
|
||||
<view class="image-list copy-list" catchtouchmove="return false">
|
||||
<view class="image-item" v-for="(item, index) in imageList" :key="'copy-' + index">
|
||||
<image :src="item.url" mode="aspectFill" class="item-image" :alt="item.alt"></image>
|
||||
<image :src="item.accessUrl" mode="aspectFill" class="item-image" :alt="item.realName">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -181,6 +182,7 @@
|
|||
if (!userId || userId == 0) {
|
||||
this.login();
|
||||
}
|
||||
this.getBannerList();
|
||||
this.userId = userId;
|
||||
},
|
||||
data() {
|
||||
|
|
@ -198,31 +200,7 @@
|
|||
model: "",
|
||||
recordList: [],
|
||||
// 图片数据
|
||||
imageList: [{
|
||||
url: 'https://picsum.photos/300/200?random=1',
|
||||
alt: '图片1'
|
||||
},
|
||||
{
|
||||
url: 'https://picsum.photos/300/200?random=2',
|
||||
alt: '图片2'
|
||||
},
|
||||
{
|
||||
url: 'https://picsum.photos/300/200?random=3',
|
||||
alt: '图片3'
|
||||
},
|
||||
{
|
||||
url: 'https://picsum.photos/300/200?random=4',
|
||||
alt: '图片4'
|
||||
},
|
||||
{
|
||||
url: 'https://picsum.photos/300/200?random=5',
|
||||
alt: '图片5'
|
||||
},
|
||||
{
|
||||
url: 'https://picsum.photos/300/200?random=6',
|
||||
alt: '图片6'
|
||||
}
|
||||
],
|
||||
imageList: [],
|
||||
scrollTimer: null, // 滚动定时器
|
||||
scrollSpeed: 1, // 滚动速度 (px/帧)
|
||||
translateX: 0, // 位移量
|
||||
|
|
@ -232,15 +210,7 @@
|
|||
},
|
||||
|
||||
onReady() {
|
||||
// 获取列表宽度
|
||||
this.$nextTick(() => {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.image-list').boundingClientRect(data => {
|
||||
this.listWidth = data.width;
|
||||
// 开始自动滚动
|
||||
this.startAutoScroll();
|
||||
}).exec();
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
onUnload() {
|
||||
|
|
@ -248,284 +218,284 @@
|
|||
this.stopAutoScroll();
|
||||
},
|
||||
|
||||
methods: {
|
||||
request(url, method, data) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const header = {
|
||||
methods: {
|
||||
request(url, method, data) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const header = {
|
||||
|
||||
};
|
||||
if (method == "post") {
|
||||
header['content-type'] = 'application/json';
|
||||
}
|
||||
uni.request({
|
||||
url: "https://gift.zpc-xy.com/" + url,
|
||||
method: method,
|
||||
data: data,
|
||||
header: header,
|
||||
timeout: 10000,
|
||||
success: (res) => {
|
||||
console.log('API响应:', res);
|
||||
if (res.statusCode === 200) {
|
||||
resolve(res.data);
|
||||
} else {
|
||||
reject(new Error(`请求失败，状态码: ${res.statusCode}`));
|
||||
};
|
||||
if (method == "post") {
|
||||
header['content-type'] = 'application/json';
|
||||
}
|
||||
uni.request({
|
||||
url: "https://gift.zpc-xy.com/" + url,
|
||||
method: method,
|
||||
data: data,
|
||||
header: header,
|
||||
timeout: 10000,
|
||||
success: (res) => {
|
||||
console.log('API响应:', res);
|
||||
if (res.statusCode === 200) {
|
||||
resolve(res.data);
|
||||
} else {
|
||||
reject(new Error(`请求失败，状态码: ${res.statusCode}`));
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('API请求失败:', err);
|
||||
reject(err);
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('API请求失败:', err);
|
||||
reject(err);
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
async getConfig() {
|
||||
const res = await this.request("config", "get", {});
|
||||
console.log(res);
|
||||
if (res.home != "") {
|
||||
this.bg = res.home;
|
||||
}
|
||||
},
|
||||
wxLogin() {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.login({
|
||||
provider: 'weixin', //使用微信登录
|
||||
onlyAuthorize: true,
|
||||
success: async function (res) {
|
||||
// if()
|
||||
resolve(res.code);
|
||||
},
|
||||
fail: function (err) {
|
||||
reject(err);
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
async login() {
|
||||
try {
|
||||
const wxCode = await this.wxLogin();
|
||||
if (wxCode) {
|
||||
const res = await this.request("userLogin?code=" + wxCode, "post", {});
|
||||
if (res.code == 200) {
|
||||
uni.setStorageSync("user_id", res.data.user_id);
|
||||
this.userId = res.data.user_id;
|
||||
console.log('登录成功, userId:', this.userId);
|
||||
} else {
|
||||
console.error('登录失败:', res.message);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('登录过程出错:', error);
|
||||
}
|
||||
},
|
||||
openReceivePop() {
|
||||
this.$refs.receivePop.open();
|
||||
},
|
||||
|
||||
closeReceivePop() {
|
||||
this.$refs.receivePop.close();
|
||||
},
|
||||
getUserId() {
|
||||
|
||||
if (this.userId == 0) {
|
||||
|
||||
var userId = uni.getStorageSync("user_id");
|
||||
if (!userId || userId == 0) {
|
||||
this.login();
|
||||
} else {
|
||||
this.userId = userId;
|
||||
}
|
||||
}
|
||||
return this.userId;
|
||||
|
||||
},
|
||||
async openRecordPop() {
|
||||
await this.loadRecordList();
|
||||
this.$refs.recordPop.open();
|
||||
},
|
||||
|
||||
async loadRecordList() {
|
||||
try {
|
||||
uni.showLoading({
|
||||
title: '加载中...'
|
||||
});
|
||||
// 这里可以调用API获取实际的领取记录
|
||||
const result = await this.request('getRecord?userId=' + this.getUserId(), 'GET', {});
|
||||
console.log(result);
|
||||
if (result.data.length > 0) {
|
||||
let isShow = true;
|
||||
let record = [];
|
||||
for (var index = 0; index < result.data.length; index++) {
|
||||
var element = result.data[index];
|
||||
if (element.status == 1) {
|
||||
record.push(element)
|
||||
}
|
||||
}
|
||||
this.recordList = record;
|
||||
}
|
||||
// 目前使用模拟数据
|
||||
console.log('加载领取记录...');
|
||||
} catch (error) {
|
||||
console.error('加载领取记录失败:', error);
|
||||
}
|
||||
uni.hideLoading();
|
||||
},
|
||||
|
||||
closeRecordPop() {
|
||||
this.$refs.recordPop.close();
|
||||
},
|
||||
|
||||
async seleImg() {
|
||||
try {
|
||||
uni.showLoading({
|
||||
title: '处理中...'
|
||||
});
|
||||
|
||||
const {
|
||||
base64,
|
||||
path
|
||||
} = await processImage();
|
||||
console.log('最终Base64长度:', base64.length, path);
|
||||
this.imagePath = path;
|
||||
this.base64 = base64;
|
||||
uni.showToast({
|
||||
title: '上传成功'
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('处理失败', err);
|
||||
uni.showToast({
|
||||
title: '处理失败',
|
||||
icon: 'none'
|
||||
});
|
||||
} finally {
|
||||
uni.hideLoading();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
validateForm() {
|
||||
if (!this.name.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.phone.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写联系方式',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.workUnit.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写工作单位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.address.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写收货地址',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.model.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写设备型号',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.number.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写出品编号',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.createTime.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写出品年月',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.imagePath) {
|
||||
uni.showToast({
|
||||
title: '请上传产品铭牌照片',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
async submitForm() {
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...'
|
||||
});
|
||||
|
||||
try {
|
||||
const formData = {
|
||||
UserId: this.userId,
|
||||
Name: this.name,
|
||||
Phone: this.phone,
|
||||
Company: this.workUnit,
|
||||
Address: this.address,
|
||||
ProductModel: this.model,
|
||||
ProductSerialNumber: this.number,
|
||||
ProductDate: this.createTime,
|
||||
ProductImage: this.base64
|
||||
};
|
||||
|
||||
// 这里可以调用API提交数据
|
||||
const result = await this.request('addRecord', 'POST', formData);
|
||||
console.log(result);
|
||||
uni.hideLoading();
|
||||
if (result.code == 200) {
|
||||
uni.showToast({
|
||||
title: '提交成功，请等待审核',
|
||||
icon: 'success'
|
||||
});
|
||||
this.closeReceivePop();
|
||||
this.clearForm();
|
||||
} else {
|
||||
})
|
||||
},
|
||||
async getConfig() {
|
||||
const res = await this.request("config", "get", {});
|
||||
console.log(res);
|
||||
if (res.home != "") {
|
||||
this.bg = res.home;
|
||||
}
|
||||
},
|
||||
wxLogin() {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.login({
|
||||
provider: 'weixin', //使用微信登录
|
||||
onlyAuthorize: true,
|
||||
success: async function(res) {
|
||||
// if()
|
||||
resolve(res.code);
|
||||
},
|
||||
fail: function(err) {
|
||||
reject(err);
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
},
|
||||
async login() {
|
||||
try {
|
||||
const wxCode = await this.wxLogin();
|
||||
if (wxCode) {
|
||||
const res = await this.request("userLogin?code=" + wxCode, "post", {});
|
||||
if (res.code == 200) {
|
||||
uni.setStorageSync("user_id", res.data.user_id);
|
||||
this.userId = res.data.user_id;
|
||||
console.log('登录成功, userId:', this.userId);
|
||||
} else {
|
||||
console.error('登录失败:', res.message);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('登录过程出错:', error);
|
||||
}
|
||||
},
|
||||
openReceivePop() {
|
||||
this.$refs.receivePop.open();
|
||||
},
|
||||
|
||||
closeReceivePop() {
|
||||
this.$refs.receivePop.close();
|
||||
},
|
||||
getUserId() {
|
||||
|
||||
if (this.userId == 0) {
|
||||
|
||||
var userId = uni.getStorageSync("user_id");
|
||||
if (!userId || userId == 0) {
|
||||
this.login();
|
||||
} else {
|
||||
this.userId = userId;
|
||||
}
|
||||
}
|
||||
return this.userId;
|
||||
|
||||
},
|
||||
async openRecordPop() {
|
||||
await this.loadRecordList();
|
||||
this.$refs.recordPop.open();
|
||||
},
|
||||
|
||||
async loadRecordList() {
|
||||
try {
|
||||
uni.showLoading({
|
||||
title: '加载中...'
|
||||
});
|
||||
// 这里可以调用API获取实际的领取记录
|
||||
const result = await this.request('getRecord?userId=' + this.getUserId(), 'GET', {});
|
||||
console.log(result);
|
||||
if (result.data.length > 0) {
|
||||
let isShow = true;
|
||||
let record = [];
|
||||
for (var index = 0; index < result.data.length; index++) {
|
||||
var element = result.data[index];
|
||||
if (element.status == 1) {
|
||||
record.push(element)
|
||||
}
|
||||
}
|
||||
this.recordList = record;
|
||||
}
|
||||
// 目前使用模拟数据
|
||||
console.log('加载领取记录...');
|
||||
} catch (error) {
|
||||
console.error('加载领取记录失败:', error);
|
||||
}
|
||||
uni.hideLoading();
|
||||
},
|
||||
|
||||
closeRecordPop() {
|
||||
this.$refs.recordPop.close();
|
||||
},
|
||||
|
||||
async seleImg() {
|
||||
try {
|
||||
uni.showLoading({
|
||||
title: '处理中...'
|
||||
});
|
||||
|
||||
const {
|
||||
base64,
|
||||
path
|
||||
} = await processImage();
|
||||
console.log('最终Base64长度:', base64.length, path);
|
||||
this.imagePath = path;
|
||||
this.base64 = base64;
|
||||
uni.showToast({
|
||||
title: '上传成功'
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('处理失败', err);
|
||||
uni.showToast({
|
||||
title: '处理失败',
|
||||
icon: 'none'
|
||||
});
|
||||
} finally {
|
||||
uni.hideLoading();
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
validateForm() {
|
||||
if (!this.name.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.phone.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写联系方式',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.workUnit.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写工作单位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.address.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写收货地址',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.model.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写设备型号',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.number.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写出品编号',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.createTime.trim()) {
|
||||
uni.showToast({
|
||||
title: '请填写出品年月',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.imagePath) {
|
||||
uni.showToast({
|
||||
title: '请上传产品铭牌照片',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
|
||||
async submitForm() {
|
||||
if (!this.validateForm()) {
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '提交中...'
|
||||
});
|
||||
|
||||
try {
|
||||
const formData = {
|
||||
UserId: this.userId,
|
||||
Name: this.name,
|
||||
Phone: this.phone,
|
||||
Company: this.workUnit,
|
||||
Address: this.address,
|
||||
ProductModel: this.model,
|
||||
ProductSerialNumber: this.number,
|
||||
ProductDate: this.createTime,
|
||||
ProductImage: this.base64
|
||||
};
|
||||
|
||||
// 这里可以调用API提交数据
|
||||
const result = await this.request('addRecord', 'POST', formData);
|
||||
console.log(result);
|
||||
uni.hideLoading();
|
||||
if (result.code == 200) {
|
||||
uni.showToast({
|
||||
title: '提交成功，请等待审核',
|
||||
icon: 'success'
|
||||
});
|
||||
this.closeReceivePop();
|
||||
this.clearForm();
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
|
||||
} catch (error) {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
|
||||
console.error('提交失败:', error);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
} catch (error) {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '提交失败，请重试',
|
||||
icon: 'none'
|
||||
});
|
||||
console.error('提交失败:', error);
|
||||
}
|
||||
},
|
||||
|
||||
clearForm() {
|
||||
this.name = '';
|
||||
this.phone = '';
|
||||
this.workUnit = '';
|
||||
this.address = '';
|
||||
this.model = '';
|
||||
this.number = '';
|
||||
this.createTime = '';
|
||||
this.imagePath = '';
|
||||
this.base64 = '';
|
||||
},
|
||||
clearForm() {
|
||||
this.name = '';
|
||||
this.phone = '';
|
||||
this.workUnit = '';
|
||||
this.address = '';
|
||||
this.model = '';
|
||||
this.number = '';
|
||||
this.createTime = '';
|
||||
this.imagePath = '';
|
||||
this.base64 = '';
|
||||
},
|
||||
|
||||
previewImage() {
|
||||
if (this.imagePath) {
|
||||
|
|
@ -545,7 +515,23 @@
|
|||
});
|
||||
}
|
||||
},
|
||||
|
||||
async getBannerList() {
|
||||
const res = await this.request("getBannerList", "GET", {});
|
||||
console.log(res);
|
||||
if (res.data.length > 0) {
|
||||
this.imageList = res.data;
|
||||
console.log(this.imageList, this.imageList.length);
|
||||
// 获取列表宽度
|
||||
this.$nextTick(() => {
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('.image-list').boundingClientRect(data => {
|
||||
this.listWidth = data.width;
|
||||
// 开始自动滚动
|
||||
this.startAutoScroll();
|
||||
}).exec();
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// 开始自动滚动
|
||||
startAutoScroll() {
|
||||
|
|
@ -579,8 +565,8 @@
|
|||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
|
@ -590,19 +576,20 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
/* justify-content: center; */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.line {
|
||||
width: 90%;
|
||||
justify-content: center;
|
||||
margin-top: 20rpx;
|
||||
border-bottom: 0.86px solid #e3e3e3;
|
||||
.line {
|
||||
width: 90%;
|
||||
justify-content: center;
|
||||
margin-top: 20rpx;
|
||||
border-bottom: 0.86px solid #e3e3e3;
|
||||
|
||||
}
|
||||
|
||||
.auto-scroll-container {
|
||||
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
/* 隐藏滚动条 */
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user