first commit
This commit is contained in:
@@ -0,0 +1,683 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<!-- 在 head 标签中添加 meta 标签，并设置 viewport-fit=cover 值 -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
|
||||
<title></title>
|
||||
<!-- 引入样式文件 -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.6/lib/index.css">
|
||||
<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.2.0/weui.min.css">
|
||||
<link rel="stylesheet" href="${base!}/assets/mobile/css/theme.css">
|
||||
|
||||
<!-- 引入 Vue 和 Vant 的 JS 文件 -->
|
||||
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vant@2.6/lib/vant.min.js"></script>
|
||||
<script src="/assets/platform/plugins/moment/moment.min.js"></script>
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
max-width: 600px;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar {
|
||||
display: none
|
||||
}
|
||||
|
||||
[v-cloak] {
|
||||
display: none
|
||||
}
|
||||
|
||||
html, body {
|
||||
font-family: PingFang SC, 'Helvetica Neue', Arial, sans-serif;
|
||||
}
|
||||
|
||||
.page-v {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.detail-v {
|
||||
margin-top: 15px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.p15 {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.njuColor {
|
||||
color: rgb(106, 0, 95);
|
||||
}
|
||||
|
||||
.title-v {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.form-v {
|
||||
/*margin-top: 20px;*/
|
||||
}
|
||||
|
||||
.van-doc-demo-block__title {
|
||||
margin: 0;
|
||||
padding: 0 16px;
|
||||
color: rgba(69, 90, 100, 0.6);
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
.goods-card {
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.delete-button {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.van-swipe-cell__wrapper {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.weui-msg {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.van-button--small {
|
||||
min-width: 100px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: url('/assets/platform/img/checkin/bcc.jpg') no-repeat;
|
||||
background-size: 100% 100%;
|
||||
height: 230px;
|
||||
display: flex;
|
||||
color: #7ca4d8;
|
||||
}
|
||||
.van-tabbar-item__icon {
|
||||
font-size: 28px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.van-tabbar-item__text {
|
||||
transform: scale(0.9);
|
||||
}
|
||||
.header .container {
|
||||
font-size: 13px;
|
||||
letter-spacing: 1px;
|
||||
z-index: 100;
|
||||
width: 100%;
|
||||
padding-right: 20px;
|
||||
padding-top: 16px;
|
||||
text-align: right;
|
||||
}
|
||||
.header .day {
|
||||
font-size: 60px;
|
||||
letter-spacing: 2px;
|
||||
color: white;
|
||||
}
|
||||
.van-tag {
|
||||
font-size: 25px;
|
||||
background-color: transparent;
|
||||
padding: 6px 16px;
|
||||
}
|
||||
.van-tag--primary.van-tag--plain {
|
||||
color: white;
|
||||
}
|
||||
.my_body {
|
||||
width: 94%;
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
top: -48px;
|
||||
}
|
||||
.van-calendar {
|
||||
border-radius: 16px;
|
||||
box-shadow: 0 2px 10px rgb(125 126 128 / 16%);
|
||||
}
|
||||
.van-calendar__day {
|
||||
font-size: 18px;
|
||||
}
|
||||
.van-calendar__selected-day {
|
||||
width: 40px;
|
||||
height: 36px;
|
||||
border-radius: 7px;
|
||||
}
|
||||
.sign_in_day {
|
||||
position: relative;
|
||||
width: 40px;
|
||||
height: 37px !important;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
color: #4ABE84;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 2px 7px 0px rgba(85, 110, 97, 0.35);
|
||||
border-radius: 7px;
|
||||
border: 1px solid rgba(74, 190, 132, 1);
|
||||
}
|
||||
.sign_in_day:before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
border: 13px solid #4ABE84;
|
||||
border-top-color: transparent;
|
||||
border-left-color: transparent;
|
||||
border-bottom-right-radius: 6px;
|
||||
/*border-radius: 0 0 0 7px;*/
|
||||
}
|
||||
.sign_in_day:after {
|
||||
content: '';
|
||||
width: 3px;
|
||||
height: 8px;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
bottom: 4px;
|
||||
border: 2px solid #fff;
|
||||
border-top-color: transparent;
|
||||
border-left-color: transparent;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
.info {
|
||||
width: 88%;
|
||||
margin: 20px auto 10px;
|
||||
font-size: 14px;
|
||||
box-shadow: 0 2px 10px rgb(125 126 128 / 16%);
|
||||
padding: 12px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.sign_pop {
|
||||
overflow-y: visible;
|
||||
width: 75%;
|
||||
height: 226px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
.sign_button {
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
}
|
||||
.sign_button button {
|
||||
width: 90%;
|
||||
height: 36px;
|
||||
}
|
||||
.van-calendar__body {
|
||||
display: none;
|
||||
}
|
||||
.white_pop {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 14px;
|
||||
}
|
||||
.white_pop .van-cell {
|
||||
padding: 10px 34px;
|
||||
}
|
||||
.is_show_cell {
|
||||
padding: 0;
|
||||
}
|
||||
.van-calendar__selected-day {
|
||||
border: 1px solid #236eb4;
|
||||
box-shadow: 0px 2px 7px 0px #236eb4;
|
||||
}
|
||||
.zan_order {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: end;
|
||||
-webkit-justify-content: flex-end;
|
||||
padding-right: 10px;
|
||||
color: grey;
|
||||
}
|
||||
.van-uploader__preview-image {
|
||||
width: 98px;
|
||||
height: 94px;
|
||||
}
|
||||
.van-uploader__upload {
|
||||
width: 98px;
|
||||
height: 94px;
|
||||
}
|
||||
.van-empty{
|
||||
transform: none;
|
||||
position: relative;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div v-cloak id="app">
|
||||
|
||||
<van-nav-bar
|
||||
title="一路美景"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="history.go(-1)"
|
||||
|
||||
safe-area-inset-top
|
||||
>
|
||||
<template #right>
|
||||
<van-icon @click="signIn" color="#fff" size="20" name="photograph"></van-icon>
|
||||
</template>
|
||||
</van-nav-bar>
|
||||
|
||||
<div v-if="active === 0" class="page-v">
|
||||
<!--#include("/mobile/hd/checkin/friends.html"){}#-->
|
||||
</div>
|
||||
<div v-if="active === 1" class="page-v">
|
||||
<!--#include("/mobile/hd/checkin/my.html"){}#-->
|
||||
</div>
|
||||
|
||||
<van-tabbar
|
||||
style="max-width: 600px;position: fixed;left: 0;bottom: 0;right: 0;margin: auto"
|
||||
v-model="active" @change="tabbarChange"
|
||||
:active-color="boxData.hdcolor"
|
||||
inactive-color="#000"
|
||||
>
|
||||
<van-tabbar-item icon="thumb-circle-o">新鲜事</van-tabbar-item>
|
||||
<van-tabbar-item icon="user-o">我的</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
|
||||
|
||||
<!--发表内容弹框-->
|
||||
<van-popup v-model:show="writePopShow" class="white_pop" :style="{ height: '100%' }" @close="signClose">
|
||||
<div style="display: flex; justify-content: space-between; padding: 10px 20px; letter-spacing: 1px; align-items: center">
|
||||
<div @click="writePopClose" style="font-size: 16px">取消</div>
|
||||
<div>
|
||||
<van-button @click="signDo" color="#236eb4" size="mini" :disabled="message.trim() === '' && fileList.length === 0"
|
||||
style="border-radius: 6px; height: 28px; letter-spacing: 1px; font-size: 14px">发表</van-button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<van-field
|
||||
v-model="message"
|
||||
rows="3" style="font-size: 15px"
|
||||
autosize
|
||||
type="textarea"
|
||||
placeholder="分享新鲜事..."
|
||||
></van-field>
|
||||
</div>
|
||||
<div style="padding: 10px 34px">
|
||||
<van-uploader v-model="fileList" multiple :after-read="afterRead" @delete="doDelete" :before-read="beforeRead"
|
||||
accept="image/*" :max-count="9" :multiple="true"></van-uploader>
|
||||
</div>
|
||||
<div style="margin-top: 40px">
|
||||
<van-cell-group border style="width: 82%; margin: 0 auto">
|
||||
<van-cell @click="actionShow = true" title="是否公开" class="is_show_cell" icon="user-o"
|
||||
is-link border :value="isOpenText" style="padding: 10px 0px; font-size: 15px"></van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<van-action-sheet v-model="actionShow" :actions="actions" cancel-text="取消" @select="(action) => { isOpenText = action.name }"
|
||||
close-on-click-action></van-action-sheet>
|
||||
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
|
||||
<script>
|
||||
|
||||
const FILE_DOMAIN = "${AppFileDomain!}"
|
||||
|
||||
function getQueryVariable(variable) {
|
||||
var query = window.location.search.substring(1);
|
||||
var vars = query.split("&");
|
||||
for (var i = 0; i < vars.length; i++) {
|
||||
var pair = vars[i].split("=");
|
||||
if (pair[0] == variable) {
|
||||
return pair[1];
|
||||
}
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
var xhrOnProgress = function (fun) {
|
||||
xhrOnProgress.onprogress = fun; //绑定监听
|
||||
//使用闭包实现监听绑
|
||||
return function () {
|
||||
//通过$.ajaxSettings.xhr();获得XMLHttpRequest对象
|
||||
var xhr = $.ajaxSettings.xhr();
|
||||
//判断监听函数是否为函数
|
||||
if (typeof xhrOnProgress.onprogress !== 'function')
|
||||
return xhr;
|
||||
//如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去
|
||||
if (xhrOnProgress.onprogress && xhr.upload) {
|
||||
xhr.upload.onprogress = xhrOnProgress.onprogress;
|
||||
}
|
||||
return xhr;
|
||||
}
|
||||
}
|
||||
|
||||
function getSuffix(filename) {
|
||||
return /\.[^\.]+$/.exec(filename)
|
||||
}
|
||||
Vue.use(vant.Lazyload, {
|
||||
lazyComponent: true,
|
||||
});
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data: function () {
|
||||
return {
|
||||
signCount: 0,
|
||||
tableData: [],
|
||||
finished: false,
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 5,
|
||||
totalCount: 0
|
||||
},
|
||||
loading: false,
|
||||
isSignCurentDay: false,
|
||||
isLoading: false,
|
||||
isOrder: false,
|
||||
isOpenText: '公开',
|
||||
actions: [{ name: '公开' }, { name: '仅自己可见' }],
|
||||
actionShow: false,
|
||||
fileList: [],
|
||||
message: '',
|
||||
writePopShow: false,
|
||||
signShow: false,
|
||||
boxData: {},
|
||||
showPage: false,
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
fd: [],
|
||||
active: 1,
|
||||
isNull: function (val) {
|
||||
if (val === null || val === undefined || val === '') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
imgtype: ['gif', 'jpg', 'png', 'jpeg', 'heif'],
|
||||
audiotype: ['mp3', 'wma', 'flac', 'wav', 'm4a', 'amr', 'au'],
|
||||
doctype: ['doc', 'docx', 'txt'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg', 'quicktime'],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
beforeRead(file) {
|
||||
if(!Array.isArray(file)) {
|
||||
file = [file]
|
||||
}
|
||||
for (const f of file) {
|
||||
const type = this.imgtype.includes(f.name.split('.')[1].toLowerCase());
|
||||
if (!type) {
|
||||
const str = this.imgtype.map(v => v.toLowerCase()).join("/")
|
||||
vant.Toast('上传文件只能是' + str + '格式!');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
},
|
||||
writePopClose() {
|
||||
if (this.fileList.length > 0) {
|
||||
const u = this.fileList.map(o => o.data.filepath)
|
||||
$.post('/mobile/checkin/delFile', {url: JSON.stringify(u)})
|
||||
}
|
||||
this.writePopShow = false
|
||||
},
|
||||
doDelete(file) {
|
||||
$.post('/mobile/checkin/delFile', {url: JSON.stringify([file.data.filepath])})
|
||||
},
|
||||
afterRead(file) {
|
||||
let formData = new FormData();
|
||||
if (Array.isArray(file)) {
|
||||
file.forEach(item => {
|
||||
item.status = 'uploading';
|
||||
item.message = '上传中...';
|
||||
formData.append("file", item.file, item.file.name);
|
||||
})
|
||||
} else {
|
||||
file.status = 'uploading';
|
||||
file.message = '上传中...';
|
||||
formData.append("file", file.file, file.file.name);
|
||||
}
|
||||
$.ajax({
|
||||
url: "/mobile/checkin/uploadFile",
|
||||
type: "post",
|
||||
data: formData,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: (res) => {
|
||||
const {code, data} = res
|
||||
if (code === 0) {
|
||||
if(Array.isArray(file)) {
|
||||
file.forEach(item => {
|
||||
const f = data.find(o => o.filename === item.file.name)
|
||||
item.status = 'success';
|
||||
item.data = f
|
||||
})
|
||||
} else {
|
||||
file.status = 'success';
|
||||
file.data = data[0]
|
||||
}
|
||||
}
|
||||
},
|
||||
error: (err) => {
|
||||
if(Array.isArray(file)) {
|
||||
file.forEach(item => {
|
||||
item.status = 'failed';
|
||||
item.message = '上传失败';
|
||||
})
|
||||
} else {
|
||||
file.status = 'failed';
|
||||
file.data = '上传失败'
|
||||
}
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
onRefresh () {
|
||||
setTimeout(() => {
|
||||
vant.Toast('刷新成功');
|
||||
this.isLoading = false;
|
||||
}, 1000);
|
||||
},
|
||||
async zanOrder () {
|
||||
this.isOrder = !this.isOrder
|
||||
const toast = vant.Toast.loading({message: '获取排行中...', forbidClick: true, loadingType: 'spinner',});
|
||||
this.pageForm.order = this.isOrder
|
||||
setTimeout(() => {
|
||||
this.doSearch();
|
||||
toast.clear()
|
||||
}, 200)
|
||||
},
|
||||
async signDo () {
|
||||
const that = this
|
||||
|
||||
let array = []
|
||||
this.fileList.forEach(item => {
|
||||
array.push(item.data)
|
||||
})
|
||||
const formdata = {
|
||||
'hdid': getQueryVariable("id"),
|
||||
'content': this.message,
|
||||
'isOpen': this.isOpenText === '公开',
|
||||
'files': JSON.stringify(array),
|
||||
}
|
||||
console.log(array)
|
||||
const resp = await $.post('/mobile/checkin/doAdd', formdata)
|
||||
if (resp.code === 0) {
|
||||
this.signCount = resp.data
|
||||
that.doSearch()
|
||||
that.findOne()
|
||||
that.writePopShow = false
|
||||
vant.Toast('发表成功')
|
||||
} else {
|
||||
vant.Toast('系统错误，请联系管理员')
|
||||
}
|
||||
},
|
||||
async delContent(item) {
|
||||
vant.Dialog.confirm({
|
||||
title: '提示',
|
||||
message: '您确定要删除吗？',
|
||||
confirmButtonColor: '#236eb4',
|
||||
}).then(async () => {
|
||||
const resp = await $.post('/mobile/checkin/del', {
|
||||
id: item.id
|
||||
})
|
||||
if (resp.code === 0) {
|
||||
this.doSearch()
|
||||
this.findOne()
|
||||
vant.Toast('删除成功')
|
||||
} else {
|
||||
vant.Toast('删除失败')
|
||||
}
|
||||
}).catch(() => {});
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.finished = false
|
||||
this.getContent()
|
||||
},
|
||||
tabbarChange (o) {
|
||||
this.doSearch();
|
||||
/*if (o !== 0) {
|
||||
this.pageForm.day = ''
|
||||
this.doSearch();
|
||||
}
|
||||
if(o === 2) {
|
||||
this.$nextTick(() => {
|
||||
$('.van-calendar__body').css('display', 'none')
|
||||
setTimeout(() => {
|
||||
$('.van-calendar__body').css('display', 'block')
|
||||
}, 80)
|
||||
})
|
||||
}*/
|
||||
},
|
||||
signIn () {
|
||||
this.writePopShow = true
|
||||
$('.van-calendar__body').css('display', 'none')
|
||||
},
|
||||
signClose () {
|
||||
this.$nextTick(() => {
|
||||
setTimeout(() => {
|
||||
$('.van-calendar__body').css('display', 'block')
|
||||
}, 80)
|
||||
})
|
||||
this.message = ''
|
||||
this.fileList = []
|
||||
this.isOpenText = '公开'
|
||||
},
|
||||
openImage (o, index) {
|
||||
vant.ImagePreview({
|
||||
images: o.map(m => FILE_DOMAIN + m.url),
|
||||
startPosition: index,
|
||||
})
|
||||
},
|
||||
calendarSelect (date) {
|
||||
this.pageForm.day = moment(date).format("YYYY-MM-DD")
|
||||
this.getMyContent()
|
||||
},
|
||||
formatter (day) {
|
||||
const d = moment(day.date).format("YYYY-MM-DD")
|
||||
const map = this.boxData.content.map(o => moment(o.time).format("YYYY-MM-DD"))
|
||||
if(d === moment().format('YYYY-MM-DD')) {
|
||||
day.className = 'cur_day'
|
||||
}
|
||||
if (map.includes(d)) {
|
||||
day.className = 'sign_in_day'
|
||||
if (d === moment().format('YYYY-MM-DD')) {
|
||||
/*this.$nextTick(() => {
|
||||
$('.van-calendar__selected-day').removeAttr("style")
|
||||
$('.van-calendar__selected-day').css('background-color', 'revert').css('color', 'revert')
|
||||
.css('border', 'none').css('box-shadow', 'none')
|
||||
})*/
|
||||
}
|
||||
}
|
||||
return day
|
||||
},
|
||||
async getMyContent() {
|
||||
const resp = await $.post('/platform/hd/checkinManage/getContent', this.pageForm)
|
||||
if(resp.code === 0) {
|
||||
this.tableData = resp.data.list
|
||||
}
|
||||
},
|
||||
async getContent() {
|
||||
this.loading = true
|
||||
this.pageForm.hdid = getQueryVariable("id")
|
||||
this.pageForm.active = this.active
|
||||
const resp = await $.post('/platform/hd/checkinManage/getContent', this.pageForm)
|
||||
if(resp.code === 0) {
|
||||
this.tableData = this.tableData.concat(resp.data.list)
|
||||
if (this.tableData.length === resp.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
}
|
||||
this.loading = false
|
||||
},
|
||||
async zan(o) {
|
||||
o.me_zan = ! o.me_zan
|
||||
if (o.me_zan) {
|
||||
o.zan_count = o.zan_count + 1
|
||||
} else {
|
||||
if (o.zan_count > 0) {
|
||||
o.zan_count = o.zan_count - 1
|
||||
}
|
||||
}
|
||||
o.zan_id = await $.post('/platform/hd/checkinManage/clickZan', {
|
||||
id: o.zan_id,
|
||||
zan: o.me_zan,
|
||||
hdid: o.hdid,
|
||||
contentId: o.id,
|
||||
})
|
||||
},
|
||||
async findOne() {
|
||||
var self = this
|
||||
if (!this.isNull(getQueryVariable("id"))) {
|
||||
await $.get("/platform/hd/checkinManage/findOne", {hdid: getQueryVariable("id")}, function (data) {
|
||||
if (data.code === 0) {
|
||||
document.getElementsByTagName("title")[0].innerText = data.data.hdname;
|
||||
self.boxData = data.data
|
||||
self.isSignCurentDay = self.boxData.content.some(o => moment(o.time).format('YYYY-MM-DD') === (moment().format('YYYY-MM-DD')))
|
||||
self.showPage = true
|
||||
|
||||
if (!data.data.hdflag) {
|
||||
self.$toast.fail("当前活动未开启！");
|
||||
} else {
|
||||
if (!(new Date(data.data.hdkssj.replace(/-/g, '/')).getTime() < new Date().getTime() && new Date().getTime() < new Date(data.data.hdjssj.replace(/-/g, '/')).getTime())) {
|
||||
self.$toast.fail("不在活动时间范围内！");
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
},
|
||||
async created () {
|
||||
var self = this
|
||||
|
||||
setTimeout(() => {
|
||||
$('.van-calendar__body').css('display', 'block')
|
||||
}, 500)
|
||||
|
||||
if (window.innerWidth > 800) {
|
||||
self.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
|
||||
//await self.findOne()
|
||||
await self.getContent()
|
||||
},
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,126 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.list-card {
|
||||
width: 90%;
|
||||
margin: 0 auto 20px;
|
||||
border-radius: 20px;
|
||||
}
|
||||
.van-cell {
|
||||
border-radius: 20px;
|
||||
padding: 4px 16px !important;
|
||||
}
|
||||
.van-cell-group {
|
||||
border-radius: 20px;
|
||||
padding: 12px 4px;
|
||||
}
|
||||
.van-divider {
|
||||
width: 90%;
|
||||
margin: 4px auto 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<m-page-loading v-if="mLoading"></m-page-loading>
|
||||
|
||||
<van-nav-bar
|
||||
title="活动列表"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="location.href='/mobile/index'"
|
||||
></van-nav-bar>
|
||||
|
||||
<div class="search-fixed">
|
||||
<van-dropdown-menu active-color="#1989fa">
|
||||
<van-dropdown-item v-model="pageForm.year" :options="yearOption" @change="yearChange"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</div>
|
||||
|
||||
<div style="margin: 60px auto 0 auto">
|
||||
<van-list
|
||||
v-model="mLoading"
|
||||
:finished="finished"
|
||||
:finished-text="tableData.length>0?'没有更多了':''"
|
||||
@load="onLoad">
|
||||
<div v-for="o in tableData" class="list-card" @click="openView(o)">
|
||||
<van-cell-group inset>
|
||||
<van-cell title="主  题" :border="false">{{o.hdname}}</van-cell>
|
||||
<van-divider></van-divider>
|
||||
<van-cell :border="false" title="创 建 人">{{o.cjr}}</van-cell>
|
||||
<van-cell :border="false" title="创建时间">{{o.hdcjsj}}</van-cell>
|
||||
<van-cell :border="false" title="开始时间">{{o.hdkssj}}</van-cell>
|
||||
<van-cell :border="false" title="结束时间">{{o.hdjssj}}</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</van-list>
|
||||
<van-empty
|
||||
v-if="mLoading==false&&tableData.length==0"
|
||||
class="custom-image"
|
||||
image="/none.svg"
|
||||
description="暂无数据"
|
||||
></van-empty>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [mobileMixins],
|
||||
data() {
|
||||
return {
|
||||
yearOption: [],
|
||||
pageForm: {
|
||||
year: '',
|
||||
hdtype: 1,
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
yearChange() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.onLoad()
|
||||
},
|
||||
async onLoad() {
|
||||
this.mLoading = true
|
||||
$.post('/platform/hd/checkinManage/data', this.pageForm).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = this.tableData.concat(res.data.list)
|
||||
if (this.tableData.length === res.data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
}
|
||||
this.mLoading = false
|
||||
})
|
||||
},
|
||||
openView(o) {
|
||||
const {hdid, hdjssj, hdkssj} = o
|
||||
if (moment().format("YYYY-MM-DD HH:mm:ss") < hdkssj) {
|
||||
vant.Toast('活动暂未开始!')
|
||||
return
|
||||
} else if (moment().format("YYYY-MM-DD HH:mm:ss") > hdjssj) {
|
||||
vant.Toast('活动已结束!')
|
||||
return
|
||||
}
|
||||
window.location.href = '/mobile/checkin/info?client=mobile&id=' + hdid
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
for (let i = new Date().getFullYear() - 10; i <= new Date().getFullYear(); i++) {
|
||||
this.yearOption.unshift({value: i, text: i + '年'},)
|
||||
}
|
||||
this.$set(this.pageForm, "year", this.yearOption[0].value)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,61 @@
|
||||
<div>
|
||||
<van-pull-refresh
|
||||
v-model="isLoading"
|
||||
success-text="刷新成功"
|
||||
@refresh="onRefresh">
|
||||
|
||||
<div>
|
||||
<van-image class="back_img" width="100%" height="230" src="/assets/platform/img/checkin/bcc.jpg"></van-image>
|
||||
</div>
|
||||
<div class="zan_order" :style="isOrder === true ? 'color: #236eb4; font-size: 20px' : 'color: grey; font-size: 20px'">
|
||||
<van-icon name="filter-o"></van-icon>
|
||||
<span style="font-size: 14px" @click="zanOrder">获赞排行</span>
|
||||
</div>
|
||||
|
||||
<van-list
|
||||
v-model="loading" v-if="tableData.length > 0"
|
||||
:finished="finished" :immediate-check="false" @load="getContent"
|
||||
:finished-text="tableData.length>0?'没有更多了':''">
|
||||
|
||||
<!--<lazy-component>-->
|
||||
<div class="info" v-for="item in tableData">
|
||||
<div style="display: flex;">
|
||||
<div>
|
||||
<van-image v-if="item.sex === '男'" width="40" round height="40" src="/assets/platform/img/checkin/man.png"></van-image>
|
||||
<van-image v-if="item.sex === '女'" width="40" round height="40" src="/assets/platform/img/checkin/woman.png"></van-image>
|
||||
</div>
|
||||
<div style="margin-left: 10px">
|
||||
<div style="color: #236eb4; font-weight: bold">{{item.username}}</div>
|
||||
<div style="font-size: 12px; color: grey">{{item.unitname}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top: 8px">
|
||||
<div>{{item.content}}</div>
|
||||
<van-row style="margin-top: 4px">
|
||||
<van-col span="8" v-for="(file, index) in item.files" style="height: 104px">
|
||||
<van-image style="padding-right: 4px; width: 96%; height: 100px" @click="openImage(item.files, index)"
|
||||
:src="FILE_DOMAIN + file.url"></van-image>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between; margin-top: 6px; align-items: center;">
|
||||
<div style="color: grey">{{moment(item.time).format('HH:mm')}}</div>
|
||||
<div :style="item.me_zan === false ? 'font-size: 20px' : 'font-size: 20px; color: red'">
|
||||
<div @click="zan(item)" style="display: flex; align-items: center">
|
||||
<van-icon name="good-job-o" style="font-size: 20px" :badge="item.zan_count"></van-icon>
|
||||
<span style="margin-left: 8px; font-size: 14px">赞</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--</lazy-component>-->
|
||||
</van-list>
|
||||
<van-empty
|
||||
v-if="tableData.length==0"
|
||||
class="custom-image"
|
||||
image="/none.png"
|
||||
description="暂无数据"
|
||||
></van-empty>
|
||||
|
||||
</van-pull-refresh>
|
||||
</div>
|
||||
@@ -0,0 +1,256 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<!-- 在 head 标签中添加 meta 标签，并设置 viewport-fit=cover 值 -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
|
||||
<title>Title</title>
|
||||
<!-- 引入样式文件 -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.5/lib/index.css">
|
||||
<link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.2.0/weui.min.css">
|
||||
|
||||
<!-- 引入 Vue 和 Vant 的 JS 文件 -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/vant@2.5/lib/vant.min.js"></script>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.11.0/jquery.min.js"></script>
|
||||
<script src="/assets/platform/plugins/moment/moment.min.js"></script>
|
||||
|
||||
</head>
|
||||
<style>
|
||||
html, body {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
max-width: 600px;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
html::-webkit-scrollbar {
|
||||
display: none
|
||||
}
|
||||
|
||||
[v-clock] {
|
||||
display: none
|
||||
}
|
||||
|
||||
html, body {
|
||||
font-family: PingFang SC, 'Helvetica Neue', Arial, sans-serif;
|
||||
}
|
||||
|
||||
.page-v {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.detail-v {
|
||||
margin-top: 15px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.p15 {
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.njuColor {
|
||||
color: rgb(106, 0, 95);
|
||||
}
|
||||
|
||||
.title-v {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.form-v {
|
||||
/*margin-top: 20px;*/
|
||||
}
|
||||
|
||||
.van-doc-demo-block__title {
|
||||
margin: 0;
|
||||
padding: 0 16px;
|
||||
color: rgba(69, 90, 100, 0.6);
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
line-height: 16px;
|
||||
}
|
||||
|
||||
.goods-card {
|
||||
margin: 0;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.delete-button {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.van-swipe-cell__wrapper {
|
||||
border: none;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div v-clock id="app">
|
||||
<div>
|
||||
<van-swipe v-if="boxData.fileList.length>0" class="my-swipe" :autoplay="3000" indicator-color="white">
|
||||
<van-swipe-item v-for="url in boxData.fileList">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
:src="url"
|
||||
></van-image>
|
||||
</van-swipe-item>
|
||||
</van-swipe>
|
||||
<van-image
|
||||
v-else
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
src="***"
|
||||
>
|
||||
<template v-slot:error>封面图片</template>
|
||||
</van-image>
|
||||
</div>
|
||||
<div v-if="active==0" class="page-v">
|
||||
<div class="detail-v">
|
||||
<div class="title-v p15">
|
||||
<h3 :style="'color: '+boxData.hdcolor">活动介绍</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<div v-html="boxData.hdjs"></div>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 :style="'color: '+boxData.hdcolor">参加人员</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<div v-html="boxData.hdcjry"></div>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 :style="'color: '+boxData.hdcolor">奖励方式</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<div v-html="boxData.hdjlfs"></div>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 :style="'color: '+boxData.hdcolor">活动内容</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<div v-html="boxData.hdnr"></div>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 :style="'color: '+boxData.hdcolor">活动联系人</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15" style="line-height:24pt;">
|
||||
<div v-html="boxData.hdlxr"></div>
|
||||
</div>
|
||||
<div class="title-v p15" v-if="!isNull(boxData.hdother.replace(/<.*?>/g,''))">
|
||||
<br/>
|
||||
<h3 :style="'color: '+boxData.hdcolor">其他</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15" style="line-height:24pt;" v-if="!isNull(boxData.hdother.replace(/<.*?>/g,''))">
|
||||
<div v-html="boxData.hdother"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<van-tabbar
|
||||
style="max-width: 600px;position: fixed;left: 0;bottom: 0;right: 0;margin: auto"
|
||||
v-model="active"
|
||||
:active-color="boxData.hdcolor"
|
||||
inactive-color="#000"
|
||||
>
|
||||
<van-tabbar-item icon="label-o">介绍</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>
|
||||
<script>
|
||||
|
||||
|
||||
var xhrOnProgress = function (fun) {
|
||||
xhrOnProgress.onprogress = fun; //绑定监听
|
||||
//使用闭包实现监听绑
|
||||
return function () {
|
||||
//通过$.ajaxSettings.xhr();获得XMLHttpRequest对象
|
||||
var xhr = $.ajaxSettings.xhr();
|
||||
//判断监听函数是否为函数
|
||||
if (typeof xhrOnProgress.onprogress !== 'function')
|
||||
return xhr;
|
||||
//如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去
|
||||
if (xhrOnProgress.onprogress && xhr.upload) {
|
||||
xhr.upload.onprogress = xhrOnProgress.onprogress;
|
||||
}
|
||||
return xhr;
|
||||
}
|
||||
}
|
||||
|
||||
function getSuffix(filename) {
|
||||
return /\.[^\.]+$/.exec(filename)
|
||||
}
|
||||
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data: function () {
|
||||
return {
|
||||
fd: [],
|
||||
boxData: {},
|
||||
active: 0,
|
||||
isNull: function (val) {
|
||||
if (val == null || val == undefined || val == '') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
imgtype: ['gif', 'jpg', 'png', 'jpeg'],
|
||||
audiotype: ['mp3', 'wma', 'flac', 'wav', 'm4a', 'amr', 'au'],
|
||||
doctype: ['doc', 'docx', 'txt'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg', 'quicktime'],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
created: function () {
|
||||
var self = this
|
||||
if (window.innerWidth > 800) {
|
||||
self.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
var wmhd_boxdata = localStorage.getItem("wmhd_boxdata")
|
||||
if (wmhd_boxdata != undefined && wmhd_boxdata != null) {
|
||||
this.boxData = JSON.parse(wmhd_boxdata)
|
||||
localStorage.removeItem("wmhd_boxdata")
|
||||
} else {
|
||||
this.boxData = {
|
||||
hdjs: '',
|
||||
hdcjry: '',
|
||||
hdjlfs: '',
|
||||
hdnr: '',
|
||||
hdlxr: '',
|
||||
hdother: '',
|
||||
hdcolor: '#6A005F',
|
||||
fileList: [],
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,59 @@
|
||||
<div>
|
||||
<!--头部、背景图片-->
|
||||
<div class="header">
|
||||
<div class="container">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="tableData.length > 0" class="info" v-for="item in tableData">
|
||||
<div style="display: flex;">
|
||||
<div>
|
||||
<van-image v-if="item.sex === '男'" width="40" round height="40" src="/assets/platform/img/checkin/man.png"></van-image>
|
||||
<van-image v-if="item.sex === '女'" width="40" round height="40" src="/assets/platform/img/checkin/woman.png"></van-image>
|
||||
</div>
|
||||
<div style="margin-left: 10px">
|
||||
<div style="color: #236eb4; font-weight: bold">{{item.username}}</div>
|
||||
<div style="font-size: 12px; color: grey">{{item.unitname}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top: 8px">
|
||||
<div>{{item.content}}</div>
|
||||
<van-row style="margin-top: 4px">
|
||||
<van-col span="8" v-for="(file, index) in item.files" style="height: 104px">
|
||||
<van-image style="padding-right: 4px; width: 96%; height: 100px" @click="openImage(item.files, index)"
|
||||
:src="FILE_DOMAIN + file.url"></van-image>
|
||||
</van-col>
|
||||
</van-row>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: space-between; margin-top: 6px; align-items: center;">
|
||||
<div>
|
||||
<span style="color: grey">{{moment(item.time).format('HH:mm')}}</span>
|
||||
<span @click="delContent(item)" style="font-size: 12px; margin-left: 6px; color: #236eb4">删除</span>
|
||||
</div>
|
||||
<div :style="item.me_zan === false ? 'font-size: 20px' : 'font-size: 20px; color: red'">
|
||||
<div @click="zan(item)" style="display: flex; align-items: center">
|
||||
<van-icon name="good-job-o" style="font-size: 20px" :badge="item.zan_count"></van-icon>
|
||||
<span style="margin-left: 8px; font-size: 14px">赞</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<van-empty
|
||||
v-if="tableData.length==0"
|
||||
class="custom-image"
|
||||
image="/none.png"
|
||||
description="暂无数据"
|
||||
></van-empty>
|
||||
</div>
|
||||
|
||||
<!--签到成功确认框-->
|
||||
<van-popup v-model="signShow" round class="sign_pop">
|
||||
<van-image width="300px" round src="/assets/platform/img/checkin/sign.png" style="position: absolute; top: -150px;z-index: 9999"></van-image>
|
||||
<div style="line-height: 25px; margin-top: 30px; letter-spacing: 1px">
|
||||
<div style="font-size: 16px">恭喜获得天数+1</div>
|
||||
<div style="color: grey">您是今日第<span style="color: chocolate; font-weight: bold">{{signCount}}</span>位签到</div>
|
||||
<div class="sign_button">
|
||||
<van-button @click="signShow = false" round type="info" size="small" color="#236eb4">我知道了</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-popup>
|
||||
Reference in New Issue
Block a user