first commit
This commit is contained in:
@@ -0,0 +1,924 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<!--
|
||||
三八妇女活动管理
|
||||
-->
|
||||
<style>
|
||||
.w-e-text-container {
|
||||
min-height: 200px !important;
|
||||
max-height: 700px !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.w-e-text {
|
||||
min-height: 200px !important;
|
||||
max-height: 700px !important;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.ViewDialogClass .el-collapse-item__header {
|
||||
font-size: 12px;
|
||||
color: rgb(150, 150, 150);
|
||||
/*font-weight: bold;*/
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.el-collapse-item__wrap {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-collapse-item__header {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload {
|
||||
border: 1px dashed #d9d9d9;
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.avatar-uploader .el-upload:hover {
|
||||
border-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-upload--picture-card {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.el-upload-list--picture-card .el-upload-list__item {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
}
|
||||
|
||||
.avatar-uploader-icon {
|
||||
font-size: 28px;
|
||||
color: #8c939d;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.iphonex_box {
|
||||
width: 366px;
|
||||
height: 720px;
|
||||
background: url("https://www.qmwtp.com/assets/www/ActivityPc2/img/iphoneX.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.box_title {
|
||||
position: absolute;
|
||||
width: 40%;
|
||||
top: 68px;
|
||||
color: white;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0 auto;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.new_frame {
|
||||
position: absolute;
|
||||
width: 321px;
|
||||
height: 576px;
|
||||
top: 94px;
|
||||
left: 24px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
visibility: hidden;
|
||||
display: block;
|
||||
font-size: 0;
|
||||
content: " ";
|
||||
clear: both;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.style_every {
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.style_every input {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
top: 0px;
|
||||
left: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.style_every img {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 7px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ViewDialogClass .el-form-item {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button ">
|
||||
<el-date-picker
|
||||
v-model="pageForm.year"
|
||||
type="year"
|
||||
value-format="yyyy"
|
||||
placeholder="选择年">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.hdname">
|
||||
<template slot="prepend">活动主题</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-button icon="el-icon-search" @click="doSearch" type="primary"></el-button>
|
||||
</div>
|
||||
<div class="pull-right offscreen-right">
|
||||
<el-button size="medium" @click="openAdd" type="primary"><i class="ti-plus"></i> 创建活动
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
header-align="center"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
label="序号"
|
||||
type="index"
|
||||
header-align="center"
|
||||
align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="hdname"
|
||||
label="主题"
|
||||
header-align="center"
|
||||
show-overflow-tooltip="true"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="cjr"
|
||||
label="创建人"
|
||||
header-align="center"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="hdcjsj"
|
||||
label="创建时间"
|
||||
header-align="center"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="time"
|
||||
label="活动时间"
|
||||
header-align="center"
|
||||
width="300px"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
{{scope.row.hdkssj}} -- {{scope.row.hdjssj}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="hdflag"
|
||||
label="状态"
|
||||
header-align="center"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
<i v-if="!scope.row.hdflag"
|
||||
class="fa fa-circle text-danger ml5"></i>
|
||||
<i v-if="scope.row.hdflag"
|
||||
class="fa fa-circle text-success ml5"></i>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="400"
|
||||
header-align="center"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button v-if="scope.row.hdflag==false" type="success" size="mini"
|
||||
@click="changeStatus(scope.row.hdid,true)">开启
|
||||
</el-button>
|
||||
<el-button v-else type="info" size="mini"
|
||||
@click="changeStatus(scope.row.hdid,false)">关闭
|
||||
</el-button>
|
||||
<el-button size="mini" type="primary" @click="sendMsg(scope.row)">
|
||||
通知
|
||||
</el-button>
|
||||
<el-button size="mini" type="primary" @click="openCode(scope.row.hdid)">
|
||||
二维码
|
||||
</el-button>
|
||||
<el-button type="primary" size="mini" @click="openEdit(scope.row.hdid)"
|
||||
v-if="scope.row.isSysadminH10">编辑
|
||||
</el-button>
|
||||
<el-button type="danger" size="mini" @click="doDelete(scope.row.hdid)"
|
||||
v-if="scope.row.isSysadminH10">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<el-row type="flex">
|
||||
<el-col :span="9" style="position: relative;text-align: center">
|
||||
<div class="iphonex_box">
|
||||
<div class="box_title">{{formData.hdname}}</div>
|
||||
<iframe class="new_frame" id="myIframe" scrolling="auto" frameborder="none;"
|
||||
src="/platform/hd/cahdMange/mobileBox">
|
||||
|
||||
</iframe>
|
||||
</div>
|
||||
<el-button type="info" style="margin-top: 10px" icon="el-icon-refresh"
|
||||
@click="refreshBox" round>刷新
|
||||
</el-button>
|
||||
</el-col>
|
||||
<el-col :span="14" offset="1">
|
||||
<el-form :model="formData" style="padding-top: 20px;padding-right: 10px"
|
||||
ref="addForm"
|
||||
label-position="left" :rules="formRules" size="medium"
|
||||
label-width="90px">
|
||||
<el-form-item prop="hdname" label="活动主题">
|
||||
<el-input placeholder="请输入活动主题" v-model="formData.hdname"></el-input>
|
||||
</el-form-item>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item prop="time" label="活动时间">
|
||||
<el-date-picker
|
||||
style="width: 100%"
|
||||
v-model="formData.time"
|
||||
type="datetimerange"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
:default-time="['00:00:00']">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item prop="hdlb" label="活动类别">
|
||||
<el-row v-for="lb,idx in formData.lbs" style="padding-bottom: 5px">
|
||||
<el-col :span="20">
|
||||
<el-input placeholder="请输入名称" v-model="lb.lname"></el-input>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align: center">
|
||||
<el-button type="warning" icon="el-icon-plus" circle
|
||||
@click="formData.lbs.splice(idx+1,0,{zplbs:[{}]})"></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align: center">
|
||||
<el-button type="danger" :disabled="idx==0"
|
||||
icon="el-icon-delete" circle
|
||||
@click="formData.lbs.splice(idx,1)"></el-button>
|
||||
</el-col>
|
||||
<el-col style="padding: 5px 0">
|
||||
<el-row v-for="zplb,idx2 in lb.zplbs"
|
||||
style="padding-bottom: 5px">
|
||||
<el-col :span="20">
|
||||
<el-col :span="4"><span v-if="idx2==0"
|
||||
class="el-form-item__label">作品类别</span><span
|
||||
v-else> </span>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-input placeholder="请输入名称"
|
||||
v-model="zplb.zname"></el-input>
|
||||
</el-col>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align: center">
|
||||
<el-button type="warning" icon="el-icon-plus" circle
|
||||
@click="lb.zplbs.splice(idx2+1,0,{})"></el-button>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align: center">
|
||||
<el-button type="danger" :disabled="idx2==0"
|
||||
icon="el-icon-delete" circle
|
||||
@click="lb.zplbs.splice(idx2,1)"></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item label="参加人员范围" prop="activityGroupId">
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="width: 99%">
|
||||
<el-select placeholder="请选择参加人员范围"
|
||||
v-model="formData.activityGroupId" style="width: 99%"
|
||||
clearable
|
||||
filterable>
|
||||
<el-option v-for="item in activityGroupList"
|
||||
:label="item.groupName"
|
||||
:value="item.groupId"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div>
|
||||
<el-button @click="$refs.drawerUserScope.userScopeDialog = true"
|
||||
type="primary">设置
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<el-form-item prop="xlFlag" label="活动提醒">
|
||||
<el-switch
|
||||
v-model="formData.xlFlag"
|
||||
active-color="#13ce66"
|
||||
inactive-color="#ff4949">
|
||||
</el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdjs" label="活动介绍">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="hdjsEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdcjry" label="参加人员">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="cjryEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdjlfs" label="奖励方式">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="jlfsEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdnr" label="活动内容">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="hdnrEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdlxr" label="联系人">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="lxrEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdother" label="其他">
|
||||
<el-collapse>
|
||||
<el-collapse-item>
|
||||
<template slot="title">
|
||||
点击展开 <i class="header-icon el-icon-thumb"
|
||||
style="margin-left: 5px"></i>
|
||||
</template>
|
||||
<div id="otherEditor"></div>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</el-form-item>
|
||||
<el-form-item label="活动封面">
|
||||
<file-upload :files.sync="formData.files"></file-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="配色">
|
||||
<ul class="style_box old_stylebox clearfix"
|
||||
style="display: block;padding-left: 0;">
|
||||
<li class="style_every" v-for="color,idx in colorList"
|
||||
@click="colorChange(color)"
|
||||
:style="'background: '+color">
|
||||
<img src="https://www.qmwtp.com/assets/www/ActivityPc2/img/duihao.png"
|
||||
:style="'display: '+(formData.hdcolor==color?'block':'none')">
|
||||
<input type="radio" name="sex" checked="checked" value="1">
|
||||
</li>
|
||||
</ul>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" justify="end">
|
||||
<el-button type="success" v-show="selected=='add'" @click="save">保 存</el-button>
|
||||
<el-button type="primary" @click="doSubmit">确 定</el-button>
|
||||
</el-row>
|
||||
</template>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="dialogVisible">
|
||||
<img width="100%" :src="dialogImageUrl" alt="">
|
||||
</el-dialog>
|
||||
<drawer-user-scope
|
||||
@group_change="getActivityGroup"
|
||||
ref="drawerUserScope"
|
||||
:group_id.sync="formData.activityGroupId"
|
||||
></drawer-user-scope>
|
||||
|
||||
<send-msg ref="sendMsg" :url="url"></send-msg>
|
||||
|
||||
<open-qr-code ref="openQRCode" :url="url"></open-qr-code>
|
||||
|
||||
</div>
|
||||
<a id="download"></a>
|
||||
<script>
|
||||
var editor = {
|
||||
hdjsEditor: null,
|
||||
cjryEditor: null,
|
||||
jlfsEditor: null,
|
||||
hdnrEditor: null,
|
||||
lxrEditor: null,
|
||||
otherEditor: null,
|
||||
}
|
||||
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
var self = this
|
||||
var checkHdlb = function (rule, value, callback) {
|
||||
if (self.formData.lbs.length == 0) {
|
||||
callback(new Error("必填"))
|
||||
}
|
||||
self.formData.lbs.forEach(function (v) {
|
||||
v.zplbs.forEach(function (v2) {
|
||||
if (self.isNull(v2.zname)) {
|
||||
callback(new Error("有类别未填写名称"))
|
||||
}
|
||||
})
|
||||
if (self.isNull(v.lname)) {
|
||||
callback(new Error("有类别未填写名称"))
|
||||
}
|
||||
})
|
||||
callback()
|
||||
};
|
||||
return {
|
||||
hdid: GetQueryString("hdid"),
|
||||
selected: '',
|
||||
colorList: ['#6A005F', '#31cab1', '#e54242', '#ff8939', '#ffb712', '#1dc47b', '#4495f7', '#ff5e8b', '#5d6e7f'],
|
||||
fileList: [],
|
||||
delFiles: [],
|
||||
dialogImageUrl: '',
|
||||
activeNames: '',
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
year: moment().format('YYYY'),
|
||||
hdtype: 2,
|
||||
searchName: "",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
hdname: ""
|
||||
},
|
||||
formData: {},
|
||||
codeDialogVisible: false,
|
||||
addDialogVisible: false,
|
||||
editDialogVisible: false,
|
||||
dialogVisible: false,
|
||||
formRules: {
|
||||
hdname: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdjs: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdcjry: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdjlfs: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdnr: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdlxr: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
// hdother: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
time: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
hdlb: [{required: true, validator: checkHdlb, trigger: ['blur', 'change']}],
|
||||
},
|
||||
isNull: function (val) {
|
||||
if (val === null || val === undefined || val === '') {
|
||||
return true
|
||||
}
|
||||
return false
|
||||
},
|
||||
id: '',
|
||||
activityGroupList: [],
|
||||
url: '',
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'send-msg': httpVueLoader('/components/plugins/SendMsgByGroupId.vue'),
|
||||
'drawer-user-scope': httpVueLoader('/components/plugins/DrawerUserScope.vue'),
|
||||
'open-qr-code': httpVueLoader('/components/plugins/OpenQRCode.vue'),
|
||||
},
|
||||
methods: {
|
||||
async getActivityGroup() {
|
||||
const resp = await $.get('/platform/activity/basic/scope/getActivityUserScopeGroup')
|
||||
this.activityGroupList = resp.data
|
||||
},
|
||||
share: function () {
|
||||
const id = this.id
|
||||
$.get("/platform/hd/wmhdMange/findOne", {hdid: id}, function (data) {
|
||||
if (data.code == 0) {
|
||||
window.open("http://connect.qq.com/widget/shareqq/index.html?url=" + HOST_URL + "/staffActivities?id=" + id + "&title=" + data.data.hdname + "&desc=" + data.data.hdname + "")
|
||||
}
|
||||
}
|
||||
)
|
||||
},
|
||||
openCode(id) {
|
||||
this.$refs.openQRCode.openCode("/childrenActivities?id=" + id)
|
||||
},
|
||||
sendMsg(row) {
|
||||
this.url = `<a href="` + (APP_DOMAIN + "/childrenActivities?id=" + row.hdid) + `">点击参与</a>`
|
||||
this.$refs.sendMsg.openDialog(row.activitygroupid)
|
||||
},
|
||||
doSubmit: function () {
|
||||
if (this.selected === 'add') {
|
||||
this.doAdd()
|
||||
} else if (this.selected === 'edit') {
|
||||
this.doEdit()
|
||||
}
|
||||
},
|
||||
changeStatus: function (hdid, flag) {
|
||||
$.post(base + "/platform/hd/wmhdMange/changeStatus", {
|
||||
hdid: hdid,
|
||||
flag: flag
|
||||
}, function (data) {
|
||||
if (data.code == 0) {
|
||||
vue.$message({
|
||||
message: data.msg,
|
||||
type: 'success'
|
||||
});
|
||||
vue.pageData();
|
||||
} else {
|
||||
vue.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
save: function () {
|
||||
vue.changeFormEditorData()
|
||||
localStorage.setItem("wmhd_savedata2", JSON.stringify(vue.formData))
|
||||
vue.$message({
|
||||
message: '保存成功！',
|
||||
type: 'success'
|
||||
});
|
||||
},
|
||||
changeFormEditorDataTxt() {
|
||||
this.$set(this.formData, 'hdjs', editor.hdjsEditor.txt.html())
|
||||
this.$set(this.formData, 'hdcjry', editor.cjryEditor.txt.html())
|
||||
this.$set(this.formData, 'hdjlfs', editor.jlfsEditor.txt.html())
|
||||
this.$set(this.formData, 'hdnr', editor.hdnrEditor.txt.html())
|
||||
this.$set(this.formData, 'hdlxr', editor.lxrEditor.txt.html())
|
||||
this.$set(this.formData, 'hdother', editor.otherEditor.txt.html())
|
||||
},
|
||||
changeFormEditorData() {
|
||||
this.$set(this.formData, 'hdjs', editor.hdjsEditor.txt.html())
|
||||
this.$set(this.formData, 'hdcjry', editor.cjryEditor.txt.html())
|
||||
this.$set(this.formData, 'hdjlfs', editor.jlfsEditor.txt.html())
|
||||
this.$set(this.formData, 'hdnr', editor.hdnrEditor.txt.html())
|
||||
this.$set(this.formData, 'hdlxr', editor.lxrEditor.txt.html())
|
||||
this.$set(this.formData, 'hdother', editor.otherEditor.txt.html())
|
||||
},
|
||||
refreshBox: function () {
|
||||
vue.changeFormEditorData()
|
||||
var fileList = []
|
||||
vue.fileList.forEach(function (file) {
|
||||
fileList.push(file.url)
|
||||
})
|
||||
vue.$set(vue.formData, 'fileList', fileList)
|
||||
localStorage.setItem("wmhd_boxdata", JSON.stringify(vue.formData))
|
||||
$('#myIframe').attr('src', $('#myIframe').attr('src'));
|
||||
},
|
||||
colorChange: function (color, idx) {
|
||||
this.formData.hdcolor = color
|
||||
},
|
||||
handlePictureCardPreview: function (file) {
|
||||
this.dialogImageUrl = file.url;
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
handleChange: function (file, fileList) {
|
||||
var self = this;
|
||||
if (file.size == 0) {
|
||||
self.$message.warning("您选择的是空文件!");
|
||||
for (var i = 0; i < fileList.length; i++) {
|
||||
if (file == fileList[i]) {
|
||||
fileList.splice(i, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
self.fileList = fileList;
|
||||
},
|
||||
handleRemove: function (file, fileList) {
|
||||
var self = this;
|
||||
self.fileList = fileList;
|
||||
if (file.status == 'ok') {
|
||||
console.log("增加要删除的文件：" + file.name)
|
||||
self.delFiles.push({uid: file.uid, url: file.urlx})
|
||||
}
|
||||
},
|
||||
doDelete: function (id) {
|
||||
var self = this;
|
||||
this.$confirm('确定要删除吗？这将会删除目前所有已提交的作品数据！', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
callback: function (a, b) {
|
||||
if ("confirm" == a) {//确认后再执行
|
||||
$.post(base + "/platform/hd/wmhdMange/delete", {hdid: id}, function (data) {
|
||||
if (data.code == 0) {
|
||||
self.$message({
|
||||
message: data.msg,
|
||||
type: 'success'
|
||||
});
|
||||
self.pageData();
|
||||
} else {
|
||||
self.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}, "json");
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
async openEdit(id) {
|
||||
this.formData = {};
|
||||
this.fileList = []
|
||||
this.delFiles = []
|
||||
this.selected = 'edit'
|
||||
if (this.$refs["addForm"])
|
||||
this.$refs["addForm"].resetFields();
|
||||
const data = await $.get("/platform/hd/wmhdMange/findOne", {hdid: id})
|
||||
if (data.code == 0) {
|
||||
data.data.time = [data.data.hdkssj, data.data.hdjssj]
|
||||
this.formData = data.data
|
||||
this.$refs.guava.edit()
|
||||
this.$nextTick(() => {
|
||||
E = window.wangEditor
|
||||
for (key in editor) {
|
||||
$('#' + key).html("")
|
||||
editor[key] = new E('#' + key)
|
||||
editor[key].create()
|
||||
}
|
||||
editor.hdjsEditor.txt.html(vue.formData.hdjs)
|
||||
editor.cjryEditor.txt.html(vue.formData.hdcjry)
|
||||
editor.jlfsEditor.txt.html(vue.formData.hdjlfs)
|
||||
editor.hdnrEditor.txt.html(vue.formData.hdnr)
|
||||
editor.lxrEditor.txt.html(vue.formData.hdlxr)
|
||||
editor.otherEditor.txt.html(vue.formData.hdother)
|
||||
this.refreshBox()
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
},
|
||||
async doEdit() {
|
||||
this.changeFormEditorDataTxt()
|
||||
this.$refs["addForm"].validate(async valid => {
|
||||
if (valid) {
|
||||
this.changeFormEditorData()
|
||||
this.formData.hdkssj = this.formData.time[0]
|
||||
this.formData.hdjssj = this.formData.time[1]
|
||||
|
||||
let loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据正在提交中，请稍后...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
})
|
||||
|
||||
const reps = await $.post("/platform/hd/wmhdMange/doEdit", {hdxx: JSON.stringify(this.formData)})
|
||||
loading.close()
|
||||
if (reps.code === 0) {
|
||||
this.$message.success(reps.msg)
|
||||
this.$refs.guava.index()
|
||||
this.pageData()
|
||||
} else {
|
||||
this.$message.warning(reps.msg)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
doAdd() {
|
||||
this.changeFormEditorDataTxt()
|
||||
this.$refs["addForm"].validate(async valid => {
|
||||
if (valid) {
|
||||
this.changeFormEditorData()
|
||||
this.formData.hdkssj = this.formData.time[0]
|
||||
this.formData.hdjssj = this.formData.time[1]
|
||||
|
||||
var loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据正在提交中，请稍后...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
const reps = await $.post("/platform/hd/wmhdMange/doAdd", {hdxx: JSON.stringify(this.formData)})
|
||||
loading.close()
|
||||
if (reps.code === 0) {
|
||||
this.$message.success(reps.msg)
|
||||
this.$refs.guava.index()
|
||||
localStorage.removeItem("wmhd_savedata")
|
||||
this.pageData()
|
||||
} else {
|
||||
this.$message.warning(reps.msg)
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
openAdd () {
|
||||
var self = this;
|
||||
this.selected = 'add'
|
||||
|
||||
if (localStorage.getItem("wmhd_savedata2")) {
|
||||
try {
|
||||
this.formData = JSON.parse(localStorage.getItem("wmhd_savedata2"))
|
||||
} catch (e) {
|
||||
localStorage.removeItem('wmhd_savedata2')
|
||||
this.formData = {
|
||||
hdtype: 2,
|
||||
hdcolor: this.colorList[0],
|
||||
username: "${@shiro.getPrincipalProperty('username')}",
|
||||
hdcjsj: moment().format('YYYY-MM-DD'),
|
||||
lbs: [{zplbs: [{}]}],
|
||||
};
|
||||
}
|
||||
} else {
|
||||
this.formData = {
|
||||
hdtype: 2,
|
||||
hdcolor: this.colorList[0],
|
||||
username: "${@shiro.getPrincipalProperty('username')}",
|
||||
hdcjsj: moment().format('YYYY-MM-DD'),
|
||||
lbs: [{zplbs: [{}]}],
|
||||
};//打开新增窗口,表单先清空
|
||||
}
|
||||
|
||||
this.fileList = []
|
||||
if (this.$refs["addForm"])
|
||||
this.$refs["addForm"].resetFields();
|
||||
// this.addDialogVisible = true;
|
||||
this.$refs.guava.edit()
|
||||
vue.$nextTick(function () {
|
||||
E = window.wangEditor
|
||||
menu = [
|
||||
'head', // 标题
|
||||
'bold', // 粗体
|
||||
'fontSize', // 字号
|
||||
'fontName', // 字体
|
||||
'italic', // 斜体
|
||||
'underline', // 下划线
|
||||
'strikeThrough', // 删除线
|
||||
'foreColor', // 文字颜色
|
||||
// 'backColor', // 背景颜色
|
||||
'link', // 插入链接
|
||||
'list', // 列表
|
||||
'justify', // 对齐方式
|
||||
'quote', // 引用
|
||||
'emoticon', // 表情
|
||||
// 'image', // 插入图片
|
||||
'table', // 表格
|
||||
// 'code', // 插入代码
|
||||
// 'undo', // 撤销
|
||||
// 'redo' // 重复
|
||||
]
|
||||
for (key in editor) {
|
||||
$('#' + key).html("")
|
||||
editor[key] = new E('#' + key)
|
||||
editor[key].config.menus = menu
|
||||
editor[key].create()
|
||||
}
|
||||
editor.hdjsEditor.txt.html(vue.formData.hdjs)
|
||||
editor.cjryEditor.txt.html(vue.formData.hdcjry)
|
||||
editor.jlfsEditor.txt.html(vue.formData.hdjlfs)
|
||||
editor.hdnrEditor.txt.html(vue.formData.hdnr)
|
||||
editor.lxrEditor.txt.html(vue.formData.hdlxr)
|
||||
editor.otherEditor.txt.html(vue.formData.hdother)
|
||||
|
||||
if (localStorage.getItem("wmhd_savedata2")) {
|
||||
vue.refreshBox()
|
||||
} else {
|
||||
$('#myIframe').attr('src', $('#myIframe').attr('src'));
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
pageData: function () {//加载分页数据
|
||||
var self = this;
|
||||
sublime.showLoadingbar();//显示loading
|
||||
$.post(base + "/platform/hd/wmhdMange/data", self.pageForm, function (data) {
|
||||
sublime.closeLoadingbar();//关闭loading
|
||||
if (data.code == 0) {
|
||||
data.data.list.forEach(v => {
|
||||
if ("${@shiro.hasRole('sysadmin')}" === 'false') {
|
||||
const user = "${@shiro.getPrincipalProperty('id')}"
|
||||
return v.isSysadminH10 = v.hdcjr === user
|
||||
}
|
||||
return v.isSysadminH10 = true
|
||||
})
|
||||
self.tableData = data.data.list;
|
||||
self.pageForm.totalCount = data.data.totalCount;
|
||||
} else {
|
||||
self.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}, "json");
|
||||
}
|
||||
,
|
||||
},
|
||||
created() {
|
||||
this.pageData();
|
||||
this.getActivityGroup()
|
||||
if (this.hdid) {
|
||||
setTimeout(() => {
|
||||
this.openAdd()
|
||||
}, 500)
|
||||
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,177 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<div id="app">
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
|
||||
<div class="btn-group tool-button">
|
||||
<el-cascader placeholder="请选择活动主题"
|
||||
filterable
|
||||
v-model="pageForm.hdids" :options="hdxxlist"
|
||||
@change="(v)=>{ pageForm.hdid = clone(v).pop() }"
|
||||
clearable></el-cascader>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword" @keyup.enter.native="doSearch" clearable>
|
||||
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型" style="width: 120px;"
|
||||
clearable>
|
||||
<!-- <el-option v-if="hasSuperAdminOrXghRole" label="分工会" value="gh.unionname"></el-option>-->
|
||||
<!-- <el-option label="单位" value="dw.name"></el-option>-->
|
||||
<el-option label="教职工姓名" value="sbr.username"></el-option>
|
||||
<el-option label="工资号" value="sbr.loginname"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<el-row class="btn-group tool-button">
|
||||
<el-select v-if="hasSuperAdminOrXghRole" placeholder="所属工会" v-model="pageForm.union"
|
||||
style="width: 200px;"
|
||||
clearable="true"
|
||||
filterable="true" @change="unionChange">
|
||||
<el-option v-for="item in unions" :label="item.unionname" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-row>
|
||||
|
||||
<el-row class="btn-group tool-button">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unit" style="width: 200px;" clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-row>
|
||||
|
||||
<div class="btn-group tool-button">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</div>
|
||||
|
||||
<div class="pull-right offscreen-right">
|
||||
<el-button size="medium" @click="exportExcel(1)">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出获奖人员名单
|
||||
</el-button>
|
||||
<el-button size="medium" @click="exportExcel(2)" v-if="hasSuperAdminOrXghRole">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出分工会获奖信息
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-table :data="tableData">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center" width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="username" label="姓名" header-align="center" align="center"
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center" show-overflow-tooltip
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center" show-overflow-tooltip
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="hjcount" label="获奖次数" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
return {
|
||||
unions: [],
|
||||
units: [],
|
||||
|
||||
hasSuperAdminOrXghRole:"${@shiro.hasAnyRoles('sysadmin,A06',',')}" === 'true' ? true : false,
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
hdid: null,
|
||||
searchName: 'sbr.username'
|
||||
},
|
||||
tableData: [],
|
||||
hdxxlist: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async unionChange() {
|
||||
this.$set(this.pageForm, "unit", null)
|
||||
this.units = await getUnits(this.pageForm.union)
|
||||
},
|
||||
|
||||
pageData: function () {
|
||||
var self = this;
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/childhd/hjxx/pageData", self.pageForm, function (data) {
|
||||
sublime.closeLoadingbar();
|
||||
if (data.code == 0) {
|
||||
self.tableData = data.data.list;
|
||||
self.pageForm.totalCount = data.data.totalCount;
|
||||
}
|
||||
});
|
||||
},
|
||||
pageSizeChange: function (val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
exportExcel: function (num) {
|
||||
var self = this;
|
||||
var hdid = self.pageForm.hdid;
|
||||
if (hdid === '') {
|
||||
this.$message.warning('请先选择活动主题');
|
||||
return;
|
||||
}
|
||||
window.location.href = base + '/platform/hd/childhd/hjxx/exportExcel?num=' + num + '&hdid=' + hdid;
|
||||
},
|
||||
doSearch: function () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
initHdxxlist() {
|
||||
$.post(base + '/platform/hd/childhd/zpxx/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.yearActivityList = data.data
|
||||
let activityList = []
|
||||
data.data.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
this.hdxxlist = activityList
|
||||
this.$set(this.pageForm, 'hdid', this.hdxxlist ? this.hdxxlist[0].value : []);
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
$.ajaxSettings.async = false;
|
||||
this.initHdxxlist();
|
||||
this.pageData();
|
||||
$.ajaxSettings.async = true;
|
||||
this.unions = await getUnions()
|
||||
this.units = await getUnits()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,871 @@
|
||||
<!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.staticfile.org/vant/2.12.5/index.min.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.staticfile.org/vue/2.6.9/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vant/2.12.5/vant.js"></script>
|
||||
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.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;
|
||||
}
|
||||
|
||||
.van-nav-bar__content {
|
||||
background-color: #081776;
|
||||
}
|
||||
|
||||
.van-nav-bar__title, .van-icon-arrow-left::before {
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div v-clock id="app" v-if="showPage">
|
||||
<van-nav-bar title="亲子作品征集" fixed placeholder safe-area-inset-top @click-left="history.back()"
|
||||
:left-arrow="leftArrow"></van-nav-bar>
|
||||
<div>
|
||||
<van-swipe v-if="boxData.files&&boxData.files.length>0" class="my-swipe" :autoplay="3000"
|
||||
indicator-color="white">
|
||||
<van-swipe-item v-for="bgi in boxData.files">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
:src="FILE_DOMAIN+'/fileStreamPreview?id='+bgi.id"
|
||||
></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>
|
||||
<div v-if="active==1" class="page-v">
|
||||
<div class="detail-v" style="margin-top: 0">
|
||||
<div class="weui-msg" v-if="showMsg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<van-circle
|
||||
layer-color="rgb(240,240,240)"
|
||||
color="#07c160"
|
||||
stroke-width="50"
|
||||
v-if="showPlan"
|
||||
v-model="percent"
|
||||
:rate="percent"
|
||||
:clockwise="false"
|
||||
:text="percent+' %'"
|
||||
></van-circle>
|
||||
<span v-if="showPlan==false">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-if="!flag" class="weui-icon-warn weui-icon_msg"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title" v-if="showPlan">上传中...</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&flag">上传成功!</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&!flag">上传失败!</h2>
|
||||
<div v-html="msg"></div>
|
||||
</div>
|
||||
<div class="weui-msg__opr-area">
|
||||
<p class="weui-btn-area">
|
||||
<a v-if="!showPlan" @click="showMsg=false"
|
||||
:class="flag?'weui-btn weui-btn_primary':'weui-btn weui-btn_warn'">{{flag ? '确定' : '返回'}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-v" v-if="!showMsg">
|
||||
<van-form @submit="doSubmit">
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
基本信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
@input="doInput"
|
||||
required
|
||||
v-model="formData.loginname"
|
||||
name="工资号"
|
||||
label="工资号"
|
||||
placeholder="工资号"
|
||||
:rules="[{ required: true, message: '请填写工资号' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.username"
|
||||
name="姓名"
|
||||
label="姓  名"
|
||||
:placeholder="getPlaceholder(formData,'username')"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.unionname"
|
||||
name="所属工会"
|
||||
label="所属工会"
|
||||
:placeholder="getPlaceholder(formData,'unionname')"
|
||||
></van-field>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.mobile"
|
||||
name="mobile"
|
||||
label="手机号码" type="tel"
|
||||
placeholder="手机号码"
|
||||
:rules="[{ required: true, message: '请填写手机号码' }]"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
子女信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.znxm"
|
||||
name="znxm"
|
||||
label="姓  名"
|
||||
placeholder="姓名" maxlength="30"
|
||||
:rules="[{ required: true, message: '请填写子女姓名' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.znnl"
|
||||
name="znnl"
|
||||
label="年  龄" type="digit"
|
||||
placeholder="年龄"
|
||||
:rules="[{ required: true, message: '请填写子女年龄' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
clickable
|
||||
name="znxb"
|
||||
:value="formData.znxb"
|
||||
label="性  别"
|
||||
placeholder="点击选择"
|
||||
@click="znxbShowPicker = true"
|
||||
required
|
||||
:rules="[{ required: true, message: '请选择子女性别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="znxbShowPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="['男','女']"
|
||||
@confirm="function(val){formData.znxb=val;znxbShowPicker=false}"
|
||||
@cancel="zngxShowPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
readonly
|
||||
clickable
|
||||
name="zngx"
|
||||
:value="formData.zngx"
|
||||
label="子女关系"
|
||||
placeholder="点击选择"
|
||||
@click="zngxShowPicker = true"
|
||||
required
|
||||
:rules="[{ required: true, message: '请选择子女关系' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="zngxShowPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="zngxArr"
|
||||
@confirm="function(val){formData.zngx=val;zngxShowPicker=false}"
|
||||
@cancel="zngxShowPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
</van-cell-group>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<span class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
作品信息</span>
|
||||
<p class="van-doc-demo-block__title" style="margin-top: 5px;color: red">
|
||||
(如同时参加以下多个活动，或有多个主题，请分别提交)</p>
|
||||
</div>
|
||||
<van-tabs v-model="formData.hdlb_i" :color="boxData.hdcolor" type="line">
|
||||
<van-tab v-for="(lb,i) in boxData.lbs" :name="i" :title="lb.lname">
|
||||
<div v-if="formData.hdlb_i==i">
|
||||
<van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="fd[i].zpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>
|
||||
<van-field
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="fd[i].zplb_name"
|
||||
label="作品类别"
|
||||
placeholder="点击选择作品类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择作品类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
value-key="zname"
|
||||
:columns="lb.zplbs"
|
||||
@confirm="function(val){fd[i].zplb=val.zid;fd[i].zplb_name=val.zname;showPicker=false}"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field type="textarea" show-word-limit maxlength="100" autosize
|
||||
v-model="fd[i].zpms"
|
||||
label="作品介绍"
|
||||
placeholder="介绍"></van-field>
|
||||
|
||||
<van-field label="图  片" disabled placeholder="（左滑删除单个文件）"
|
||||
style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="(img,idx) in fd[i].imgList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
v-if="img.id"
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="FILE_DOMAIN+'/fileStreamPreview?id='+img.id"
|
||||
></van-image>
|
||||
<van-image
|
||||
v-else
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="imgDelete(idx,i,img.filepath)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false" :before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="5"
|
||||
v-model="fd[i].imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field label-width="150" label="音/视频、文档" disabled style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="video,idx in fd[i].videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">
|
||||
{{video.filename ? video.filename : video.file.name }}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="videoDelete(idx,i,video.filepath)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="vue.$toast.fail('文件大小不能超过200M！')"
|
||||
:max-size="209715200"
|
||||
:before-read="beforeReadVideo" accept="*" :max-count="2"
|
||||
v-model="fd[i].videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
</div>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
|
||||
<span style="padding-left: 15px;font-size: 12px;color: rgb(160,160,160)">（注意：图片最多5张，视频最大200M。）</span>
|
||||
<div style="margin: 16px;">
|
||||
<van-button :disabled="subDis" round block :color="boxData.hdcolor" type="info"
|
||||
native-type="submit">
|
||||
提交
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</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-item icon="edit">报名</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<script src="https://cdn.staticfile.org/js-cookie/2.2.1/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)
|
||||
}
|
||||
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data: function () {
|
||||
return {
|
||||
readytodelfile: [],
|
||||
leftArrow: false,
|
||||
zngxArr: ['父亲', '母亲', '第三代'],
|
||||
boxData: {},
|
||||
subDis: false,
|
||||
showPage: false,
|
||||
znxbShowPicker: false,
|
||||
zngxShowPicker: false,
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
formData: {
|
||||
hdlb_i: 0,
|
||||
},
|
||||
fd: [],
|
||||
active: 0,
|
||||
isNull(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: {
|
||||
imgDelete(idx, i, filepath) {
|
||||
this.fd[i].imgList.splice(idx, 1)
|
||||
this.readytodelfile.push(filepath);
|
||||
},
|
||||
videoDelete(idx, i, filepath) {
|
||||
this.fd[i].videoList.splice(idx, 1)
|
||||
this.readytodelfile.push(filepath);
|
||||
},
|
||||
onConfirm: function (value) {
|
||||
this.formData.hdzplx2 = value.zname;
|
||||
this.showPicker = false;
|
||||
},
|
||||
getPlaceholder: function (formData, key) {
|
||||
if (vue.isNull(formData.userid)) {
|
||||
return "输入工资号后自动匹配"
|
||||
} else {
|
||||
if (vue.isNull(formData[key])) {
|
||||
return '暂无'
|
||||
}
|
||||
return formData[key]
|
||||
}
|
||||
},
|
||||
async doInput(val) {
|
||||
this.$set(this.formData, 'username', undefined)
|
||||
this.$set(this.formData, 'unionname', undefined)
|
||||
this.$set(this.formData, 'userid', undefined)
|
||||
const data = await $.get("/childrenActivities/queryUserByLoginname", {loginname: val})
|
||||
if (data.code == 0) {
|
||||
if (!this.isNull(data.data)) {
|
||||
this.$set(this.formData, 'userid', data.data.id)
|
||||
this.$set(this.formData, 'username', data.data.username)
|
||||
this.$set(this.formData, 'unionname', data.data.unionname)
|
||||
this.$set(this.formData, 'loginname', data.data.loginname)
|
||||
}
|
||||
}
|
||||
},
|
||||
async doSubmit() {
|
||||
if (vue.isNull(vue.formData.userid)) {
|
||||
vue.$toast.fail("请正确填写您的工资号！")
|
||||
return
|
||||
}
|
||||
const i = vue.formData.hdlb_i
|
||||
|
||||
if (vue.fd[i].videoList.length == 0 && vue.fd[i].imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
}
|
||||
|
||||
const confirm = await vue.$dialog.confirm({
|
||||
title: '提醒',
|
||||
message: '您当前选择的是“' + vue.boxData.lbs[i].lname + '”，是否确认上传？上传后您将不能对已上传的作品进行更改'
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
setTimeout(() => {
|
||||
this.showMsg = true
|
||||
this.showPlan = true
|
||||
this.percent = 0
|
||||
this.msg = ''
|
||||
|
||||
let formData1 = {}
|
||||
let formData2 = new FormData();
|
||||
if (!this.isNull(this.formData.id)) {
|
||||
this.$set(formData1, "id", getQueryVariable("zpid"))
|
||||
this.$set(formData1, "hdid", getQueryVariable("id"))
|
||||
|
||||
this.$set(formData1, "sbr", this.formData.userid)
|
||||
this.$set(formData1, "mobile", this.formData.mobile)
|
||||
this.$set(formData1, "hdlb", this.boxData.lbs[i].lid)
|
||||
this.$set(formData1, "znxm", this.formData.znxm)
|
||||
this.$set(formData1, "znnl", this.formData.znnl)
|
||||
this.$set(formData1, "znxb", this.formData.znxb)
|
||||
this.$set(formData1, "zngx", this.formData.zngx)
|
||||
|
||||
this.$set(formData1, "zplb", this.fd[i].zplb)
|
||||
this.$set(formData1, "zpzt", this.fd[i].zpzt)
|
||||
this.$set(formData1, "zpms", this.fd[i].zpms)
|
||||
this.$set(formData1, "sbsj", moment().format('YYYY-MM-DD HH:mm:ss'))
|
||||
|
||||
|
||||
} else {
|
||||
formData2.append("hdid", getQueryVariable("id"))
|
||||
|
||||
formData2.append("sbr", this.isNull(this.formData.userid) ? '' : this.formData.userid);
|
||||
formData2.append("mobile", vue.isNull(vue.formData.mobile) ? '' : this.formData.mobile);
|
||||
formData2.append("hdlb", vue.isNull(vue.boxData.lbs[i].lid) ? '' : this.boxData.lbs[i].lid)
|
||||
|
||||
formData2.append("znxm", this.isNull(this.formData.znxm) ? '' : this.formData.znxm);
|
||||
formData2.append("znnl", this.isNull(this.formData.znnl) ? '' : this.formData.znnl);
|
||||
formData2.append("znxb", this.isNull(this.formData.znxb) ? '' : this.formData.znxb);
|
||||
formData2.append("zngx", this.isNull(this.formData.zngx) ? '' : this.formData.zngx);
|
||||
|
||||
formData2.append("zplb", this.isNull(this.fd[i].zplb) ? '' : this.fd[i].zplb);
|
||||
formData2.append("zpzt", this.isNull(this.fd[i].zpzt) ? '' : this.fd[i].zpzt);
|
||||
formData2.append("zpms", this.isNull(this.fd[i].zpms) ? '' : this.fd[i].zpms);
|
||||
formData2.append("sbsj", moment().format('YYYY-MM-DD HH:mm:ss'));
|
||||
|
||||
vue.fd[i].imgList.forEach(function (val) {
|
||||
formData2.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
vue.fd[i].videoList.forEach(function (val) {
|
||||
formData2.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
}
|
||||
|
||||
if (!this.isNull(this.formData.id)) {
|
||||
formData2.append("data", JSON.stringify(formData1));
|
||||
formData2.append("readytodelfile", JSON.stringify(this.readytodelfile));
|
||||
this.fd[i].imgList.forEach(val => {
|
||||
formData2.append("file", val.file);
|
||||
});
|
||||
this.fd[i].videoList.forEach(val => {
|
||||
formData2.append("file", val.file);
|
||||
});
|
||||
$.ajax({
|
||||
url: "/platform/hd/childhd/sczp/doEdit",
|
||||
type: "post",
|
||||
data: formData2,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
xhr: xhrOnProgress(function (e) {
|
||||
if (e.total == 0) {
|
||||
vue.percent = 0
|
||||
} else {
|
||||
vue.percent = ((e.loaded / e.total) * 100).toFixed(0);//文件上传百分比
|
||||
}
|
||||
|
||||
}),
|
||||
success: function (data) {
|
||||
if (data.code === 0) {
|
||||
|
||||
vue.formData.znxm = ''
|
||||
vue.formData.znnl = ''
|
||||
vue.formData.znxb = ''
|
||||
vue.formData.zngx = ''
|
||||
|
||||
vue.fd[i].zplb = ''
|
||||
vue.fd[i].zplb_name = ''
|
||||
vue.fd[i].zpzt = ''
|
||||
vue.fd[i].zpms = ''
|
||||
vue.fd[i].sbsj = ''
|
||||
vue.fd[i].imgList = []
|
||||
vue.fd[i].videoList = []
|
||||
vue.fd[i].audioList = []
|
||||
Cookies.remove('ca_formData');
|
||||
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">我们已收到您的作品！<br/>非常感谢您的支持！</p>'
|
||||
vue.flag = true
|
||||
} else {
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
}
|
||||
vue.showPlan = false
|
||||
window.history.back()
|
||||
},
|
||||
error: function (data) {
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
vue.showPlan = false
|
||||
}
|
||||
});
|
||||
|
||||
} else {
|
||||
$.ajax({
|
||||
url: "/childrenActivities/doSubmit",
|
||||
type: "post",
|
||||
data: formData2,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
xhr: xhrOnProgress(function (e) {
|
||||
if (e.total == 0) {
|
||||
vue.percent = 0
|
||||
} else {
|
||||
vue.percent = ((e.loaded / e.total) * 100).toFixed(0);//文件上传百分比
|
||||
}
|
||||
|
||||
}),
|
||||
success: function (data) {
|
||||
if (data.code === 0) {
|
||||
|
||||
vue.formData.znxm = ''
|
||||
vue.formData.znnl = ''
|
||||
vue.formData.znxb = ''
|
||||
vue.formData.zngx = ''
|
||||
|
||||
vue.fd[i].zplb = ''
|
||||
vue.fd[i].zplb_name = ''
|
||||
vue.fd[i].zpzt = ''
|
||||
vue.fd[i].zpms = ''
|
||||
vue.fd[i].sbsj = ''
|
||||
vue.fd[i].imgList = []
|
||||
vue.fd[i].videoList = []
|
||||
vue.fd[i].audioList = []
|
||||
Cookies.remove('ca_formData');
|
||||
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">我们已收到您的作品！<br/>非常感谢您的支持！</p>'
|
||||
vue.flag = true
|
||||
} else {
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
}
|
||||
vue.showPlan = false
|
||||
},
|
||||
error: function (data) {
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
vue.showPlan = false
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
,
|
||||
500
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadImg: function (file) {
|
||||
return true;
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadVideo: function (file, detail) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
vue.$toast('获取不到后缀名！');
|
||||
return false;
|
||||
}
|
||||
// var type = suffix.toString().substring(suffix.lastIndexOf(".") + 2)
|
||||
// if (vue.videotype.indexOf(type) == -1 && vue.audiotype.indexOf(type) == -1 && vue.doctype.indexOf(type) == -1) {
|
||||
// vue.$toast('不支持的文件类型！');
|
||||
// return false;
|
||||
// }
|
||||
return true;
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
const loginname = "${@shiro.getPrincipalProperty('loginname')}"
|
||||
this.$set(this.formData, "loginname", loginname)
|
||||
this.doInput(loginname)
|
||||
const zpid = GetQueryString("zpid")
|
||||
GetQueryString("client") == "mobile" ? this.leftArrow = true : this.leftArrow = false
|
||||
this.$set(this.formData, "loginname", loginname)
|
||||
this.doInput(loginname)
|
||||
var self = this
|
||||
if (window.innerWidth > 800) {
|
||||
self.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
|
||||
if (!this.isNull(getQueryVariable("id"))) {
|
||||
$.get("/platform/hd/wmhdMange/findOne", {hdid: getQueryVariable("id")}, function (data) {
|
||||
if (data.code == 0) {
|
||||
document.getElementsByTagName("title")[0].innerText = data.data.hdname;
|
||||
data.data.lbs.forEach(function (lb, idx) {
|
||||
self.fd.push({
|
||||
zpzt: '',
|
||||
zpms: '',
|
||||
zplb: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
})
|
||||
})
|
||||
self.boxData = data.data
|
||||
self.formData.hdlb_i = 0
|
||||
self.showPage = true
|
||||
|
||||
if (!data.data.hdflag) {
|
||||
self.$toast.fail("当前活动未开启！");
|
||||
self.subDis = true
|
||||
} 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("不在活动时间范围内！");
|
||||
self.subDis = true
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if (!this.isNull(zpid)) {
|
||||
const {data, code, msg} = await $.get("/platform/hd/wmhd/findOneById", {id: zpid})
|
||||
const refs = await $.get("/mobile/cahd/list/findOne", {id: zpid})
|
||||
this.$set(this.formData, "id", refs[0].id)
|
||||
this.$set(this.formData, "hdid", refs[0].id)
|
||||
this.$set(this.formData, "userid", refs[0].sbr)
|
||||
this.$set(this.formData, "mobile", refs[0].mobile)
|
||||
this.$set(this.boxData.lbs[this.formData.hdlb_i], "lid", refs[0].hdlb)
|
||||
this.$set(this.formData, "znxm", refs[0].znxm)
|
||||
this.$set(this.formData, "znnl", refs[0].znnl)
|
||||
this.$set(this.formData, "znxb", refs[0].znxb)
|
||||
this.$set(this.formData, "zngx", refs[0].zngx)
|
||||
this.$set(this.fd[this.formData.hdlb_i], "zplb", refs[0].zplb)
|
||||
this.$set(this.fd[this.formData.hdlb_i], "zpzt", refs[0].zpzt)
|
||||
this.$set(this.fd[this.formData.hdlb_i], "zpms", refs[0].zpms)
|
||||
this.$set(this.fd[this.formData.hdlb_i], "zplb_name", refs[0].zname)
|
||||
data.forEach((v, i) => {
|
||||
v.filename = v.filename
|
||||
v.fjurl = v.filepath
|
||||
v.url = FILE_DOMAIN + v.filepath
|
||||
v.content = FILE_DOMAIN + v.filepath
|
||||
const filetype = v.filename.substring(v.filename.lastIndexOf(".") + 1)
|
||||
const aa = this.audiotype.concat(this.videotype)
|
||||
if (this.imgtype.indexOf(filetype) > -1) {
|
||||
this.fd[this.formData.hdlb_i].imgList.push(v)
|
||||
} else if (aa.indexOf(filetype) > -1) {
|
||||
this.fd[this.formData.hdlb_i].videoList.push(v);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function GetQueryString(name) {
|
||||
const reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
||||
const r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]);
|
||||
return "";
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,640 @@
|
||||
<!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.staticfile.org/vant/2.12.5/index.min.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.staticfile.org/vue/2.6.9/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vant/2.12.5/vant.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/jquery/1.11.1/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.files&&boxData.files.length>0" class="my-swipe" :autoplay="3000" indicator-color="white">
|
||||
<van-swipe-item v-for="url in boxData.files">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
:src="'${AppFileDomain!}/fileStreamPreview?id='+url.id"
|
||||
></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>
|
||||
<div v-if="active==1" class="page-v">
|
||||
<div class="detail-v" style="margin-top: 0">
|
||||
<div class="weui-msg" v-if="showMsg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<van-circle
|
||||
layer-color="rgb(240,240,240)"
|
||||
color="#07c160"
|
||||
stroke-width="50"
|
||||
v-if="showPlan"
|
||||
v-model="percent"
|
||||
:rate="percent"
|
||||
:clockwise="false"
|
||||
:text="percent+' %'"
|
||||
></van-circle>
|
||||
<span v-if="showPlan==false">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-if="!flag" class="weui-icon-warn weui-icon_msg"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title" v-if="showPlan">上传中...</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&flag">上传成功!</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&!flag">上传失败!</h2>
|
||||
<div v-html="msg"></div>
|
||||
</div>
|
||||
<div class="weui-msg__opr-area">
|
||||
<p class="weui-btn-area">
|
||||
<a v-if="!showPlan" @click="showMsg=false"
|
||||
:class="flag?'weui-btn weui-btn_primary':'weui-btn weui-btn_warn'">{{flag ? '确定' : '返回'}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-v" v-if="!showMsg">
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
基本信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
@input="doInput"
|
||||
required
|
||||
v-model="formData.loginname"
|
||||
name="工资号"
|
||||
label="工资号"
|
||||
placeholder="工资号"
|
||||
:rules="[{ required: true, message: '请填写工资号' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.username"
|
||||
name="姓名"
|
||||
label="姓  名"
|
||||
:placeholder="getPlaceholder(formData,'username')"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.unionname"
|
||||
name="所属工会"
|
||||
label="所属工会"
|
||||
:placeholder="getPlaceholder(formData,'unionname')"
|
||||
></van-field>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.mobile"
|
||||
name="znnl"
|
||||
label="手机号码" type="tel"
|
||||
placeholder="手机号码"
|
||||
:rules="[{ required: true, message: '请填写手机号码' }]"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
子女信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.znxm"
|
||||
name="znxm"
|
||||
label="姓  名"
|
||||
placeholder="姓名" maxlength="30"
|
||||
:rules="[{ required: true, message: '请填写子女姓名' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.znnl"
|
||||
name="znnl"
|
||||
label="年  龄" type="digit"
|
||||
placeholder="年龄"
|
||||
:rules="[{ required: true, message: '请填写子女年龄' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
clickable
|
||||
name="znxb"
|
||||
:value="formData.znxb"
|
||||
label="性  别"
|
||||
placeholder="点击选择"
|
||||
@click="znxbShowPicker = true"
|
||||
required
|
||||
:rules="[{ required: true, message: '请选择子女性别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="znxbShowPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="['男','女']"
|
||||
@confirm="function(val){formData.znxb=val;znxbShowPicker=false}"
|
||||
@cancel="zngxShowPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
readonly
|
||||
clickable
|
||||
name="zngx"
|
||||
:value="formData.zngx"
|
||||
label="子女关系"
|
||||
placeholder="点击选择"
|
||||
@click="zngxShowPicker = true"
|
||||
required
|
||||
:rules="[{ required: true, message: '请选择子女关系' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="zngxShowPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="zngxArr"
|
||||
@confirm="function(val){formData.zngx=val;zngxShowPicker=false}"
|
||||
@cancel="zngxShowPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
</van-cell-group>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<span class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
作品信息</span>
|
||||
<p class="van-doc-demo-block__title" style="margin-top: 5px;color: red">
|
||||
(如同时参加以下多个活动，或有多个主题，请分别提交)</p>
|
||||
|
||||
</div>
|
||||
<van-tabs v-model="formData.hdlb_i" :color="boxData.hdcolor" type="line">
|
||||
<van-tab v-for="lb,i in boxData.lbs" :name="i" :title="lb.lname">
|
||||
<div v-if="formData.hdlb_i==i">
|
||||
<van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="fd[i].zpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>
|
||||
<van-field
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="fd[i].zplb_name"
|
||||
label="作品类别"
|
||||
placeholder="点击选择作品类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择作品类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
value-key="zname"
|
||||
:columns="lb.zplbs"
|
||||
@confirm="function(val){fd[i].zplb=val.zid;fd[i].zplb_name=val.zname;showPicker=false}"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field type="textarea" show-word-limit maxlength="100" autosize
|
||||
v-model="fd[i].zpms"
|
||||
label="作品介绍"
|
||||
placeholder="介绍"></van-field>
|
||||
|
||||
<van-field label="图  片" disabled placeholder="（左滑删除单个文件）"
|
||||
style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="img,idx in fd[i].imgList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;height: 25vm;padding-right: 0;" autosize
|
||||
v-model="img.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(img.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="fd[i].imgList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false" :before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="5"
|
||||
v-model="fd[i].imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field label-width="150" label="音/视频、文档" disabled style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="video,idx in fd[i].videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">
|
||||
{{video.file.name}}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;padding-right: 0;" autosize v-model="video.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(video.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="fd[i].videoList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="vue.$toast.fail('文件大小不能超过200M！')"
|
||||
:max-size="209715200"
|
||||
:before-read="beforeReadVideo" accept="*" :max-count="2"
|
||||
v-model="fd[i].videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
</div>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
<span style="padding-left: 15px;font-size: 12px;color: rgb(160,160,160)">（注意：图片最多5张，视频最大200M。）</span>
|
||||
<div style="margin: 16px;">
|
||||
<van-button round block :color="boxData.hdcolor" type="info"
|
||||
native-type="submit">
|
||||
提交
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</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-item icon="edit">报名</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<script src="https://cdn.staticfile.org/js-cookie/2.2.1/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: {},
|
||||
zngxArr: ['父亲', '母亲', '第三代'],
|
||||
znxbShowPicker: false,
|
||||
zngxShowPicker: false,
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
hdzplx: '1',
|
||||
formData: {
|
||||
hdlb_i: 0,
|
||||
},
|
||||
formData2: {
|
||||
hdsbzpzt: '',
|
||||
hdsbzpms: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
},
|
||||
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: {
|
||||
onConfirm: function (value) {
|
||||
this.formData.hdzplx2 = value.zname;
|
||||
this.showPicker = false;
|
||||
},
|
||||
getPlaceholder: function (formData, key) {
|
||||
if (vue.isNull(formData.userid)) {
|
||||
return "输入工资号后自动匹配"
|
||||
} else {
|
||||
if (vue.isNull(formData[key])) {
|
||||
return '暂无'
|
||||
}
|
||||
return formData[key]
|
||||
}
|
||||
},
|
||||
doInput: function (val) {
|
||||
vue.$set(vue.formData, 'username', undefined)
|
||||
vue.$set(vue.formData, 'unionname', undefined)
|
||||
vue.$set(vue.formData, 'userid', undefined)
|
||||
$.get("/platform/hd/wm/wmMobile/queryUserByLoginname", {loginname: val}, function (data) {
|
||||
if (data.code == 0) {
|
||||
if (!vue.isNull(data.data)) {
|
||||
vue.$set(vue.formData, 'userid', data.data.id)
|
||||
vue.$set(vue.formData, 'username', data.data.username)
|
||||
vue.$set(vue.formData, 'unionname', data.data.unionname)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
doSubmit: function () {
|
||||
if (vue.isNull(vue.formData.userid)) {
|
||||
vue.$toast.fail("请正确填写您的工资号！")
|
||||
return
|
||||
}
|
||||
if (vue.hdzplx == 1 && vue.formData.videoList.length == 0 && vue.formData.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
} else if (vue.hdzplx == 2 && vue.formData2.videoList.length == 0 && vue.formData2.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
}
|
||||
|
||||
var str = vue.hdzplx == 1 ? '巾帼担当篇' : '巾帼温馨篇'
|
||||
|
||||
vue.$dialog.confirm({
|
||||
title: '提醒',
|
||||
message: '您当前选择的是“' + str + '”，是否确认上传？上传后您将不能对已上传的作品进行更改'
|
||||
}).then(function (value) {
|
||||
|
||||
}).catch(function (reason) {
|
||||
|
||||
});
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadImg: function (file) {
|
||||
return true;
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadVideo: function (file, detail) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
vue.$toast('获取不到后缀名！');
|
||||
return false;
|
||||
}
|
||||
// var type = suffix.toString().substring(suffix.lastIndexOf(".") + 2)
|
||||
// if (vue.videotype.indexOf(type) == -1 && vue.audiotype.indexOf(type) == -1 && vue.doctype.indexOf(type) == -1) {
|
||||
// vue.$toast('不支持的文件类型！');
|
||||
// return false;
|
||||
// }
|
||||
return true;
|
||||
},
|
||||
},
|
||||
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: [],
|
||||
lbs: [{lname: '活动类别1', zplbs: [{zname: '作品类别1'}, {zname: '作品类别2'}]}, {
|
||||
lname: '活动类别2',
|
||||
zplbs: [{zname: '作品类别1'}, {zname: '作品类别2'}]
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
this.boxData.lbs.forEach(function (lb, idx) {
|
||||
self.fd.push({
|
||||
zpzt: '',
|
||||
zpms: '',
|
||||
zplb: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
})
|
||||
})
|
||||
self.formData.hdlb_i = 0
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,858 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
.tpa {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
width: 12%;
|
||||
color: #a0a9b4;
|
||||
background-color: rgb(250, 250, 250);
|
||||
border: 1px solid rgb(220, 220, 220);
|
||||
}
|
||||
|
||||
.tpb {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
color: #4f576b;
|
||||
width: 15%;
|
||||
border: 1px solid rgb(220, 220, 220);
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__header i {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__body {
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
/*video{
|
||||
width: 100%!important;
|
||||
height: 500px!important;
|
||||
outline:none;
|
||||
}*/
|
||||
.video-js {
|
||||
width: 100%;
|
||||
height: 450px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.vjs-tech, .video-js button {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#app .el-table th.gutter {
|
||||
display: table-cell !important
|
||||
}
|
||||
|
||||
.filedialog .el-dialog {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
|
||||
.video-js .vjs-big-play-button { /* 中间大的播放按钮 */
|
||||
font-size: 2.5em;
|
||||
line-height: 2.3em;
|
||||
height: 2.5em;
|
||||
width: 2.5em;
|
||||
-webkit-border-radius: 2.5em;
|
||||
-moz-border-radius: 2.5em;
|
||||
border-radius: 2.5em;
|
||||
background-color: rgba(115, 133, 159, .5);
|
||||
border-width: 0.12em;
|
||||
margin-top: -1.25em;
|
||||
margin-left: -1.75em;
|
||||
}
|
||||
|
||||
.video-js.vjs-paused .vjs-big-play-button { /* 视频暂停时显示播放按钮 */
|
||||
display: block;
|
||||
}
|
||||
|
||||
.video-js.vjs-error .vjs-big-play-button { /* 视频加载出错时隐藏播放按钮 */
|
||||
display: none;
|
||||
}
|
||||
|
||||
.vjs-loading-spinner { /* 加载圆圈 */
|
||||
font-size: 2.5em;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
margin-top: -1em;
|
||||
margin-left: -1.5em;
|
||||
}
|
||||
|
||||
.el-image {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #abc5df;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #e5edf6;
|
||||
}
|
||||
|
||||
.view-myvideo-tab {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #C0C4CC;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-camera-solid {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-play {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-video-camera-solid, .view-myvideo-tab .el-icon-video-play, .view-myvideo-tab .el-icon-document {
|
||||
color: #000000;
|
||||
line-height: 80px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-download {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.el-icon-video-play {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-dialog__body {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.el-icon-download {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.file-down-span {
|
||||
background: black;
|
||||
opacity: 0.5;
|
||||
z-index: 1000;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
/*position: absolute;*/
|
||||
position: relative;
|
||||
bottom: -100px;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-down-span:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-icon-circle-close {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.el-image-viewer__wrapper {
|
||||
z-index: 99999 !important;
|
||||
}
|
||||
|
||||
.el-col > .el-cascader, .el-col > .el-select, .el-col > .el-date-editor {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/video/css/video-js.min.css">
|
||||
<script src="${base!}/assets/platform/plugins/video/js/video.min.js"></script>
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<el-row>
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="6">
|
||||
<!-- <el-cascader placeholder="请选择活动主题"-->
|
||||
<!-- v-model="pageForm.hdids" :options="hdxxlist" @change="hdchange"-->
|
||||
<!-- clearable></el-cascader>-->
|
||||
<el-date-picker v-model="pageForm.year"
|
||||
placeholder="年度"
|
||||
type="year"
|
||||
@change="yearChange"
|
||||
value-format="yyyy"></el-date-picker>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.hdid" @change="hdchange" clearable>
|
||||
<el-option v-for="i in hdxxlist"
|
||||
:key="i.value"
|
||||
:label="i.label"
|
||||
:value="i.value"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.hdlb" placeholder="请选择活动类型" clearable @change="hdlbchange">
|
||||
<el-option v-for="o in hdlblist" :label="o.lname" :value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.zplb" placeholder="请选择作品类型" clearable>
|
||||
<el-option v-for="o in hdzplblist" :label="o.zname" :value="o.zid"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20" class="mt20">
|
||||
<el-col :span="6">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword"
|
||||
@keyup.enter.native="doSearch" clearable>
|
||||
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型"
|
||||
clearable
|
||||
style="width: 120px">
|
||||
<el-option label="教职工姓名" value="sbr.username"></el-option>
|
||||
<el-option label="工资号" value="sbr.loginname"></el-option>
|
||||
<el-option label="子女姓名" value="xx.znxm"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select v-if="hasSuperAdminOrXghRole" placeholder="所属工会" v-model="pageForm.union"
|
||||
style="width: 200px;"
|
||||
clearable="true"
|
||||
filterable="true" @change="unionChange">
|
||||
<el-option v-for="item in unions" :label="item.unionname" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unit" style="width: 200px;" clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name" :value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-row>
|
||||
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-table :data="tableData">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center" width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zpzt" label="作品主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="znxm" label="子女姓名" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="sbrname" label="教职工姓名" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zngx" label="与子女关系" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center" sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center" sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center" align="center" sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<!-- <el-table-column prop="zplbname" label="作品类别" header-align="center" align="center" sortable-->
|
||||
<!-- show-overflow-tooltip></el-table-column>-->
|
||||
<el-table-column prop="sbsj" label="上传时间" header-align="center" align="center" sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="100">
|
||||
<template slot-scope="scope">
|
||||
|
||||
<el-dropdown @command="dropdownCommand">
|
||||
<el-button plain size="mini">
|
||||
<i class="ti-settings"></i>
|
||||
<span class="ti-angle-down"></span>
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item :command="{action:viewInfo,value:scope}">
|
||||
查看
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:command="{action:dodelete,value:scope.row.id}">
|
||||
删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<!-- <template #view>
|
||||
<table style="width: 100%">
|
||||
<tr style="border: 1px solid rgb(220, 220, 220);">
|
||||
<td colspan="4"
|
||||
style="text-align: center;padding: 10px;background-color: #0e78c5;color: white;font-size: 18px;font-weight:500">
|
||||
作品信息
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">姓名</td>
|
||||
<td class="tpb">{{viewData.sbrname}}</td>
|
||||
<td class="tpa">工资号</td>
|
||||
<td class="tpb">{{viewData.loginname}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">单位</td>
|
||||
<td class="tpb">{{viewData.dwname}}</td>
|
||||
<td class="tpa">工会</td>
|
||||
<td class="tpb">{{viewData.ghname}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">子女姓名</td>
|
||||
<td class="tpb">{{viewData.znxm}}</td>
|
||||
<td class="tpa">子女年龄</td>
|
||||
<td class="tpb">{{viewData.znnl}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">子女性别</td>
|
||||
<td class="tpb">{{viewData.znxb}}</td>
|
||||
<td class="tpa">关系</td>
|
||||
<td class="tpb">{{viewData.zngx}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">活动类别</td>
|
||||
<td class="tpb">
|
||||
<span>{{viewData.hdlbname}}</span>
|
||||
</td>
|
||||
<td class="tpa">作品类别</td>
|
||||
<td class="tpb">
|
||||
<span>{{viewData.zplbname}}</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">作品主题</td>
|
||||
<td class="tpb" colspan="3">{{viewData.zpzt}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">作品描述</td>
|
||||
<td class="tpb" colspan="3">{{viewData.zpms}}</td>
|
||||
</tr>
|
||||
<tr style="border: 1px solid rgb(220,220,220);">
|
||||
<td class="tpa">作品信息</td>
|
||||
<td class="tpb" colspan="3">
|
||||
<el-row>
|
||||
<el-divider>照片 <i class="el-icon-picture-outline"></i></el-divider>
|
||||
<div style="text-align: left;" v-if="img2List.length>0">
|
||||
<div v-for="item in img2List"
|
||||
style="display: inline-block;width: 100px;margin-right:10px">
|
||||
<el-image lazy :z-index="999999999"
|
||||
style="width: 100px;height: 100px;"
|
||||
:src="item.url"
|
||||
:preview-src-list="prevImgList">
|
||||
</el-image>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有照片。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-divider>视频 <i class="el-icon-video-camera"></i></el-divider>
|
||||
<div style="text-align: left;" v-if="videoList.length>0">
|
||||
<div v-for="item in videoList">
|
||||
<el-tooltip class="item" effect="dark" placement="right-start">
|
||||
<div slot="content">{{item.fjname}}</div>
|
||||
<div class="view-myvideo-tab">
|
||||
<div class="video-toggle-i"
|
||||
@click="playVideo('${AppFileDomain!}'+item.filepath)">
|
||||
<i class="el-icon-video-camera-solid"></i>
|
||||
<i class="el-icon-video-play"></i>
|
||||
</div>
|
||||
|
||||
<span class="file-down-span"
|
||||
style="bottom: 0;height: 20px;display: inline-block;"
|
||||
@click="dd3s.download(item.filepath,item.filename)">
|
||||
<i class="el-icon-download"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有视频。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-divider>音频 <i class="el-icon-video-camera"></i></el-divider>
|
||||
<div style="text-align: left;" v-if="audioList.length>0">
|
||||
<div v-for="item in audioList">
|
||||
<audio id="amusic" preload="auto" controls style="width: 100%;outline: none;">
|
||||
<source :src="'${AppFileDomain!}'+item.filepath"/>
|
||||
</audio>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有音频。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-divider>文档 <i class="el-icon-document-copy"></i></el-divider>
|
||||
<div style="text-align: left;" v-if="docList.length>0">
|
||||
<div v-for="item in docList">
|
||||
<el-tooltip class="item" effect="dark" placement="right-start">
|
||||
<div slot="content">{{item.fjname}}</div>
|
||||
<div class="view-myvideo-tab" style="background-color: #f6f6f6">
|
||||
<div class="video-toggle-i" @click="dd3s.preview(item.filepath,item.id)">
|
||||
<i class="el-icon-document"></i>
|
||||
</div>
|
||||
|
||||
<span class="file-down-span"
|
||||
style="bottom: 0;height: 20px;display: inline-block;"
|
||||
@click="dd3s.download(item.filepath,item.filename)">
|
||||
<i class="el-icon-download"></i>
|
||||
</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有文档。
|
||||
</div>
|
||||
</el-row>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</template>-->
|
||||
<template #view>
|
||||
|
||||
<el-form label-suffix=":" label-position="left" style="padding: 40px" label-width="110px">
|
||||
<el-form-item class="item-center"></el-form-item>
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="基础信息"></vi-title>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="姓名">{{viewData.sbrname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="工资号">{{viewData.loginname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="单位">{{viewData.dwname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="工会">{{viewData.ghname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="子女性别">{{viewData.znxb}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="关系">{{viewData.zngx}}</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="作品信息"></vi-title>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="活动类别">{{viewData.hdlbname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="作品类别">{{viewData.zplbname}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-form-item label="作品主题">{{viewData.zpzt}}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="作品描述">{{viewData.zpms}}</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="照片"></vi-title>
|
||||
<div style="text-align: left;" v-if="img2List.length>0">
|
||||
<div v-for="item in img2List"
|
||||
style="display: inline-block;width: 100px;margin-right:10px">
|
||||
<el-image lazy :z-index="999999999"
|
||||
style="width: 100px;height: 100px;"
|
||||
:src="item.url"
|
||||
:preview-src-list="prevImgList">
|
||||
</el-image>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有照片。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="视频"></vi-title>
|
||||
<div style="text-align: left;" v-if="videoList.length>0">
|
||||
<div v-for="item in videoList">
|
||||
<el-tooltip class="item" effect="dark" placement="right-start">
|
||||
<div slot="content">{{item.fjname}}</div>
|
||||
<div class="view-myvideo-tab">
|
||||
<div class="video-toggle-i"
|
||||
@click="playVideo(item.url)">
|
||||
<i class="el-icon-video-camera-solid"></i>
|
||||
<i class="el-icon-video-play"></i>
|
||||
</div>
|
||||
|
||||
<span class="file-down-span"
|
||||
style="bottom: 0;height: 20px;display: inline-block;"
|
||||
@click="dd3s.download(item.filepath,item.filename)">
|
||||
<i class="el-icon-download"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有视频。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="音频"></vi-title>
|
||||
<div style="text-align: left;" v-if="audioList.length>0">
|
||||
<div v-for="item in audioList">
|
||||
<audio id="amusic" preload="auto" controls style="width: 100%;outline: none;">
|
||||
<!-- <source :src="https://cdn.moefe.org/music/mp3/thing.mp3" />-->
|
||||
<source :src="item.url"/>
|
||||
</audio>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有音频。
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
|
||||
<el-row gutter="40">
|
||||
<vi-title title="文档"></vi-title>
|
||||
<div style="text-align: left;" v-if="docList.length>0">
|
||||
<div v-for="item in docList">
|
||||
<el-tooltip class="item" effect="dark" placement="right-start">
|
||||
<div slot="content">{{item.fjname}}</div>
|
||||
<div class="view-myvideo-tab" style="background-color: #f6f6f6">
|
||||
<div class="video-toggle-i" @click="dd3s.preview(item.filepath,item.id)">
|
||||
<i class="el-icon-document"></i>
|
||||
</div>
|
||||
|
||||
<span class="file-down-span"
|
||||
style="bottom: 0;height: 20px;display: inline-block;"
|
||||
@click="dd3s.download(item.filepath,item.filename)">
|
||||
<i class="el-icon-download"></i>
|
||||
</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else style="text-align: center;color: #c2bbbb;font-size: 10px;">
|
||||
没有文档。
|
||||
</div>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
<el-dialog title="查看详情" :visible.sync="viewDialogVisible" style="z-index: 99" width="60%"
|
||||
:close-on-click-modal="false" class="ckdialogclass" top="1%">
|
||||
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog :visible.sync="fileDialogVisible" class="filedialog" @close="filedialogClose"
|
||||
:close-on-click-modal="false">
|
||||
<div id="videoContainer"></div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
unions: [],
|
||||
units: [],
|
||||
|
||||
currenttime: moment().format('YYYY-MM-DD HH:MM:SS'),
|
||||
candelete: false,
|
||||
hasSuperAdminRole: "${@shiro.hasRole('sysadmin')}" === 'true' ? true : false,
|
||||
hasSuperAdminOrXghRole: "${@shiro.hasAnyRoles('sysadmin','A06')}" === 'true' ? true : false,
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
hdid: '',
|
||||
hdlb: '',
|
||||
zplb: '',
|
||||
searchName: 'sbr.username',
|
||||
searchKeyword: '',
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
},
|
||||
videoSrc: '',
|
||||
viewDialogVisible: false,
|
||||
fileDialogVisible: false,
|
||||
imgSrc: '',
|
||||
fileList: [],
|
||||
viewData: {},
|
||||
imgtype: ['gif', 'jpg', 'png', 'jpeg'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg'],
|
||||
doctype: ['doc', 'docx'],
|
||||
audiotype: ['mp3', 'wma', 'flac', 'wav', 'm4a', 'amr', 'au'],
|
||||
prevImgList: [],
|
||||
img2List: [],
|
||||
videoList: [],
|
||||
docList: [],
|
||||
audioList: [],
|
||||
hdxxlist: [],
|
||||
hdlblist: [],
|
||||
hdzplblist: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
yearChange(val) {
|
||||
let activityList = []
|
||||
if (val === null) {
|
||||
this.yearActivityList.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
} else {
|
||||
let enen = this.yearActivityList.filter(v => v.value == val)
|
||||
enen.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
}
|
||||
|
||||
this.hdxxlist = activityList
|
||||
this.$set(this.pageForm, "hdid", null)
|
||||
this.$set(this.pageForm, "hdlb", null)
|
||||
this.$set(this.pageForm, "zplb", null)
|
||||
},
|
||||
dropdownCommand({action, value}) {
|
||||
if (action) action(value)
|
||||
},
|
||||
|
||||
async unionChange() {
|
||||
this.$set(this.pageForm, "unit", null)
|
||||
this.units = await getUnits(this.pageForm.union)
|
||||
},
|
||||
|
||||
pageData() {
|
||||
sublime.showLoadingbar();
|
||||
$.post('/platform/hd/childhd/zpxx/pageData', this.pageForm).then(res => {
|
||||
sublime.closeLoadingbar();
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.list;
|
||||
this.pageForm.totalCount = res.data.totalCount;
|
||||
}
|
||||
});
|
||||
},
|
||||
pageSizeChange: function (val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
doSearch: function () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
viewInfo(scope) {
|
||||
this.img2List = [];
|
||||
this.prevImgList = [];
|
||||
this.videoList = [];
|
||||
this.audioList = [];
|
||||
this.docList = [];
|
||||
this.viewData = scope.row;
|
||||
$.post(base + '/platform/hd/childhd/zpxx/findOneById', {id: scope.row.id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
data.data.forEach(val => {
|
||||
val.fjname = val.filename
|
||||
val.fjurl = val.filepath
|
||||
val.url = FILE_DOMAIN+'/fileStreamPreview?id='+val.id
|
||||
let filetype = val.fjname.substring(val.fjname.lastIndexOf('.') + 1, val.fjname.length).toLowerCase();
|
||||
if (this.videotype.indexOf(filetype) > -1) {
|
||||
this.videoList.push(val);
|
||||
} else if (this.imgtype.indexOf(filetype) > -1) {
|
||||
this.prevImgList.push(FILE_DOMAIN+'/fileStreamPreview?id='+val.id)
|
||||
this.img2List.push(val);
|
||||
} else if (this.doctype.indexOf(filetype) > -1) {
|
||||
this.docList.push(val);
|
||||
} else if (this.audiotype.indexOf(filetype) > -1) {
|
||||
this.audioList.push(val);
|
||||
}
|
||||
});
|
||||
// this.viewDialogVisible = true
|
||||
this.$refs.guava.view()
|
||||
}
|
||||
});
|
||||
},
|
||||
playVideo(fjurl) {
|
||||
this.fileDialogVisible = true;
|
||||
this.videoShow = true;
|
||||
this.$nextTick(function () {
|
||||
let vc = document.getElementById('videoContainer');
|
||||
let newVideo = document.createElement("div");//创建一个标签
|
||||
newVideo.innerHTML = '<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"></video>';
|
||||
vc.appendChild(newVideo);
|
||||
let option = {autoplay: false, language: 'zh-CN'};
|
||||
let myPlayer = videojs('my-video', option, function onPlayerReady() {
|
||||
let myPlayer = this;
|
||||
myPlayer.src({src: fjurl, type: "video/mp4"});
|
||||
/*videojs.log("播放器已经准备好了!");*/
|
||||
//this.play();
|
||||
});
|
||||
})
|
||||
},
|
||||
filedialogClose() {
|
||||
//关闭的时候需要销毁video 但是随之dom元素也会被删除！！！！
|
||||
this.imgShow = false;
|
||||
this.videoShow = false;
|
||||
videojs('my-video').dispose();
|
||||
},
|
||||
downLoad: function (item) {
|
||||
window.open('/platform/hd/wmhd/download?filepath=' + item.fjurl + '&filename=' + item.fjname + "&username=" + this.ckusername);
|
||||
},
|
||||
YlDoc: function (item) {
|
||||
var self = this;
|
||||
window.open('/platform/hd/wmhd/YlDoc?fjurl=' + item.fjurl);
|
||||
},
|
||||
exportExcel() {
|
||||
let hdid = this.pageForm.hdid;
|
||||
if (hdid === '') {
|
||||
this.$message.warning('请先选择活动主题');
|
||||
return;
|
||||
}
|
||||
let hdarr = this.hdxxlist.filter(o => {
|
||||
return o.hdid == hdid;
|
||||
});
|
||||
let hdname = hdarr[0].hdname;
|
||||
window.open('/platform/hd/childhd/zpxx/exportExcel?hdid=' + hdid + '&hdname=' + hdname);
|
||||
},
|
||||
initHdxxlist() {
|
||||
$.post(base + '/platform/hd/childhd/zpxx/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.yearActivityList = data.data
|
||||
let activityList = []
|
||||
data.data.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
this.hdxxlist = activityList
|
||||
}
|
||||
});
|
||||
},
|
||||
hdchange(v) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: v}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
hdlbchange(id) {
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
yearChange(val) {
|
||||
let activityList = []
|
||||
if (val === null) {
|
||||
this.yearActivityList.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
} else {
|
||||
let enen = this.yearActivityList.filter(v => v.value == val)
|
||||
enen.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
}
|
||||
|
||||
this.hdxxlist = activityList
|
||||
this.$set(this.pageForm, "hdid", null)
|
||||
this.$set(this.pageForm, "hdlb", null)
|
||||
this.$set(this.pageForm, "zplb", null)
|
||||
},
|
||||
dodelete(id) {
|
||||
|
||||
this.$confirm('此操作将永久删除该记录, 确定吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
$.post('/platform/hd/childhd/zpxx/dodelete', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.doSearch();
|
||||
this.$message.success(data.msg);
|
||||
}
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'pageForm.hdid'(val) {
|
||||
this.$set(this.pageForm, "hdlb", null)
|
||||
this.$set(this.pageForm, "zplb", null)
|
||||
},
|
||||
'pageForm.hdlb'(val) {
|
||||
this.$set(this.pageForm, "zplb", null)
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.initHdxxlist();
|
||||
this.pageData();
|
||||
if (this.hasSuperAdminRole) {
|
||||
this.candelete = true;
|
||||
}
|
||||
|
||||
this.unions = await getUnions()
|
||||
this.units = await getUnits()
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,169 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.hdid" placeholder="请选择活动主题"
|
||||
filterable clearable style="width: 300px">
|
||||
<el-option
|
||||
v-for="item in activityList"
|
||||
:key="item.hdid"
|
||||
:label="item.hdname"
|
||||
:value="item.hdid">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button ">
|
||||
<el-date-picker
|
||||
v-model="pageForm.year" :clearable="false"
|
||||
type="date" style="width: 180px"
|
||||
value-format="yyyy-MM-dd"
|
||||
placeholder="选择日期">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.username" style="width: 200px">
|
||||
<template slot="prepend">上传人</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.unitId" placeholder="请选择所属单位"
|
||||
filterable clearable style="width: 240px">
|
||||
<el-option
|
||||
v-for="item in unitOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.unionId" placeholder="请选择所属工会"
|
||||
filterable clearable style="width: 240px">
|
||||
<el-option
|
||||
v-for="item in unionOptions"
|
||||
:key="item.id"
|
||||
:label="item.unionname"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-table :data="tableData" header-align="center" style="width: 100%">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" show-overflow-tooltip="true" align="center"></el-table-column>
|
||||
<el-table-column prop="username" label="签到次数" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column label="操作" width="300" header-align="center" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="danger" size="mini" @click="doDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
</guava>
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
var self = this
|
||||
return {
|
||||
dialogVisible: false,
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
year: moment().format('YYYY-MM-DD'),
|
||||
searchName: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unitId: '',
|
||||
unionId: '',
|
||||
username: '',
|
||||
},
|
||||
unionOptions: [],
|
||||
unitOptions: [],
|
||||
clickRow: {},
|
||||
activityList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async doSearch () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
await this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
}
|
||||
,
|
||||
pageSizeChange: function (val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
async pageData () {//加载分页数据
|
||||
var self = this;
|
||||
sublime.showLoadingbar();//显示loading
|
||||
await $.post(base + "/platform/hd/checkinManage/getUploadInfo", self.pageForm, function (data) {
|
||||
sublime.closeLoadingbar();//关闭loading
|
||||
if (data.code === 0) {
|
||||
self.tableData = data.data.list;
|
||||
self.pageForm.totalCount = data.data.totalCount;
|
||||
} else {
|
||||
self.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
async getAllActivity() {
|
||||
const {data} = await $.post('/platform/hd/checkinManage/getAllActivity')
|
||||
this.activityList = data
|
||||
if (this.activityList && this.activityList.length > 0) {
|
||||
this.pageForm.hdid = this.activityList[0].hdid
|
||||
}
|
||||
}
|
||||
},
|
||||
async created () {
|
||||
this.unionOptions = await getUnions(null)
|
||||
this.unitOptions = await getUnits(null)
|
||||
await this.pageData();
|
||||
await this.getAllActivity()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,184 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.hdid" placeholder="请选择活动主题"
|
||||
filterable style="width: 300px">
|
||||
<el-option
|
||||
v-for="item in activityList"
|
||||
:key="item.hdid"
|
||||
:label="item.hdname"
|
||||
:value="item.hdid">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button ">
|
||||
<el-date-picker
|
||||
v-model="time" style="width: 340px" :clearable="false"
|
||||
type="daterange" value-format="yyyy-MM-dd"
|
||||
range-separator="至" format="yyyy-MM-dd"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期">
|
||||
</el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.username" style="width: 200px">
|
||||
<template slot="prepend">上传人</template>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.unitId" placeholder="请选择所属单位"
|
||||
filterable clearable style="width: 240px">
|
||||
<el-option
|
||||
v-for="item in unitOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button">
|
||||
<el-select v-model="pageForm.unionId" placeholder="请选择所属工会"
|
||||
filterable clearable style="width: 240px">
|
||||
<el-option
|
||||
v-for="item in unionOptions"
|
||||
:key="item.id"
|
||||
:label="item.unionname"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
|
||||
<div class="offscreen-right pull-right ml20">
|
||||
<el-button type="primary" @click="doExport">导出名单</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<el-table :data="tableData" header-align="center" style="width: 100%">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="username" label="上传人" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="count" sortable label="上传次数" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="unitname" sortable label="所属单位" header-align="center" align="center"></el-table-column>
|
||||
<el-table-column prop="unionname" sortable label="所属工会" header-align="center" align="center"></el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
var self = this
|
||||
return {
|
||||
time: [],
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
searchName: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
unitId: '',
|
||||
unionId: '',
|
||||
username: '',
|
||||
},
|
||||
unionOptions: [],
|
||||
unitOptions: [],
|
||||
activityList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
async doSearch () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
await this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
}
|
||||
,
|
||||
pageSizeChange: function (val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
async pageData () {//加载分页数据
|
||||
var self = this;
|
||||
if(this.time && this.time.length > 0){
|
||||
this.pageForm.start = this.time[0]
|
||||
this.pageForm.end = this.time[1]
|
||||
}
|
||||
sublime.showLoadingbar();//显示loading
|
||||
await $.post(base + "/platform/hd/checkinManage/summary/data", self.pageForm, function (data) {
|
||||
sublime.closeLoadingbar();//关闭loading
|
||||
if (data.code === 0) {
|
||||
self.tableData = data.data.list;
|
||||
self.pageForm.totalCount = data.data.totalCount;
|
||||
} else {
|
||||
self.$message({
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
async getAllActivity() {
|
||||
const {data} = await $.post('/platform/hd/checkinManage/getAllActivity')
|
||||
this.activityList = data
|
||||
if (this.activityList && this.activityList.length > 0) {
|
||||
this.pageForm.hdid = this.activityList[0].hdid
|
||||
this.time = [moment(this.activityList[0].hdkssj).format('YYYY-MM-DD'), moment(this.activityList[0].hdjssj).format('YYYY-MM-DD')]
|
||||
}
|
||||
},
|
||||
doExport() {
|
||||
if(this.time && this.time.length > 0) {
|
||||
this.pageForm.start = this.time[0]
|
||||
this.pageForm.end = this.time[1]
|
||||
}
|
||||
window.location.href = '/platform/hd/checkinManage/summary/doExport?id=' + this.pageForm.hdid + '&username=' + this.pageForm.username
|
||||
+ '&start=' + this.pageForm.start + '&end=' + this.pageForm.end + '&unitId=' + this.pageForm.unitId + '&unionId=' + this.pageForm.unionId
|
||||
}
|
||||
},
|
||||
async created () {
|
||||
this.unionOptions = await getUnions(null)
|
||||
this.unitOptions = await getUnits(null)
|
||||
await this.getAllActivity()
|
||||
await this.pageData();
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,233 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
.el-col > .el-cascader, .el-col > .el-select, .el-col > .el-date-editor {
|
||||
width: 100% !important;
|
||||
}
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<guava>
|
||||
<el-card shadow="never">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="6">
|
||||
<el-date-picker v-model="pageForm.year"
|
||||
placeholder="年度"
|
||||
type="year"
|
||||
@change="yearChange"
|
||||
value-format="yyyy"></el-date-picker>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.hdid">
|
||||
<el-option v-for="i in hdxxlist"
|
||||
:key="i.value"
|
||||
:label="i.label"
|
||||
:value="i.value"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6" v-if="hasSuperAdminOrXghRole">
|
||||
<el-select placeholder="所属工会" v-model="pageForm.union"
|
||||
style="width: 200px;"
|
||||
clearable="true"
|
||||
filterable="true" @change="unionChange">
|
||||
<el-option v-for="item in unions" :label="item.unionname"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unit" style="width: 200px;"
|
||||
clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
<el-row type="flex" :gutter="20" class="mt20">
|
||||
<el-col :span="6">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword"
|
||||
@keyup.enter.native="doSearch"
|
||||
clearable>
|
||||
<el-select v-model="pageForm.searchName" slot="prepend" placeholder="查询类型"
|
||||
style="width: 120px;"
|
||||
clearable>
|
||||
<el-option label="姓名" value="u.username"></el-option>
|
||||
<el-option label="工资号" value="u.loginname"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
|
||||
|
||||
</el-card>
|
||||
<el-card class="mt20" shadow="never">
|
||||
<vi-title2 title="获奖列表">
|
||||
<template #func>
|
||||
<el-button size="medium" @click="exportExcel(1)" type="primary">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出获奖人员名单
|
||||
</el-button>
|
||||
<el-button size="medium" @click="exportExcel(2)" v-if="hasSuperAdminOrXghRole"
|
||||
type="primary">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出分工会获奖信息
|
||||
</el-button>
|
||||
</template>
|
||||
</vi-title2>
|
||||
<el-table :data="tableData">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center"
|
||||
width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="username" label="姓名" header-align="center" align="center"
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="hjcount" label="获奖次数" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</guava>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
return {
|
||||
unions: [],
|
||||
units: [],
|
||||
|
||||
hasSuperAdminOrXghRole: "${@shiro.hasAnyRoles('sysadmin','A06')}" === 'true' ? true : false,
|
||||
pageForm: {
|
||||
year: new Date().getFullYear() + '',
|
||||
searchName: "u.username",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
hdid: ''
|
||||
},
|
||||
tableData: [],
|
||||
hdxxlist: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/*hdchange(v) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: v}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},*/
|
||||
async unionChange() {
|
||||
this.$set(this.pageForm, "unit", null)
|
||||
this.units = await getUnits(this.pageForm.union)
|
||||
},
|
||||
async pageData() {
|
||||
sublime.showLoadingbar();
|
||||
const data = await $.post(base + "/platform/hd/wmhdhjxx/pageData", this.pageForm)
|
||||
sublime.closeLoadingbar();
|
||||
if (data.code == 0) {
|
||||
this.tableData = data.data.list;
|
||||
this.pageForm.totalCount = data.data.totalCount;
|
||||
}
|
||||
|
||||
},
|
||||
pageSizeChange: function (val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
exportExcel: function (num) {
|
||||
var self = this;
|
||||
var hdid = self.pageForm.hdid;
|
||||
if (num === 1) {
|
||||
if (hdid === '') {
|
||||
self.$message.warning('请先选择活动主题');
|
||||
return;
|
||||
}
|
||||
}
|
||||
window.location.href = base + '/platform/hd/wmhdhjxx/exportExcel?num=' + num + '&hdid=' + hdid;
|
||||
},
|
||||
doSearch: function () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
yearChange(val) {
|
||||
this.$nextTick(() => {
|
||||
this.hdxxlist = []
|
||||
})
|
||||
this.$set(this.pageForm, "hdid", "")
|
||||
let activityList = []
|
||||
console.log(val)
|
||||
if (val === null) {
|
||||
this.yearActivityList.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
} else {
|
||||
let enen = this.yearActivityList.filter(v => v.value == val)
|
||||
enen.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.hdxxlist = activityList
|
||||
})
|
||||
},
|
||||
async initHdxxlist() {
|
||||
const resp = await $.post(base + '/platform/hd/wmhd/initHdxxlist')
|
||||
if (resp.code === 0) {
|
||||
this.yearActivityList = resp.data
|
||||
let activityList = []
|
||||
resp.data.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
this.hdxxlist = activityList
|
||||
if (this.hdxxlist) {
|
||||
this.pageForm.hdid = this.hdxxlist[0].value
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
await this.initHdxxlist();
|
||||
await this.pageData();
|
||||
this.unions = await getUnions()
|
||||
this.units = await getUnits()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,880 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" xmlns:v-slot="http://www.w3.org/1999/XSL/Transform">
|
||||
<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.staticfile.org/vant/2.12.5/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.staticfile.org/vue/2.6.9/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vant/2.12.5/vant.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/jquery/1.10.0/jquery.min.js"></script>
|
||||
<script src="/assets/platform/plugins/moment/moment.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/js-cookie/2.2.1/js.cookie.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;
|
||||
}
|
||||
|
||||
.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-nav-bar__content {
|
||||
background-color: #1867b0;
|
||||
}
|
||||
|
||||
.van-nav-bar__title, .van-icon-arrow-left::before {
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
<div v-clock id="app" v-if="showPage">
|
||||
<van-nav-bar title="教工作品征集" fixed placeholder safe-area-inset-top @click-left="history.back()"
|
||||
:left-arrow="leftArrow"></van-nav-bar>
|
||||
<div>
|
||||
<van-swipe v-if="boxData.files&&boxData.files.length>0" class="my-swipe" :autoplay="3000"
|
||||
indicator-color="white">
|
||||
<van-swipe-item v-for="bgi in boxData.files">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
:src="FILE_DOMAIN+'/fileStreamPreview?id='+bgi.id"
|
||||
></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>
|
||||
<div v-if="active==1" class="page-v">
|
||||
<div class="detail-v" style="margin-top: 0">
|
||||
<div class="weui-msg" v-if="showMsg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<van-circle
|
||||
layer-color="rgb(240,240,240)"
|
||||
color="#07c160"
|
||||
stroke-width="50"
|
||||
v-if="showPlan"
|
||||
v-model="percent"
|
||||
:rate="percent"
|
||||
:clockwise="false"
|
||||
:text="percent+' %'"
|
||||
></van-circle>
|
||||
<span v-if="showPlan==false">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-if="!flag" class="weui-icon-warn weui-icon_msg"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title" v-if="showPlan">上传中...</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&flag">上传成功!</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&!flag">上传失败!</h2>
|
||||
<div v-html="msg"></div>
|
||||
</div>
|
||||
<div class="weui-msg__opr-area">
|
||||
<p class="weui-btn-area">
|
||||
<a v-if="!showPlan" @click="showMsg=false"
|
||||
:class="flag?'weui-btn weui-btn_primary':'weui-btn weui-btn_warn'">{{flag ? '确定' : '返回'}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-v" v-else>
|
||||
<van-form>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title"
|
||||
:style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
基本信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
v-model="formData.loginname"
|
||||
readonly
|
||||
name="工资号"
|
||||
label="工资号"
|
||||
placeholder="工资号"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
v-model="formData.username"
|
||||
name="姓名"
|
||||
label="姓  名"
|
||||
></van-field>
|
||||
<van-field
|
||||
readonly
|
||||
v-model="formData.unitname"
|
||||
name="所属单位"
|
||||
label="所属单位"
|
||||
></van-field>
|
||||
<van-field
|
||||
required
|
||||
v-model="formData.mobile"
|
||||
name="mobile"
|
||||
label="手机号码" type="tel"
|
||||
placeholder="手机号码"
|
||||
:rules="[{ required: true, message: '请填写手机号码' }]"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<span class="van-doc-demo-block__title"
|
||||
:style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
作品信息</span>
|
||||
<p class="van-doc-demo-block__title" style="margin-top: 5px;color: red">
|
||||
(如同时参加以下多个活动，或有多个主题，请分别提交)</p>
|
||||
</div>
|
||||
<van-tabs v-model="formData.hdlb_i" :color="boxData.hdcolor" type="card">
|
||||
<van-tab v-for="lb,i in boxData.lbs" :name="i" :title="lb.lname">
|
||||
<div v-if="formData.hdlb_i==i">
|
||||
<!-- <van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="fd[i].zpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>-->
|
||||
<van-field
|
||||
v-if="lb.zplbs&&lb.zplbs.length>0"
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="fd[i].zplb_name"
|
||||
label="类别"
|
||||
placeholder="点击选择类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
value-key="zname"
|
||||
:columns="lb.zplbs"
|
||||
@confirm="(val) => {zplbClick(val, fd, i)}"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field
|
||||
required
|
||||
v-model="fd[i].zpmc"
|
||||
name="zpmc"
|
||||
label="标题"
|
||||
placeholder="请填写标题"
|
||||
:rules="[{ required: true, message: '请填写标题' }]"
|
||||
></van-field>
|
||||
|
||||
<van-field type="textarea" show-word-limit autosize
|
||||
:maxlength="chooseLb.maxWordCount ? chooseLb.maxWordCount : 100"
|
||||
v-model="fd[i].zpms"
|
||||
label="介绍"
|
||||
placeholder="请填写介绍"></van-field>
|
||||
<van-field type="digit" show-word-limit maxlength="10" autosize
|
||||
v-model="fd[i].step_count"
|
||||
v-if="lb.lname==='健步走'"
|
||||
label="健步走步数"
|
||||
placeholder="健步走步数"
|
||||
:rules="[{ required: true, message: '请填写健步走步数' }]"></van-field>
|
||||
|
||||
<template v-if="chooseLb.isUploadPhoto === true">
|
||||
<van-field label="图  片" readonly placeholder="（左滑删除单个文件）"
|
||||
style="border: none;" required
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="img,idx in fd[i].imgList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="imgDelete(idx,i,img.filepath)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false"
|
||||
:before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="chooseLb.photoNum"
|
||||
@oversize="$toast('图片大小不能超过' + chooseLb.photoSize + 'M')"
|
||||
:max-size="chooseLb.photoSize * 1048576"
|
||||
v-model="fd[i].imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<div style="margin-top: 10px;padding-left: 20px;font-size: 12px;color: rgb(160,160,160)">
|
||||
注意：图片最多{{ chooseLb.photoNum }}张，每张不超过{{ chooseLb.photoSize }}M，格式为{{chooseLb.photoType.toString()}}。
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-if="chooseLb.isUploadOther === true">
|
||||
<van-field label-width="150" label="音/视频、文档" readonly
|
||||
style="border: none;" required
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="(video,idx) in fd[i].videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">
|
||||
|
||||
{{video.filename ? video.filename : video.file.name
|
||||
}}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="videoDelete(idx,i,video.filepath)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field v-if="lb.lname!=='健步走'">
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="$toast('文件大小不能超过' + chooseLb.otherSize + 'M')"
|
||||
:max-size="chooseLb.otherSize * 1048576"
|
||||
:before-read="beforeReadVideo" accept="*"
|
||||
:max-count="chooseLb.otherFileNum"
|
||||
v-model="fd[i].videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<div style="margin-top: 10px;padding-left: 20px;font-size: 12px;color: rgb(160,160,160)">
|
||||
注意：文件最多{{ chooseLb.otherFileNum }}个，每个不超过{{ chooseLb.otherSize }}M，格式为{{chooseLb.otherType.toString()}}。
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
|
||||
<div style="margin: 16px;">
|
||||
<van-row gutter="20">
|
||||
<van-col span="12">
|
||||
<van-button :disabled="subDis" plain round block
|
||||
:color="boxData.hdcolor"
|
||||
type="info"
|
||||
@click="doSubmit(false)">
|
||||
保存
|
||||
</van-button>
|
||||
</van-col>
|
||||
<van-col span="12">
|
||||
<van-button :disabled="subDis" round block :color="boxData.hdcolor"
|
||||
type="info"
|
||||
@click="doSubmit(true)">
|
||||
提交
|
||||
</van-button>
|
||||
</van-col>
|
||||
|
||||
</van-row>
|
||||
|
||||
|
||||
</div>
|
||||
</van-form>
|
||||
</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"
|
||||
@change="activeChange"
|
||||
>
|
||||
<van-tabbar-item icon="label-o">介绍</van-tabbar-item>
|
||||
<van-tabbar-item icon="edit" >参加活动</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<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)
|
||||
}
|
||||
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data: function () {
|
||||
return {
|
||||
readytodelfile: [],
|
||||
leftArrow: false,
|
||||
boxData: {},
|
||||
subDis: false,
|
||||
showPage: false,
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
formData: {
|
||||
hdlb_i: 0,
|
||||
},
|
||||
fd: [],
|
||||
active: 0,
|
||||
isNull(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', 'xlsx', 'xls', 'txt'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg', 'quicktime'],
|
||||
chooseLb: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
zplbClick(val, fd, i) {
|
||||
this.chooseLb = val
|
||||
console.log(this.chooseLb)
|
||||
fd[i].zplb = val.zid;
|
||||
fd[i].zplb_name = val.zname;
|
||||
this.showPicker = false
|
||||
},
|
||||
activeChange(){
|
||||
if (this.subDis){
|
||||
this.active=0
|
||||
this.$toast.fail("不在活动时间范围内！");
|
||||
}
|
||||
},
|
||||
imgDelete(idx, i, filepath) {
|
||||
this.fd[i].imgList.splice(idx, 1)
|
||||
this.readytodelfile.push(filepath);
|
||||
},
|
||||
videoDelete(idx, i, filepath) {
|
||||
this.fd[i].videoList.splice(idx, 1)
|
||||
this.readytodelfile.push(filepath);
|
||||
}
|
||||
,
|
||||
onConfirm(value) {
|
||||
this.formData.hdzplx2 = value.zname;
|
||||
this.showPicker = false;
|
||||
}
|
||||
,
|
||||
getPlaceholder(formData, key) {
|
||||
if (this.isNull(formData.userid)) {
|
||||
return "输入工资号后自动匹配"
|
||||
} else {
|
||||
if (this.isNull(formData[key])) {
|
||||
return '暂无'
|
||||
}
|
||||
return formData[key]
|
||||
}
|
||||
}
|
||||
,
|
||||
async initUserInfo() {
|
||||
const userId = "${@shiro.getPrincipalProperty('id')}"
|
||||
const loginName = "${@shiro.getPrincipalProperty('loginname')}"
|
||||
const userName = "${@shiro.getPrincipalProperty('username')}"
|
||||
const unitName = "${@shiro.getPrincipalProperty('unit').getName()}"
|
||||
this.$set(this.formData, 'loginname', loginName)
|
||||
this.$set(this.formData, 'username', userName)
|
||||
this.$set(this.formData, 'unitname', unitName)
|
||||
this.$set(this.formData, 'userid', userId)
|
||||
this.$set(this.formData, 'mobile', "${@shiro.getPrincipalProperty('mobile')}")
|
||||
},
|
||||
async doSubmit(flag) {
|
||||
if (this.isNull(this.formData.userid)) {
|
||||
this.$toast.fail("请正确填写您的工资号！")
|
||||
return
|
||||
}
|
||||
const i = this.formData.hdlb_i
|
||||
|
||||
if(flag === true) {
|
||||
if(this.chooseLb.isUploadPhoto === true || this.chooseLb.isUploadOther === true) {
|
||||
if (this.fd[i].videoList.length == 0 || this.fd[i].imgList.length == 0) {
|
||||
this.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const msg = '您当前选择的是“' + this.boxData.lbs[i].lname + '”，是否确认上传？' + (flag ? '上传后您将不能对已上传的作品进行更改' : '保存后如需提交请到我的作品进行提交')
|
||||
const confirm = await this.$dialog.confirm({
|
||||
title: '提醒',
|
||||
message: msg
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
setTimeout(() => {
|
||||
this.showMsg = true
|
||||
this.showPlan = true
|
||||
this.percent = 0
|
||||
this.msg = ''
|
||||
|
||||
let formData1 = {}
|
||||
let formData2 = new FormData();
|
||||
formData1.flag = flag
|
||||
formData2.append("flag", flag)
|
||||
if (this.formData.id) {
|
||||
|
||||
this.$set(formData1, "id", getQueryVariable("zpid"))
|
||||
this.$set(formData1, "hdid", getQueryVariable("id"))
|
||||
this.$set(formData1, "hdsbrid", this.isNull(this.formData.userid) ? '' : this.formData.userid)
|
||||
this.$set(formData1, "mobile", this.isNull(this.formData.mobile) ? '' : this.formData.mobile)
|
||||
this.$set(formData1, "step_count", this.isNull(this.fd[i].step_count) ? '' : this.fd[i].step_count)
|
||||
this.$set(formData1, "zpmc", this.isNull(this.fd[i].zpmc) ? '' : this.fd[i].zpmc)
|
||||
this.$set(formData1, "hdzplx", this.isNull(this.boxData.lbs[i].lid) ? '' : this.boxData.lbs[i].lid)
|
||||
this.$set(formData1, "hdzplx2", this.isNull(this.fd[i].zplb) ? '' : this.fd[i].zplb)
|
||||
this.$set(formData1, "hdsbzpzt", this.isNull(this.fd[i].zpzt) ? '' : this.fd[i].zpzt)
|
||||
this.$set(formData1, "hdsbzpms", this.isNull(this.fd[i].zpms) ? '' : this.fd[i].zpms)
|
||||
//this.$set(formData1, "hdsbsj", moment().format('YYYY-MM-DD HH:mm:ss'))
|
||||
} else {
|
||||
|
||||
formData2.append("hdid", getQueryVariable("id"))
|
||||
formData2.append("hdsbrid", this.isNull(this.formData.userid) ? '' : this.formData.userid);
|
||||
formData2.append("mobile", this.isNull(this.formData.mobile) ? '' : this.formData.mobile);
|
||||
formData2.append("step_count", this.isNull(this.fd[i].step_count) ? '' : this.fd[i].step_count);
|
||||
formData2.append("zpmc", this.isNull(this.fd[i].zpmc) ? '' : this.fd[i].zpmc);
|
||||
formData2.append("hdzplx", this.isNull(this.boxData.lbs[i].lid) ? '' : this.boxData.lbs[i].lid)
|
||||
formData2.append("hdzplx2", this.isNull(this.fd[i].zplb) ? '' : this.fd[i].zplb);
|
||||
formData2.append("hdsbzpzt", this.isNull(this.fd[i].zpzt) ? '' : this.fd[i].zpzt);
|
||||
formData2.append("hdsbzpms", this.isNull(this.fd[i].zpms) ? '' : this.fd[i].zpms);
|
||||
this.fd[i].imgList.forEach(val => {
|
||||
formData2.append("files", val.file, this.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
this.fd[i].videoList.forEach(val => {
|
||||
formData2.append("files", val.file, this.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
})
|
||||
formData2.append("hdsbsj", moment().format('YYYY-MM-DD HH:mm:ss'));
|
||||
}
|
||||
if (!this.isNull(this.formData.id)) {
|
||||
formData2.append("data", JSON.stringify(formData1));
|
||||
formData2.append("flag", flag);
|
||||
formData2.append("readytodelfile", JSON.stringify(this.readytodelfile));
|
||||
this.fd[i].imgList.forEach(val => {
|
||||
formData2.append("file", val.file);
|
||||
});
|
||||
this.fd[i].videoList.forEach(val => {
|
||||
formData2.append("file", val.file);
|
||||
});
|
||||
$.ajax({
|
||||
url: "/platform/hd/jzghd/sczp/doEdit",
|
||||
type: "post",
|
||||
data: formData2,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
xhr: xhrOnProgress((e) => {
|
||||
if (e.total == 0) {
|
||||
this.percent = 0
|
||||
} else {
|
||||
this.percent = ((e.loaded / e.total) * 100).toFixed(0);//文件上传百分比
|
||||
}
|
||||
|
||||
}), success: function (data) {
|
||||
if (data.code === 0) {
|
||||
vue.fd[i].zplb = ''
|
||||
vue.fd[i].zplb_name = ''
|
||||
vue.fd[i].zpzt = ''
|
||||
vue.fd[i].zpms = ''
|
||||
vue.fd[i].step_count = ''
|
||||
vue.fd[i].zpmc = ''
|
||||
vue.fd[i].sbsj = ''
|
||||
vue.fd[i].imgList = []
|
||||
vue.fd[i].videoList = []
|
||||
vue.fd[i].audioList = []
|
||||
Cookies.remove('sa_formData');
|
||||
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">我们已收到您的作品！<br/>非常感谢您的支持！</p>'
|
||||
this.flag = true
|
||||
|
||||
|
||||
} else {
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
this.flag = false
|
||||
}
|
||||
vue.showPlan = false
|
||||
location.href = '/mobile/wmhd/list'
|
||||
},
|
||||
error: function (data) {
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
this.flag = false
|
||||
vue.showPlan = false
|
||||
}
|
||||
})
|
||||
} else {
|
||||
|
||||
$.ajax({
|
||||
url: "/platform/staffActivities/doSubmit",
|
||||
type: "post",
|
||||
data: formData2,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
xhr: xhrOnProgress((e) => {
|
||||
if (e.total == 0) {
|
||||
this.percent = 0
|
||||
} else {
|
||||
this.percent = ((e.loaded / e.total) * 100).toFixed(0);//文件上传百分比
|
||||
}
|
||||
|
||||
}),
|
||||
success: function (data) {
|
||||
if (data.code === 0) {
|
||||
vue.fd[i].zplb = ''
|
||||
vue.fd[i].zplb_name = ''
|
||||
vue.fd[i].zpzt = ''
|
||||
vue.fd[i].zpms = ''
|
||||
vue.fd[i].step_count = ''
|
||||
vue.fd[i].zpmc = ''
|
||||
vue.fd[i].sbsj = ''
|
||||
vue.fd[i].imgList = []
|
||||
vue.fd[i].videoList = []
|
||||
vue.fd[i].audioList = []
|
||||
Cookies.remove('sa_formData');
|
||||
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">我们已收到您的作品！<br/>非常感谢您的支持！</p>'
|
||||
|
||||
this.flag = true
|
||||
} else {
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
this.flag = false
|
||||
}
|
||||
vue.showPlan = false
|
||||
},
|
||||
error: function (data) {
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
this.flag = false
|
||||
vue.showPlan = false
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
}, 500)
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
,
|
||||
// 返回布尔值
|
||||
beforeReadImg: function (file) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
this.$toast('获取不到后缀名！')
|
||||
return false
|
||||
}
|
||||
const suf = file.name.split('.').pop().toLowerCase()
|
||||
if(this.chooseLb.photoType.indexOf(suf) === -1) {
|
||||
this.$toast('支持的图片类型：' + this.chooseLb.photoType.toString())
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
,
|
||||
// 返回布尔值
|
||||
beforeReadVideo: function (file, detail) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
this.$toast('获取不到后缀名！')
|
||||
return false
|
||||
}
|
||||
const suf = file.name.split('.').pop().toLowerCase()
|
||||
if(this.chooseLb.otherType.indexOf(suf) === -1) {
|
||||
this.$toast('支持的文件类型：' + this.chooseLb.otherType.toString())
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
,
|
||||
},
|
||||
async created() {
|
||||
this.initUserInfo()
|
||||
const zpid = GetQueryString("zpid")
|
||||
GetQueryString("client") === "mobile" ? this.leftArrow = true : this.leftArrow = false
|
||||
|
||||
if (window.innerWidth > 800) {
|
||||
this.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
|
||||
if (!this.isNull(getQueryVariable("id"))) {
|
||||
const data = await $.get("/platform/hd/wmhdMange/findOne", {hdid: getQueryVariable("id")})
|
||||
if (data.code == 0) {
|
||||
document.getElementsByTagName("title")[0].innerText = data.data.hdname;
|
||||
data.data.lbs.forEach((lb, idx) => {
|
||||
this.fd.push({
|
||||
zpzt: '',
|
||||
zpms: '',
|
||||
zplb: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
})
|
||||
})
|
||||
this.boxData = data.data
|
||||
this.formData.hdlb_i = 0
|
||||
this.showPage = true
|
||||
|
||||
if (!data.data.hdflag) {
|
||||
this.$toast.fail("当前活动未开启！");
|
||||
this.subDis = true
|
||||
} else {
|
||||
if (!(new Date(data.data.hdkssj.replace(/-/g, '/')).getTime() < new Date().getTime() && new Date().getTime() < new Date(data.data.hdjssj.replace(/-/g, '/')).getTime())) {
|
||||
this.$toast.fail("不在活动时间范围内！");
|
||||
this.subDis = true
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
if (!this.isNull(zpid)) {
|
||||
const {data, code, msg} = await $.get("/platform/hd/wmhd/findOneById", {id: zpid})
|
||||
const refs = await $.get("/mobile/wmhd/list/findOne", {id: zpid})
|
||||
this.$set(this.formData, "id", refs[0].id)
|
||||
this.$set(this.formData, "userid", refs[0].hdsbrid)
|
||||
this.$set(this.formData, "mobile", refs[0].mobile)
|
||||
this.$set(this.formData, "hdlb_i", refs[0].llocation - 1)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "step_count", this.isNull(refs[0].step_count) ? "" : refs[0].step_count)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "zpmc", this.isNull(refs[0].zpmc) ? "" : refs[0].zpmc)
|
||||
this.$set(this.boxData.lbs[refs[0].llocation - 1], "lid", refs[0].hdzplx)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "zplb", refs[0].hdzplx2)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "zplb_name", refs[0].zname)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "zpzt", refs[0].hdsbzpzt)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "hdsbsj", refs[0].hdsbsj)
|
||||
this.$set(this.fd[refs[0].llocation - 1], "zpms", refs[0].hdsbzpms)
|
||||
const o = this.boxData.lbs[0].zplbs.find(o => o.zid === refs[0].hdzplx2)
|
||||
|
||||
console.log(o)
|
||||
this.chooseLb = o !== undefined ? o : {}
|
||||
data.forEach((v, i) => {
|
||||
v.filename = v.filename
|
||||
v.fjurl = v.filepath
|
||||
v.url = FILE_DOMAIN + "/fileStreamPreview?id=" + v.id
|
||||
v.content = FILE_DOMAIN + "/fileStreamPreview?id=" + v.id
|
||||
const filetype = v.filename.substring(v.filename.lastIndexOf(".") + 1)
|
||||
const aa = this.audiotype.concat(this.videotype)
|
||||
const bb = this.doctype.concat(this.doctype)
|
||||
if (this.imgtype.indexOf(filetype) > -1) {
|
||||
this.fd[refs[0].llocation - 1].imgList.push(v)
|
||||
} else if (aa.indexOf(filetype) > -1) {
|
||||
this.fd[refs[0].llocation - 1].videoList.push(v);
|
||||
} else if (bb.indexOf(filetype) > -1) {
|
||||
this.fd[refs[0].llocation - 1].videoList.push(v);
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* if (Cookies.get("sa_formData") != undefined) {
|
||||
this.formData = JSON.parse(Cookies.get("sa_formData"))
|
||||
Cookies.remove('sa_formData');
|
||||
}*/
|
||||
|
||||
/*setInterval(() => {
|
||||
Cookies.set("sa_formData", JSON.stringify(this.formData))
|
||||
}, 1000)*/
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
function GetQueryString(name) {
|
||||
const reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
|
||||
const r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]);
|
||||
return "";
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,829 @@
|
||||
<!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.staticfile.org/vant/2.12.5/index.min.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.staticfile.org/vue/2.6.9/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vant/2.12.5/vant.js"></script>
|
||||
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.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;
|
||||
}
|
||||
|
||||
[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-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
src="/wxpic/hdwmx.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="active==0" class="page-v">
|
||||
<div class="detail-v">
|
||||
<div class="title-v p15">
|
||||
<h3 class="njuColor">活动介绍</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">  在全国上下众志成城、抗击疫情的关键时期，我们迎来了第110个“三八”国际劳动妇女节。在此，校工会和校女教职工委员会谨向辛勤耕耘、默默奉献的全校女教职工，特别是奋战在抗击疫情一线的广大女教职工，致以节日的问候、崇高的敬意和良好的祝愿！</p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">  在这个特别的日子来临之际，校工会和校女教职工委员会决定开展“共抗疫情
|
||||
巾帼展风采”线上主题活动，展现在抗疫期间我校广大女教职工助力抗疫、教学科研、守护家园的良好风貌，引领广大女教职工争做新时代奋斗者，激励广大女教职工坚定信心、共克时艰，为夺取疫情防控和实现学校发展目标双胜利贡献巾帼智慧和力量。</p>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 class="njuColor">参加人员</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">
|
||||
  我校在职女教职工。</p>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 class="njuColor">奖励方式</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">
|
||||
  参加活动的教职工在正式开学后可领取一至两份精美纪念品，欢迎大家积极参与。</p>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 class="njuColor">活动内容</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15">
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">
|
||||
  可自愿选择参加下列一项或两项活动，点击右下角“报名”进入活动页面提交相关材料。</p>
|
||||
<div>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">
|
||||
<span style=" font-weight:bold">（一）巾帼担当篇——女教职工工作风采征集</span></p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:20pt; widows:0">
|
||||
展现我校女教职工在<b>防控疫情</b>、<b>教学科研</b>、<b>服务保障</b>等方面的风采风貌<，以文字、书画、照片、音视频等作品形式记录和呈现。
|
||||
</p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:20pt; widows:0">
|
||||
文字材料文体不限，可选记叙、散文、诗歌等体裁，提交word版本；书画包括书法、国画、油画、水彩、钢笔画、数码绘画等形式，作品完成之后拍照上传；照片为JPEG格式，每张不小于2M；音视频不超过200M。
|
||||
</p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:0pt; widows:0">
|
||||
<span style=" font-weight:bold">（二）巾帼温馨篇——女教职工居家风采征集</span></p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:20pt; widows:0">
|
||||
征集我校女教职工居家抗疫的风采风貌，<b>拍摄温馨生活、体验烹饪乐趣、玩转创意手工、书写一封家书……</b>
|
||||
</p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:20pt; widows:0">
|
||||
“家书”提交word版本；其余三项活动均提交电子照片或视频，照片为JPEG格式，每张不小于2M，视频不超过200M。
|
||||
</p>
|
||||
<p style="line-height:24pt; margin:0pt; orphans:0; text-align:justify; text-indent:20pt; widows:0">
|
||||
（若您的手机不支持文件上传，请用电脑浏览器打开活动地址https://zhgh.nju.edu.cn/wmMobile参与活动，或发送到校工会邮箱gonghui@nju.edu.cn。）
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 class="njuColor">活动联系人</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15" style="line-height:24pt;">
|
||||
<p style="text-indent: 20pt;">李 菁：<a href="tel:13404167000">13404167000</a></p>
|
||||
<p style="text-indent: 20pt;">陈 颖：<a href="tel:18951625046">18951625046</a></p>
|
||||
<p style="text-indent: 20pt;">叶潇潇：<a href="tel:15951886628">15951886628</a></p>
|
||||
</div>
|
||||
<div class="title-v p15">
|
||||
<br/>
|
||||
<h3 class="njuColor">技术支持</h3>
|
||||
<div class="van-hairline--top"></div>
|
||||
<br/>
|
||||
</div>
|
||||
<div class="p15" style="line-height:24pt;">
|
||||
  上传作品过程中，如遇技术问题，请咨询：<br/>
|
||||
  王 维：<a href="tel:18272022215">18272022215</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="active==1" class="page-v">
|
||||
<div class="detail-v" style="margin-top: 0">
|
||||
<!-- <h3 style="padding: 5px 15px">战胜疫情，南京大学与您在一起</h3>-->
|
||||
<!-- <span style="font-size: 12px;color: rgb(160,160,160)">报名开始时间：2020-01-01 09:01:01</span> <br/>-->
|
||||
<!-- <span style="font-size: 12px;color: rgb(160,160,160)">报名结束时间：2020-01-01 09:01:01</span>-->
|
||||
|
||||
<div class="weui-msg" v-if="showMsg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<van-circle
|
||||
layer-color="rgb(240,240,240)"
|
||||
color="#07c160"
|
||||
stroke-width="50"
|
||||
v-if="showPlan"
|
||||
v-model="percent"
|
||||
:rate="percent"
|
||||
:clockwise="false"
|
||||
:text="percent+' %'"
|
||||
></van-circle>
|
||||
<span v-if="showPlan==false">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-if="!flag" class="weui-icon-warn weui-icon_msg"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title" v-if="showPlan">上传中...</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&flag">上传成功!</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&!flag">上传失败!</h2>
|
||||
<div v-html="msg"></div>
|
||||
</div>
|
||||
<div class="weui-msg__opr-area">
|
||||
<p class="weui-btn-area">
|
||||
<a v-if="!showPlan" @click="showMsg=false"
|
||||
:class="flag?'weui-btn weui-btn_primary':'weui-btn weui-btn_warn'">{{flag?'确定':'返回'}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-v" v-if="!showMsg">
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" style="font-weight: bolder;color: rgb(106, 0, 95)">
|
||||
基本信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
@input="doInput"
|
||||
required
|
||||
v-model="formData.loginname"
|
||||
name="工资号"
|
||||
label="工  号"
|
||||
placeholder="工资号"
|
||||
:rules="[{ required: true, message: '请填写工资号' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.username"
|
||||
name="姓名"
|
||||
label="姓  名"
|
||||
:placeholder="getPlaceholder(formData,'username')"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.unionname"
|
||||
name="所属工会"
|
||||
label="所属工会"
|
||||
:placeholder="getPlaceholder(formData,'unionname')"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<span class="van-doc-demo-block__title" style="font-weight: bolder;color: rgb(106, 0, 95)">
|
||||
作品信息</span>
|
||||
<p class="van-doc-demo-block__title" style="margin-top: 5px;color: red">
|
||||
(如同时参加以下两个活动，或有多个主题，请分别提交)</p>
|
||||
|
||||
</div>
|
||||
<van-tabs v-model="hdzplx" color="rgb(106, 0, 95)" type="line">
|
||||
<van-tab name="1" title="巾帼担当篇">
|
||||
<van-form @submit="doSubmit">
|
||||
<van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="formData.hdsbzpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>
|
||||
<van-field
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="formData.hdzplx2"
|
||||
@confirm="onConfirm"
|
||||
label="作品类别"
|
||||
placeholder="点击选择作品类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择作品类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="zplxArr2"
|
||||
@confirm="onConfirm"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field type="textarea" show-word-limit maxlength="100" autosize
|
||||
v-model="formData.hdsbzpms"
|
||||
label="作品介绍"
|
||||
placeholder="介绍"></van-field>
|
||||
<van-field label="图  片" disabled placeholder="（左滑删除单个文件）" style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="img,idx in formData.imgList" style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;height: 25vm;padding-right: 0;" autosize
|
||||
v-model="img.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(img.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData.imgList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
/>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false" :before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="5"
|
||||
v-model="formData.imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field label-width="150" label="音/视频、文档" disabled style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="video,idx in formData.videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">{{video.file.name}}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;padding-right: 0;" autosize v-model="video.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(video.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData.videoList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="vue.$toast.fail('文件大小不能超过200M！')"
|
||||
:max-size="209715200"
|
||||
:before-read="beforeReadVideo" accept="*" :max-count="2"
|
||||
v-model="formData.videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<span style="padding-left: 15px;font-size: 12px;color: rgb(160,160,160)">（注意：图片最多5张，视频最大200M。若您的手机不支持文件上传，请用电脑浏览器打开活动地址https://zhgh.nju.edu.cn/wmMobile参与活动。）</span>
|
||||
<div style="margin: 16px;">
|
||||
<van-button round block color="rgb(106, 0, 95)" type="info" native-type="submit">
|
||||
提交
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</van-tab>
|
||||
<van-tab name='2' title="巾帼温馨篇">
|
||||
<van-form @submit="doSubmit">
|
||||
<van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="formData2.hdsbzpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>
|
||||
<van-field
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="formData2.hdzplx2"
|
||||
@confirm="onConfirm"
|
||||
label="作品类别"
|
||||
placeholder="点击选择作品类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择作品类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
:columns="zplxArr"
|
||||
@confirm="onConfirm"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field type="textarea" show-word-limit maxlength="100" autosize
|
||||
v-model="formData2.hdsbzpms"
|
||||
label="作品介绍"
|
||||
placeholder="介绍"></van-field>
|
||||
<van-field label="图  片" disabled placeholder="（左滑删除单个文件）" style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="img,idx in formData2.imgList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;height: 25vm;padding-right: 0;" autosize
|
||||
v-model="img.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(img.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData2.imgList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false" :before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="5"
|
||||
v-model="formData2.imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field label-width="150" label="音/视频、文档" disabled style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="video,idx in formData2.videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">{{video.file.name}}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;padding-right: 0;" autosize v-model="video.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(video.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData2.videoList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
/>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="vue.$toast.fail('文件大小不能超过200M！')"
|
||||
:max-size="209715200"
|
||||
:before-read="beforeReadVideo" accept="*" :max-count="2"
|
||||
v-model="formData2.videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<span style="padding-left: 15px;font-size: 12px;color: rgb(160,160,160)">（注意：图片最多5张，视频最大200M。若您的手机不支持文件上传，请用电脑浏览器打开活动地址https://zhgh.nju.edu.cn/wmMobile参与活动。）</span>
|
||||
<div style="margin: 16px;">
|
||||
<van-button round block color="rgb(106, 0, 95)" type="info" native-type="submit">
|
||||
提交
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
</van-form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<van-tabbar
|
||||
style="max-width: 600px;position: fixed;left: 0;bottom: 0;right: 0;margin: auto"
|
||||
v-model="active"
|
||||
active-color="rgb(106,0,95)"
|
||||
inactive-color="#000"
|
||||
>
|
||||
<van-tabbar-item icon="label-o">介绍</van-tabbar-item>
|
||||
<van-tabbar-item icon="edit">报名</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<script src="https://cdn.staticfile.org/js-cookie/2.2.1/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 {
|
||||
zplxObj: {'温馨生活': 1, '烹饪乐趣': 2, '创意手工': 3, '一封家书': 4},
|
||||
zplxArr: ['温馨生活', '烹饪乐趣', '创意手工', '一封家书'],
|
||||
zplxObj2: {'防控疫情': 1, '教学教研': 2, '服务保障': 3},
|
||||
zplxArr2: ['防控疫情', '教学教研', '服务保障'],
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
hdzplx: '1',
|
||||
formData: {
|
||||
hdsbzpzt: '',
|
||||
hdsbzpms: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
},
|
||||
formData2: {
|
||||
hdsbzpzt: '',
|
||||
hdsbzpms: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
},
|
||||
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: {
|
||||
onConfirm: function (value) {
|
||||
if (vue.hdzplx == 1) {
|
||||
this.formData.hdzplx2 = value;
|
||||
} else {
|
||||
this.formData2.hdzplx2 = value;
|
||||
}
|
||||
|
||||
this.showPicker = false;
|
||||
},
|
||||
getPlaceholder: function (formData, key) {
|
||||
if (vue.isNull(formData.userid)) {
|
||||
return "输入工资号后自动匹配"
|
||||
} else {
|
||||
if (vue.isNull(formData[key])) {
|
||||
return '暂无'
|
||||
}
|
||||
return formData[key]
|
||||
}
|
||||
},
|
||||
doInput: function (val) {
|
||||
vue.$set(vue.formData, 'username', undefined)
|
||||
vue.$set(vue.formData, 'unionname', undefined)
|
||||
vue.$set(vue.formData, 'userid', undefined)
|
||||
$.get("/platform/hd/wm/wmMobile/queryUserByLoginname", {loginname: val}, function (data) {
|
||||
if (data.code == 0) {
|
||||
if (!vue.isNull(data.data)) {
|
||||
vue.$set(vue.formData, 'userid', data.data.id)
|
||||
vue.$set(vue.formData, 'username', data.data.username)
|
||||
vue.$set(vue.formData, 'unionname', data.data.unionname)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
doSubmit: function () {
|
||||
if (vue.isNull(vue.formData.userid)) {
|
||||
vue.$toast.fail("请正确填写您的工资号！")
|
||||
return
|
||||
}
|
||||
if (vue.hdzplx == 1 && vue.formData.videoList.length == 0 && vue.formData.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
} else if (vue.hdzplx == 2 && vue.formData2.videoList.length == 0 && vue.formData2.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
}
|
||||
|
||||
var str = vue.hdzplx == 1 ? '巾帼担当篇' : '巾帼温馨篇'
|
||||
|
||||
vue.$dialog.confirm({
|
||||
title: '提醒',
|
||||
message: '您当前选择的是“' + str + '”，是否确认上传？上传后您将不能对已上传的作品进行更改'
|
||||
}).then(function (value) {
|
||||
setTimeout(function () {
|
||||
// $.get("/platform/hd/wm/wmMobile/getSubCount", {userid: vue.formData.userid}, function (data) {
|
||||
// if (data == true) {
|
||||
|
||||
vue.showMsg = true
|
||||
vue.showPlan = true
|
||||
vue.percent = 0
|
||||
vue.msg = ''
|
||||
|
||||
|
||||
var formdata = new FormData();
|
||||
|
||||
if (vue.hdzplx == 1) {
|
||||
formdata.append("hdsbrid", vue.isNull(vue.formData.userid) ? '' : vue.formData.userid);
|
||||
formdata.append("hdsbzpzt", vue.isNull(vue.formData.hdsbzpzt) ? '' : vue.formData.hdsbzpzt);
|
||||
formdata.append("hdzplx", vue.isNull(vue.hdzplx) ? '' : vue.hdzplx);
|
||||
formdata.append("hdzplx2", vue.isNull(vue.zplxObj2[vue.formData.hdzplx2]) ? '' : vue.zplxObj2[vue.formData.hdzplx2]);
|
||||
formdata.append("hdsbzpms", vue.isNull(vue.formData.hdsbzpms) ? '' : vue.formData.hdsbzpms);
|
||||
formdata.append("hdsbsj", moment().format('YYYY-MM-DD HH:mm:ss'));
|
||||
vue.formData.imgList.forEach(function (val) {
|
||||
formdata.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
vue.formData.videoList.forEach(function (val) {
|
||||
formdata.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
} else if (vue.hdzplx == 2) {
|
||||
formdata.append("hdsbrid", vue.isNull(vue.formData.userid) ? '' : vue.formData.userid);
|
||||
formdata.append("hdsbzpzt", vue.isNull(vue.formData2.hdsbzpzt) ? '' : vue.formData2.hdsbzpzt);
|
||||
formdata.append("hdzplx", vue.isNull(vue.hdzplx) ? '' : vue.hdzplx);
|
||||
formdata.append("hdzplx2", vue.isNull(vue.zplxObj[vue.formData2.hdzplx2]) ? '' : vue.zplxObj[vue.formData2.hdzplx2]);
|
||||
formdata.append("hdsbzpms", vue.isNull(vue.formData2.hdsbzpms) ? '' : vue.formData2.hdsbzpms);
|
||||
formdata.append("hdsbsj", moment().format('YYYY-MM-DD HH:mm:ss'));
|
||||
vue.formData2.imgList.forEach(function (val) {
|
||||
formdata.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
vue.formData2.videoList.forEach(function (val) {
|
||||
formdata.append("files", val.file, vue.isNull(val.ms) ? val.file.name : val.ms + getSuffix(val.file.name));
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$.ajax({
|
||||
url: "/platform/hd/wm/wmMobile/doSubmit",
|
||||
type: "post",
|
||||
data: formdata,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
xhr: xhrOnProgress(function (e) {
|
||||
if (e.total == 0) {
|
||||
vue.percent = 0
|
||||
} else {
|
||||
vue.percent = ((e.loaded / e.total) * 100).toFixed(0);//文件上传百分比
|
||||
}
|
||||
|
||||
}),
|
||||
success: function (data) {
|
||||
if (data.code === 0) {
|
||||
if (vue.hdzplx == 1) {
|
||||
vue.formData.hdsbzpzt = ''
|
||||
vue.formData.hdsbzpms = ''
|
||||
vue.formData.hdzplx2 = ''
|
||||
vue.formData.imgList = []
|
||||
vue.formData.videoList = []
|
||||
vue.formData.audioList = []
|
||||
Cookies.remove('formData');
|
||||
} else if (vue.hdzplx == 2) {
|
||||
vue.formData2.hdsbzpzt = ''
|
||||
vue.formData2.hdsbzpms = ''
|
||||
vue.formData2.hdzplx2 = ''
|
||||
vue.formData2.imgList = []
|
||||
vue.formData2.videoList = []
|
||||
vue.formData2.audioList = []
|
||||
Cookies.remove('formData2');
|
||||
}
|
||||
vue.msg = '<p class="weui-msg__desc">我们已收到您的作品！<br/>非常感谢您的支持！</p>'
|
||||
vue.flag = true
|
||||
} else {
|
||||
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
}
|
||||
vue.showPlan = false
|
||||
},
|
||||
error: function (data) {
|
||||
vue.msg = '<p class="weui-msg__desc">非常抱歉对您造成的不便！<br/>请联系系统管理员进行修复！</p>'
|
||||
vue.flag = false
|
||||
vue.showPlan = false
|
||||
}
|
||||
});
|
||||
// } else {
|
||||
// vue.$notify({type: 'danger', message: '您已上传过作品！请勿重复发提交'})
|
||||
// }
|
||||
// })
|
||||
}, 500)
|
||||
}).catch(function (reason) {
|
||||
|
||||
});
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadImg: function (file) {
|
||||
return true;
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadVideo: function (file, detail) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
vue.$toast('获取不到后缀名！');
|
||||
return false;
|
||||
}
|
||||
// var type = suffix.toString().substring(suffix.lastIndexOf(".") + 2)
|
||||
// if (vue.videotype.indexOf(type) == -1 && vue.audiotype.indexOf(type) == -1 && vue.doctype.indexOf(type) == -1) {
|
||||
// vue.$toast('不支持的文件类型！');
|
||||
// return false;
|
||||
// }
|
||||
return true;
|
||||
},
|
||||
},
|
||||
created: function () {
|
||||
var self = this
|
||||
if (window.innerWidth > 800) {
|
||||
self.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
|
||||
|
||||
if (Cookies.get("formData") != undefined) {
|
||||
parseData = JSON.parse(Cookies.get("formData"))
|
||||
self.formData = {
|
||||
userid: parseData.userid,
|
||||
loginname: parseData.loginname,
|
||||
username: parseData.username,
|
||||
unionname: parseData.unionname,
|
||||
hdsbzpzt: parseData.hdsbzpzt,
|
||||
hdsbzpms: parseData.hdsbzpms,
|
||||
hdzplx: parseData.hdzplx,
|
||||
hdzplx2: parseData.hdzplx2,
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
}
|
||||
Cookies.remove('formData');
|
||||
}
|
||||
if (Cookies.get("formData2") != undefined) {
|
||||
parseData = JSON.parse(Cookies.get("formData2"))
|
||||
self.formData2 = {
|
||||
hdsbzpzt: parseData.hdsbzpzt,
|
||||
hdsbzpms: parseData.hdsbzpms,
|
||||
hdzplx: parseData.hdzplx,
|
||||
hdzplx2: parseData.hdzplx2,
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
}
|
||||
Cookies.remove('formData2');
|
||||
}
|
||||
setInterval(function () {
|
||||
var data = {
|
||||
userid: self.formData.userid,
|
||||
loginname: self.formData.loginname,
|
||||
username: self.formData.username,
|
||||
unionname: self.formData.unionname,
|
||||
hdsbzpzt: self.formData.hdsbzpzt,
|
||||
hdsbzpms: self.formData.hdsbzpms,
|
||||
hdzplx: self.formData.hdzplx,
|
||||
hdzplx2: self.formData.hdzplx2,
|
||||
}
|
||||
var data2 = {
|
||||
hdsbzpzt: self.formData2.hdsbzpzt,
|
||||
hdsbzpms: self.formData2.hdsbzpms,
|
||||
hdzplx: self.formData2.hdzplx,
|
||||
hdzplx2: self.formData2.hdzplx2,
|
||||
}
|
||||
Cookies.set("formData", JSON.stringify(data))
|
||||
Cookies.set("formData2", JSON.stringify(data2))
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,556 @@
|
||||
<!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.staticfile.org/vant/2.12.5/index.min.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.staticfile.org/vue/2.6.9/vue.min.js"></script>
|
||||
<script src="https://cdn.staticfile.org/vant/2.12.5/vant.js"></script>
|
||||
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.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.files&&boxData.files.length>0" class="my-swipe" :autoplay="3000"
|
||||
indicator-color="white">
|
||||
<van-swipe-item v-for="url in boxData.files">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="200px"
|
||||
fit="cover"
|
||||
:src="'${AppFileDomain!}/fileStreamPreview?id='+url.id"
|
||||
></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>
|
||||
<div v-if="active==1" class="page-v">
|
||||
<div class="detail-v" style="margin-top: 0">
|
||||
<div class="weui-msg" v-if="showMsg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<van-circle
|
||||
layer-color="rgb(240,240,240)"
|
||||
color="#07c160"
|
||||
stroke-width="50"
|
||||
v-if="showPlan"
|
||||
v-model="percent"
|
||||
:rate="percent"
|
||||
:clockwise="false"
|
||||
:text="percent+' %'"
|
||||
></van-circle>
|
||||
<span v-if="showPlan==false">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-if="!flag" class="weui-icon-warn weui-icon_msg"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title" v-if="showPlan">上传中...</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&flag">上传成功!</h2>
|
||||
<h2 class="weui-msg__title" v-if="!showPlan&&!flag">上传失败!</h2>
|
||||
<div v-html="msg"></div>
|
||||
</div>
|
||||
<div class="weui-msg__opr-area">
|
||||
<p class="weui-btn-area">
|
||||
<a v-if="!showPlan" @click="showMsg=false"
|
||||
:class="flag?'weui-btn weui-btn_primary':'weui-btn weui-btn_warn'">{{flag ? '确定' : '返回'}}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-v" v-if="!showMsg">
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<h2 class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
基本信息</h2>
|
||||
</div>
|
||||
<van-cell-group>
|
||||
<van-field
|
||||
@input="doInput"
|
||||
required
|
||||
v-model="formData.loginname"
|
||||
name="工资号"
|
||||
label="工  号"
|
||||
placeholder="工资号"
|
||||
:rules="[{ required: true, message: '请填写工资号' }]"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.username"
|
||||
name="姓名"
|
||||
label="姓  名"
|
||||
:placeholder="getPlaceholder(formData,'username')"
|
||||
></van-field>
|
||||
<van-field
|
||||
disabled
|
||||
v-model="formData.unionname"
|
||||
name="所属工会"
|
||||
label="所属工会"
|
||||
:placeholder="getPlaceholder(formData,'unionname')"
|
||||
></van-field>
|
||||
</van-cell-group>
|
||||
<div style="width: 100%;padding: 16px 0;">
|
||||
<span class="van-doc-demo-block__title" :style="'font-weight: bolder;color: '+boxData.hdcolor">
|
||||
作品信息</span>
|
||||
<p class="van-doc-demo-block__title" style="margin-top: 5px;color: red">
|
||||
(如同时参加以下多个活动，或有多个主题，请分别提交)</p>
|
||||
|
||||
</div>
|
||||
<van-tabs v-model="hdzplx" :color="boxData.hdcolor" type="line">
|
||||
<van-tab v-for="lb,idx in boxData.lbs" :name="idx+1+''" :title="lb.lname">
|
||||
<van-form @submit="doSubmit">
|
||||
<van-field style="padding-top: 30px" maxlength="15"
|
||||
:rules="[{ required: true, message: '请填写作品主题' }]"
|
||||
v-model="formData.hdsbzpzt"
|
||||
required
|
||||
show-word-limit
|
||||
label="作品主题" placeholder="主题"></van-field>
|
||||
<van-field
|
||||
v-if="lb.zplbs&&lb.zplbs.length>0"
|
||||
required
|
||||
readonly
|
||||
clickable
|
||||
name="picker"
|
||||
:value="formData.hdzplx2"
|
||||
@confirm="onConfirm"
|
||||
label="作品类别"
|
||||
placeholder="点击选择作品类别"
|
||||
@click="showPicker = true"
|
||||
:rules="[{ required: true, message: '请选择作品类别' }]"
|
||||
></van-field>
|
||||
<van-popup v-model="showPicker" position="bottom">
|
||||
<van-picker
|
||||
show-toolbar
|
||||
value-key="zname"
|
||||
:columns="lb.zplbs"
|
||||
@confirm="onConfirm"
|
||||
@cancel="showPicker = false"
|
||||
></van-picker>
|
||||
</van-popup>
|
||||
<van-field type="textarea" show-word-limit maxlength="100" autosize
|
||||
v-model="formData.hdsbzpms"
|
||||
label="作品介绍"
|
||||
placeholder="介绍"></van-field>
|
||||
<van-field label="图  片" disabled placeholder="（左滑删除单个文件）" style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="img,idx in formData.imgList" style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
:src="img.content"
|
||||
></van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;height: 25vm;padding-right: 0;" autosize
|
||||
v-model="img.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(img.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData.imgList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
/>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader multiple :preview-image="false" :before-read="beforeReadImg"
|
||||
accept="image/*"
|
||||
:max-count="5"
|
||||
v-model="formData.imgList">
|
||||
</van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<van-field label-width="150" label="音/视频、文档" disabled style="border: none;"
|
||||
input-align="right"></van-field>
|
||||
<van-swipe-cell v-for="video,idx in formData.videoList"
|
||||
style="border: none;padding-top: 20px;">
|
||||
<van-row style="padding: 0 15px">
|
||||
<van-col :span="6">
|
||||
<van-image
|
||||
width="100%"
|
||||
height="25vw"
|
||||
fit="cover"
|
||||
src="1"
|
||||
>
|
||||
<template v-slot:error>
|
||||
<i class="van-icon van-icon-description van-uploader__file-icon">
|
||||
<!----></i>
|
||||
<div class="van-uploader__file-name van-ellipsis">{{video.file.name}}
|
||||
</div>
|
||||
</template>
|
||||
</van-image>
|
||||
</van-col>
|
||||
<van-col :span="18">
|
||||
<van-field style="width: 100%;padding-right: 0;" autosize v-model="video.ms"
|
||||
type="textarea" rows="2"
|
||||
maxlength="50"
|
||||
:show-word-limit="!isNull(video.ms)"
|
||||
placeholder="请输入描述信息"></van-field>
|
||||
</van-col>
|
||||
</van-row>
|
||||
|
||||
<van-button
|
||||
native-type="button"
|
||||
@click="formData.videoList.splice(idx,1)"
|
||||
slot="right"
|
||||
square
|
||||
text="删除"
|
||||
type="danger"
|
||||
class="delete-button"
|
||||
></van-button>
|
||||
</van-swipe-cell>
|
||||
<van-field>
|
||||
<template #input>
|
||||
<van-uploader :preview-image="false" result-type="file"
|
||||
@oversize="vue.$toast.fail('文件大小不能超过200M！')"
|
||||
:max-size="209715200"
|
||||
:before-read="beforeReadVideo" accept="*" :max-count="2"
|
||||
v-model="formData.videoList"></van-uploader>
|
||||
</template>
|
||||
</van-field>
|
||||
<span style="padding-left: 15px;font-size: 12px;color: rgb(160,160,160)">（注意：图片最多5张，视频最大200M。）</span>
|
||||
<div style="margin: 16px;">
|
||||
<van-button round block :color="boxData.hdcolor" type="info" native-type="submit">
|
||||
提交
|
||||
</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</van-tab>
|
||||
</van-tabs>
|
||||
</van-form>
|
||||
</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-item icon="edit">报名</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
<van-number-keyboard safe-area-inset-bottom/>
|
||||
</div>
|
||||
<script src="https://cdn.staticfile.org/js-cookie/2.2.1/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 {
|
||||
boxData: {},
|
||||
zplxObj: {'温馨生活': 1, '烹饪乐趣': 2, '创意手工': 3, '一封家书': 4},
|
||||
zplxArr: ['温馨生活', '烹饪乐趣', '创意手工', '一封家书'],
|
||||
zplxObj2: {'防控疫情': 1, '教学教研': 2, '服务保障': 3},
|
||||
zplxArr2: ['防控疫情', '教学教研', '服务保障'],
|
||||
showPicker: false,
|
||||
showMsg: false,
|
||||
percent: 0,
|
||||
flag: true,
|
||||
showPlan: true,
|
||||
msg: '',
|
||||
hdzplx: '1',
|
||||
formData: {
|
||||
hdsbzpzt: '',
|
||||
hdsbzpms: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
},
|
||||
formData2: {
|
||||
hdsbzpzt: '',
|
||||
hdsbzpms: '',
|
||||
imgList: [],
|
||||
videoList: [],
|
||||
},
|
||||
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: {
|
||||
onConfirm: function (value) {
|
||||
this.formData.hdzplx2 = value.zname;
|
||||
this.showPicker = false;
|
||||
},
|
||||
getPlaceholder: function (formData, key) {
|
||||
if (vue.isNull(formData.userid)) {
|
||||
return "输入工资号后自动匹配"
|
||||
} else {
|
||||
if (vue.isNull(formData[key])) {
|
||||
return '暂无'
|
||||
}
|
||||
return formData[key]
|
||||
}
|
||||
},
|
||||
doInput: function (val) {
|
||||
vue.$set(vue.formData, 'username', undefined)
|
||||
vue.$set(vue.formData, 'unionname', undefined)
|
||||
vue.$set(vue.formData, 'userid', undefined)
|
||||
$.get("/platform/hd/wm/wmMobile/queryUserByLoginname", {loginname: val}, function (data) {
|
||||
if (data.code == 0) {
|
||||
if (!vue.isNull(data.data)) {
|
||||
vue.$set(vue.formData, 'userid', data.data.id)
|
||||
vue.$set(vue.formData, 'username', data.data.username)
|
||||
vue.$set(vue.formData, 'unionname', data.data.unionname)
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
doSubmit: function () {
|
||||
if (vue.isNull(vue.formData.userid)) {
|
||||
vue.$toast.fail("请正确填写您的工资号！")
|
||||
return
|
||||
}
|
||||
if (vue.hdzplx == 1 && vue.formData.videoList.length == 0 && vue.formData.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
} else if (vue.hdzplx == 2 && vue.formData2.videoList.length == 0 && vue.formData2.imgList.length == 0) {
|
||||
vue.$toast.fail("请您选择要上传的作品！")
|
||||
return
|
||||
}
|
||||
|
||||
var str = vue.hdzplx == 1 ? '巾帼担当篇' : '巾帼温馨篇'
|
||||
|
||||
vue.$dialog.confirm({
|
||||
title: '提醒',
|
||||
message: '您当前选择的是“' + str + '”，是否确认上传？上传后您将不能对已上传的作品进行更改'
|
||||
}).then(function (value) {
|
||||
|
||||
}).catch(function (reason) {
|
||||
|
||||
});
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadImg: function (file) {
|
||||
return true;
|
||||
},
|
||||
// 返回布尔值
|
||||
beforeReadVideo: function (file, detail) {
|
||||
var suffix = getSuffix(file.name)
|
||||
if (suffix == null) {
|
||||
vue.$toast('获取不到后缀名！');
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
},
|
||||
},
|
||||
created: function () {
|
||||
var self = this
|
||||
if (window.innerWidth > 800) {
|
||||
self.$notify({type: 'warning', message: '当前窗口宽度过大！部分区域显示会出现大小偏差'});
|
||||
}
|
||||
var wmhd_boxdata = localStorage.getItem("wmhd_boxdata")
|
||||
if (wmhd_boxdata) {
|
||||
this.boxData = JSON.parse(wmhd_boxdata)
|
||||
localStorage.removeItem("wmhd_boxdata")
|
||||
} else {
|
||||
this.boxData = {
|
||||
hdjs: '填写活动介绍',
|
||||
hdcjry: '填写活动参加人员',
|
||||
hdjlfs: '填写活动奖励方式',
|
||||
hdnr: '填写活动内容',
|
||||
hdlxr: '填写活动联系人',
|
||||
hdother: '其他内容',
|
||||
hdcolor: '#6A005F',
|
||||
fileList: [],
|
||||
lbs: [{lname: '活动类别1', zplbs: [{zname: '作品类别1'}, {zname: '作品类别2'}]}, {
|
||||
lname: '活动类别2',
|
||||
zplbs: [{zname: '作品类别1'}, {zname: '作品类别2'}]
|
||||
}]
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,598 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/video/css/video-js.min.css">
|
||||
<script src="${base!}/assets/platform/plugins/video/js/video.min.js"></script>
|
||||
|
||||
<style>
|
||||
.el-col > .el-cascader, .el-col > .el-select, .el-col > .el-date-editor {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__header i {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__body {
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
|
||||
.video-js {
|
||||
width: 100%;
|
||||
height: 450px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.vjs-tech, .video-js button {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#app .el-table th.gutter {
|
||||
display: table-cell !important
|
||||
}
|
||||
|
||||
.filedialog .el-dialog {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
|
||||
.video-js .vjs-big-play-button { /* 中间大的播放按钮 */
|
||||
font-size: 2.5em;
|
||||
line-height: 2.3em;
|
||||
height: 2.5em;
|
||||
width: 2.5em;
|
||||
-webkit-border-radius: 2.5em;
|
||||
-moz-border-radius: 2.5em;
|
||||
border-radius: 2.5em;
|
||||
background-color: rgba(115, 133, 159, .5);
|
||||
border-width: 0.12em;
|
||||
margin-top: -1.25em;
|
||||
margin-left: -1.75em;
|
||||
}
|
||||
|
||||
.video-js.vjs-paused .vjs-big-play-button { /* 视频暂停时显示播放按钮 */
|
||||
display: block;
|
||||
}
|
||||
|
||||
.video-js.vjs-error .vjs-big-play-button { /* 视频加载出错时隐藏播放按钮 */
|
||||
display: none;
|
||||
}
|
||||
|
||||
.vjs-loading-spinner { /* 加载圆圈 */
|
||||
font-size: 2.5em;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
margin-top: -1em;
|
||||
margin-left: -1.5em;
|
||||
}
|
||||
|
||||
.el-image {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #abc5df;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #e5edf6;
|
||||
}
|
||||
|
||||
.view-myvideo-tab {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #C0C4CC;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-camera-solid {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-play {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-video-camera-solid, .view-myvideo-tab .el-icon-video-play, .view-myvideo-tab .el-icon-document {
|
||||
color: #000000;
|
||||
line-height: 80px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-download {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.el-icon-video-play {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-dialog__body {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.el-icon-download {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.file-down-span {
|
||||
background: black;
|
||||
opacity: 0.5;
|
||||
z-index: 1000;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
/*position: absolute;*/
|
||||
position: relative;
|
||||
bottom: -100px;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-down-span:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-icon-circle-close {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.el-image-viewer__wrapper {
|
||||
z-index: 99999 !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="22">
|
||||
<el-row type="flex" :gutter="20">
|
||||
<el-col :span="6">
|
||||
<!-- <el-cascader placeholder="请选择活动主题"-->
|
||||
<!-- v-model="pageForm.hdids" :options="hdxxlist" @change="hdchange"-->
|
||||
<!-- clearable></el-cascader>-->
|
||||
<el-date-picker v-model="pageForm.year"
|
||||
placeholder="年度"
|
||||
type="year"
|
||||
@change="yearChange"
|
||||
value-format="yyyy"></el-date-picker>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.hdid" @change="hdchange" clearable
|
||||
placeholder="请选择活动主题">
|
||||
<el-option v-for="i in hdxxlist"
|
||||
:key="i.value"
|
||||
:label="i.label"
|
||||
:value="i.value"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.hdlb" placeholder="请选择活动类别" clearable
|
||||
@change="hdlbchange">
|
||||
<el-option v-for="o in hdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select v-model="pageForm.zplb" placeholder="请选择作品类型" clearable>
|
||||
<el-option v-for="o in hdzplblist" :label="o.zname"
|
||||
:value="o.zid"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row type="flex" :gutter="20" class="mt20">
|
||||
<el-col :span="6">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword"
|
||||
@keyup.enter.native="doSearch"
|
||||
clearable>
|
||||
<el-select v-model="pageForm.searchName" slot="prepend"
|
||||
placeholder="查询类型"
|
||||
style="width: 120px;"
|
||||
clearable>
|
||||
<el-option label="姓名" value="u.username"></el-option>
|
||||
<el-option label="工资号" value="u.loginname"></el-option>
|
||||
</el-select>
|
||||
</el-input>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6" v-if="hasSuperAdminOrXghRole">
|
||||
<el-select placeholder="所属工会" v-model="pageForm.union"
|
||||
clearable="true"
|
||||
filterable="true" @change="unionChange">
|
||||
<el-option v-for="item in unions" :label="item.unionname"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="6">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unit"
|
||||
style="width: 200px;"
|
||||
clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-select placeholder="审核状态" v-model="pageForm.stateId"
|
||||
style="width: 200px;"
|
||||
clearable
|
||||
filterable>
|
||||
<el-option v-for="item in auditStateList"
|
||||
:label="item.stateName"
|
||||
:value="item.stateId"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<div class="">
|
||||
<el-button type="primary" icon="el-icon-search"
|
||||
@click="doSearch"></el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-card>
|
||||
<el-card shadow="never" class="mt20">
|
||||
<vi-title2 title="作品列表">
|
||||
<template #func>
|
||||
<el-button size="small" @click="exportExcel" type="primary">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出Excel
|
||||
</el-button>
|
||||
|
||||
<el-button size="small" @click="exportWork" type="primary">
|
||||
<i class="el-icon-tickets"></i>
|
||||
导出作品
|
||||
</el-button>
|
||||
</template>
|
||||
</vi-title2>
|
||||
<el-table :data="tableData" @sort-change="pageOrder">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center"
|
||||
width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="username" label="姓名" header-align="center" align="center"
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
sortable
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
sortable></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
sortable></el-table-column>
|
||||
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="auditState" header-align="center"
|
||||
label="审核状态" sortable>
|
||||
<template scope="scope">
|
||||
<span :style="'color:'+scope.row.statecolor">{{scope.row.statename}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" header-align="center" label="操作" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="viewInfo(scope)" size="mini" type="primary">查看
|
||||
</el-button>
|
||||
<el-button @click="doDelete(scope.row.id)" size="mini" type="danger">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="info" @playvideo="playvideo"></info>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
|
||||
<el-dialog :visible.sync="fileDialogVisible" class="filedialog" @close="filedialogClose"
|
||||
:close-on-click-modal="false">
|
||||
<div id="videoContainer"></div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
window.vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [initTableMixins],
|
||||
data: function () {
|
||||
return {
|
||||
units: [],
|
||||
unions: [],
|
||||
hasSuperAdminOrXghRole: "${@shiro.hasAnyRoles('sysadmin','A06','H10')}" === 'true' ? true : false,
|
||||
audio: {
|
||||
name: '东西（Cover：林俊呈）',
|
||||
artist: '纳豆',
|
||||
url: 'https://cdn.moefe.org/music/mp3/thing.mp3',
|
||||
cover: 'https://p1.music.126.net/5zs7IvmLv7KahY3BFzUmrg==/109951163635241613.jpg?param=300y300', // prettier-ignore
|
||||
lrc: 'https://cdn.moefe.org/music/lrc/thing.lrc',
|
||||
},
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
year: new Date().getFullYear() + '',
|
||||
searchName: "u.username",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
hdid: '',
|
||||
hdlb: '',
|
||||
zplb: '',
|
||||
stateId: '',
|
||||
unit: '',
|
||||
union: '',
|
||||
},
|
||||
hdxxlist: [],
|
||||
videoSrc: '',
|
||||
viewDialogVisible: false,
|
||||
fileDialogVisible: false,
|
||||
imgSrc: '',
|
||||
fileList: [],
|
||||
viewData: {},
|
||||
imgtype: ['gif', 'jpg', 'png', 'jpeg'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg'],
|
||||
doctype: ['doc', 'docx'],
|
||||
audiotype: ['mp3', 'wma', 'flac', 'wav', 'm4a', 'amr', 'au'],
|
||||
prevImgList: [],
|
||||
img2List: [],
|
||||
videoList: [],
|
||||
docList: [],
|
||||
audioList: [],
|
||||
ckusername: '',//当前查看的人的姓名 下载的时候一起传过去，
|
||||
hdlblist: [],
|
||||
hdzplblist: [],
|
||||
yearActivityList: [],
|
||||
auditStateList: [],
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'pageForm.hdid'(val) {
|
||||
this.$set(this.pageForm, "hdlb", '')
|
||||
this.$set(this.pageForm, "zplb", '')
|
||||
},
|
||||
'pageForm.hdlb'(val) {
|
||||
this.$set(this.pageForm, "zplb", '')
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'info': httpVueLoader('/components/hd/hdwmInfo.vue'),
|
||||
},
|
||||
methods: {
|
||||
yearChange(val) {
|
||||
let activityList = []
|
||||
if (val === null) {
|
||||
this.yearActivityList.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
} else {
|
||||
let enen = this.yearActivityList.filter(v => v.value == val)
|
||||
enen.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
}
|
||||
this.hdxxlist = activityList
|
||||
this.$set(this.pageForm, "hdid", '')
|
||||
this.$set(this.pageForm, "hdlb", '')
|
||||
this.$set(this.pageForm, "zplb", '')
|
||||
},
|
||||
async unionChange() {
|
||||
this.$set(this.pageForm, "unit", '')
|
||||
this.units = await getUnits(this.pageForm.union)
|
||||
},
|
||||
|
||||
hdchange(v) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: v}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
hdlbchange(id) {
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
async pageData() {
|
||||
var self = this;
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + '/platform/hd/wmhd/pageData', self.pageForm, function (data) {
|
||||
sublime.closeLoadingbar();
|
||||
if (data.code == 0) {
|
||||
self.tableData = data.data.list;
|
||||
self.pageForm.totalCount = data.data.totalCount;
|
||||
}
|
||||
});
|
||||
},
|
||||
pageSizeChange: function (val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
async viewInfo(scope) {
|
||||
|
||||
this.$refs.info.getInfo(scope.row.id)
|
||||
this.$refs.guava.view()
|
||||
|
||||
|
||||
},
|
||||
playvideo: function (fjurl) {
|
||||
var self = this;
|
||||
self.fileDialogVisible = true;
|
||||
self.$nextTick(function () {
|
||||
var vc = document.getElementById('videoContainer');
|
||||
var newVideo = document.createElement("div");//创建一个标签
|
||||
newVideo.innerHTML = '<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"></video>';
|
||||
vc.appendChild(newVideo);
|
||||
var option = {autoplay: false, language: 'zh-CN'};
|
||||
var myPlayer = videojs('my-video', option, function onPlayerReady() {
|
||||
var myPlayer = this;
|
||||
myPlayer.src({src: fjurl, type: "video/mp4"}); /*videojs.log("播放器已经准备好了!");*/
|
||||
//this.play();
|
||||
});
|
||||
})
|
||||
},
|
||||
filedialogClose: function () {
|
||||
//关闭的时候需要销毁video 但是随之dom元素也会被删除！！！！
|
||||
videojs('my-video').dispose();
|
||||
},
|
||||
viewdialogClose: function () {
|
||||
//停止播放音频
|
||||
var audio = document.getElementById('amusic');
|
||||
if (audio != null) {
|
||||
document.getElementById('amusic').pause();
|
||||
}
|
||||
},
|
||||
exportWork() {
|
||||
let {hdid, hdlb, zplb, union, unit, stateId} = this.pageForm;
|
||||
if (hdid === '') {
|
||||
this.$message.warning('请先选择活动主题');
|
||||
return;
|
||||
}
|
||||
let hdarr = this.hdxxlist.filter(o => {
|
||||
return o.value == hdid;
|
||||
});
|
||||
let hdname = hdarr[0].label;
|
||||
window.open('/platform/hd/wmhd/exportWork?hdid=' + hdid +
|
||||
'&hdname=' + hdname +
|
||||
"&hdlb=" + hdlb +
|
||||
"&zplb=" + zplb +
|
||||
"&union=" + union +
|
||||
"&unit=" + unit +
|
||||
"&stateId=" + stateId);
|
||||
},
|
||||
exportExcel: function () {
|
||||
let {hdid, hdlb, zplb, union, unit, stateId} = this.pageForm;
|
||||
if (hdid === '') {
|
||||
this.$message.warning('请先选择活动主题');
|
||||
return;
|
||||
}
|
||||
let hdarr = this.hdxxlist.filter(o => {
|
||||
return o.value == hdid;
|
||||
});
|
||||
let hdname = hdarr[0].label;
|
||||
window.open('/platform/hd/wmhd/exportExcel?hdid=' + hdid +
|
||||
'&hdname=' + hdname +
|
||||
"&hdlb=" + hdlb +
|
||||
"&zplb=" + zplb +
|
||||
"&union=" + union +
|
||||
"&unit=" + unit +
|
||||
"&stateId=" + stateId);
|
||||
},
|
||||
doSearch: function () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
downLoad: function (item) {
|
||||
window.open('/platform/hd/wmhd/download?filepath=' + item.fjurl + '&filename=' + item.fjname + "&username=" + this.ckusername);
|
||||
//window.location.href='/platform/hd/wmhd/download?filepath='+item.fjurl+'&filename='+item.fjname+"&username="+this.ckusername;
|
||||
},
|
||||
YlDoc: function (item) {
|
||||
var self = this;
|
||||
window.open('/platform/hd/wmhd/YlDoc?fjurl=' + item.fjurl);
|
||||
},
|
||||
async initHdxxlist() {
|
||||
// await $.post(base + '/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
// if (data.code == 0) {
|
||||
// this.hdxxlist = data.data;
|
||||
// this.pageForm.hdids = [new Date().getFullYear(), this.hdxxlist.find(v => v.value == new Date().getFullYear() + "").children[0].value]
|
||||
// this.pageForm.hdid = this.hdxxlist.find(v => v.value == new Date().getFullYear() + "").children[0].value
|
||||
// }
|
||||
// });
|
||||
await $.post(base + '/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.yearActivityList = data.data
|
||||
let activityList = []
|
||||
data.data.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
this.hdxxlist = activityList
|
||||
}
|
||||
});
|
||||
},
|
||||
async doDelete(id) {
|
||||
const confirm = await this.$confirm('确定要删除吗, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm) {
|
||||
const resp = await $.post(loc() + '/doDelete', {id: id})
|
||||
if (resp.code === 0) {
|
||||
this.notifySuccess(resp.msg)
|
||||
this.doSearch()
|
||||
} else {
|
||||
this.notifyError(resp.msg)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
async getAuditStateByModule() {
|
||||
const {data} = await $.post(loc() + '/getAuditStateByModule')
|
||||
this.auditStateList = data
|
||||
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
await this.initHdxxlist();
|
||||
if (this.hdxxlist && this.hdxxlist.length > 0) {
|
||||
this.pageForm.hdid = this.hdxxlist[0].value
|
||||
this.hdchange(this.pageForm.hdid)
|
||||
}
|
||||
await this.pageData();
|
||||
|
||||
|
||||
this.unions = await getUnions(null)
|
||||
this.units = await getUnits(null)
|
||||
await this.getAuditStateByModule()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,419 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
|
||||
<el-card shadow="never">
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdid" clearable @change="hdchange"
|
||||
placeholder="请选择活动主题">
|
||||
<el-option v-for="o in hdxxlist" :label="o.label"
|
||||
:value="o.value"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdlb" placeholder="请选择活动类型" clearable
|
||||
@change="hdlbchange">
|
||||
<el-option v-for="o in hdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.zplb" placeholder="请选择作品类型" clearable>
|
||||
<el-option v-for="o in hdzplblist" :label="o.zname"
|
||||
:value="o.zid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select placeholder="所属工会" v-model="pageForm.unionId" style="width: 100%;"
|
||||
clearable="true"
|
||||
@change="flushUnits" @clear="flushUnits"
|
||||
|
||||
v-if="${@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')||@shiro.hasRole('H03')}"
|
||||
|
||||
filterable="true">
|
||||
<el-option v-for="item in unions" :label="item.unionname"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unitId" style="width: 100%;"
|
||||
clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5" v-if="pageForm.isAudit===null">
|
||||
<el-select placeholder="审核状态" v-model="pageForm.stateId"
|
||||
style="width: 200px;"
|
||||
clearable
|
||||
filterable>
|
||||
<el-option label="待校工会审核" value="4200"></el-option>
|
||||
<el-option label="校工会退回" value="4250"></el-option>
|
||||
<el-option label="校工会拒绝" value="4300"></el-option>
|
||||
<el-option label="审核通过" value="4400"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
|
||||
|
||||
<el-card class="mt20" shadow="never">
|
||||
<vi-title2 title="作品列表">
|
||||
<template #func>
|
||||
<el-button type="primary" icon="el-icon-position" size="small" @click="openAudit" class="mr10"
|
||||
:disabled="multipleSelection.length==0">
|
||||
批量审核
|
||||
</el-button>
|
||||
<el-radio-group v-model="pageForm.isAudit" @change="doSearch" size="small">
|
||||
<el-radio-button :label="null">全部</el-radio-button>
|
||||
<el-radio-button :label="true">已审核</el-radio-button>
|
||||
<el-radio-button :label="false">未审核</el-radio-button>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</vi-title2>
|
||||
<el-table :data="tableData" ref="table" @sort-change="pageOrder" row-key="id"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
reserve-selection
|
||||
:selectable="(row)=>{return row.auditState=='4200'}"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center"
|
||||
width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="username" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="auditState" header-align="center"
|
||||
label="审核状态" sortable>
|
||||
<template scope="scope">
|
||||
<span :style="'color:'+scope.row.stateColor">{{scope.row.stateName}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="primary" @click="viewInfo(scope.row)">查看</el-button>
|
||||
|
||||
<el-button v-if="scope.row.auditState==='4200'"
|
||||
type="primary" size="mini"
|
||||
@click="openAudit(scope.row)">审核
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<template #view>
|
||||
<info ref="info" @playvideo="playvideo"></info>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<template v-if="multipleSelection.length===0">
|
||||
<info ref="info2" handle label="校工会审核" @playvideo="playvideo">
|
||||
|
||||
|
||||
<template #handle>
|
||||
|
||||
<el-form :model="formData" ref="form" :rules="formRules" label-position="right"
|
||||
style="padding: 20px 0"
|
||||
label-width="120px">
|
||||
<el-form-item label="审核信息 " label-width="135px" class="view-header">
|
||||
</el-form-item>
|
||||
|
||||
<el-row gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditor" label="审核人员">
|
||||
<el-input v-model="formData.username"
|
||||
disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditTime" label="审核时间">
|
||||
<el-input v-model="formData.auditTime" disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item prop="auditOpinion" label="审核意见">
|
||||
<el-input type="textarea" v-model="formData.auditOpinion" rows="4"
|
||||
maxlength="500"
|
||||
placeholder="请填写您的审核意见"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="auditSign" label="签  字" class="is-required">
|
||||
<sign :qz.sync="formData.auditSign"></sign>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doReview(1)">拒绝</el-button>
|
||||
<el-button @click="doReview(2)" type="warning">返回修改</el-button>
|
||||
<el-button type="primary" @click="doReview(3)">通过</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</info>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-form :model="formData" ref="form" :rules="formRules" label-position="right"
|
||||
style="padding: 20px 0"
|
||||
label-width="120px">
|
||||
<el-form-item label="审核信息 " label-width="135px" class="view-header">
|
||||
</el-form-item>
|
||||
|
||||
<el-row gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditor" label="审核人员">
|
||||
<el-input v-model="formData.username"
|
||||
disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditTime" label="审核时间">
|
||||
<el-input v-model="formData.auditTime" disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row gutter="20">
|
||||
<el-form-item>
|
||||
<el-table :data="multipleSelection" max-height="500px">
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="username" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
|
||||
<el-form-item prop="auditOpinion" label="审核意见">
|
||||
<el-input type="textarea" v-model="formData.auditOpinion" rows="4"
|
||||
maxlength="500"
|
||||
placeholder="请填写您的审核意见"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="auditSign" label="签  字" class="is-required">
|
||||
<sign :qz.sync="formData.auditSign"></sign>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doReview(1)">拒绝</el-button>
|
||||
<el-button @click="doReview(2)" type="warning">返回修改</el-button>
|
||||
<el-button type="primary" @click="doReview(3)">通过</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="fileDialogVisible" class="filedialog" @close="filedialogClose"
|
||||
:close-on-click-modal="false">
|
||||
<div id="videoContainer"></div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
multipleSelection: [],
|
||||
fileDialogVisible: false,
|
||||
videoShow: false,
|
||||
pageForm: {
|
||||
isAudit: false
|
||||
},
|
||||
unions: [],
|
||||
units: [],
|
||||
hdxxlist: [],
|
||||
hdlblist: [],
|
||||
hdzplblist: [],
|
||||
formRules: {
|
||||
auditOpinion: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
},
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'info': httpVueLoader('/components/hd/hdwmInfo.vue'),
|
||||
},
|
||||
methods: {
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
filedialogClose() {
|
||||
//关闭的时候需要销毁video 但是随之dom元素也会被删除！！！！
|
||||
this.imgShow = false;
|
||||
this.videoShow = false;
|
||||
videojs('my-video').dispose();
|
||||
},
|
||||
playvideo(fjurl) {
|
||||
this.fileDialogVisible = true;
|
||||
this.videoShow = true;
|
||||
this.$nextTick(function () {
|
||||
let vc = document.getElementById('videoContainer');
|
||||
let newVideo = document.createElement("div");//创建一个标签
|
||||
newVideo.innerHTML = '<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"></video>';
|
||||
vc.appendChild(newVideo);
|
||||
let option = {autoplay: false, language: 'zh-CN'};
|
||||
let myPlayer = videojs('my-video', option, function onPlayerReady() {
|
||||
let myPlayer = this;
|
||||
myPlayer.src({src: fjurl, type: "video/mp4"});
|
||||
/*videojs.log("播放器已经准备好了!");*/
|
||||
//this.play();
|
||||
});
|
||||
})
|
||||
},
|
||||
doReview(flag) {
|
||||
this.$refs["form"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
const confirm = await this.$confirm('确定要' + (flag === 1 ? '拒绝' : flag === 2 ? '退回修改' : '通过审核') + '吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
this.formData.pass = flag
|
||||
this.formData.ids = JSON.stringify(this.multipleSelection.map(v => v.id))
|
||||
const resp = await $.post(loc() + "/doReview", this.formData)
|
||||
if(resp.code===0){
|
||||
this.$refs.table.clearSelection()
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
this.notifySuccess(resp.msg)
|
||||
}else{
|
||||
this.notifyWarning(resp.msg)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
openAudit(row) {
|
||||
this.$refs.guava.edit()
|
||||
if (this.multipleSelection.length === 0) {
|
||||
this.$refs.info2.getInfo(row.id)
|
||||
}
|
||||
const {id} = row
|
||||
this.formData = {
|
||||
id: id ? id : null,
|
||||
username: "${@shiro.getPrincipalProperty('username')}",
|
||||
loginname: "${@shiro.getPrincipalProperty('loginname')}",
|
||||
auditTime: moment().format('YYYY-MM-DD'),
|
||||
auditOpinion: '同意'
|
||||
}
|
||||
if (this.$refs['form']) {
|
||||
this.$refs['form'].resetFields()
|
||||
}
|
||||
},
|
||||
viewInfo(row) {
|
||||
this.$refs.info.getInfo(row.id)
|
||||
this.$refs.guava.view()
|
||||
},
|
||||
hdchange(id) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
hdlbchange(id) {
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
initHdxxlist() {
|
||||
$.post(base + '/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdxxlist = data.data[0].children;
|
||||
}
|
||||
});
|
||||
},
|
||||
async flushUnits() {
|
||||
this.$set(this.pageForm, "unitId", "")
|
||||
if ("${@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')||@shiro.hasRole('H03')}" === 'true') {
|
||||
this.units = await getUnits(this.pageForm.unionId)
|
||||
} else {
|
||||
this.units = await getUnits("${@shiro.getPrincipalProperty('unit').getUnionid()}")
|
||||
}
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.unions = await getUnions()
|
||||
this.flushUnits()
|
||||
this.initHdxxlist();
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,446 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
|
||||
<el-card shadow="never">
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdid" clearable @change="hdchange"
|
||||
placeholder="请选择活动主题">
|
||||
<el-option v-for="o in hdxxlist" :label="o.label"
|
||||
:value="o.value"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdlb" placeholder="请选择活动类型" clearable
|
||||
@change="hdlbchange">
|
||||
<el-option v-for="o in hdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.zplb" placeholder="请选择作品类型" clearable>
|
||||
<el-option v-for="o in hdzplblist" :label="o.zname"
|
||||
:value="o.zid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select placeholder="所属工会" v-model="pageForm.unionId" style="width: 100%;"
|
||||
clearable="true"
|
||||
@change="flushUnits" @clear="flushUnits"
|
||||
|
||||
v-if="${@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')||@shiro.hasRole('H03')}"
|
||||
filterable="true">
|
||||
<el-option v-for="item in unions" :label="item.unionname"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select placeholder="所属单位" v-model="pageForm.unitId" style="width: 100%;"
|
||||
clearable="true"
|
||||
filterable="true">
|
||||
<el-option v-for="item in units" :label="item.name"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5" v-if="pageForm.isAudit===null">
|
||||
<el-select placeholder="审核状态" v-model="pageForm.stateId"
|
||||
style="width: 200px;"
|
||||
clearable
|
||||
filterable>
|
||||
<el-option label="待分工会审核" value="4000"></el-option>
|
||||
<el-option label="分工会退回" value="4100"></el-option>
|
||||
<el-option label="分工会审核拒绝" value="4150"></el-option>
|
||||
<el-option label="待校工会审核" value="4200"></el-option>
|
||||
<el-option label="校工会退回" value="4250"></el-option>
|
||||
<el-option label="校工会拒绝" value="4300"></el-option>
|
||||
<el-option label="审核通过" value="4400"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
|
||||
|
||||
<el-card class="mt20" shadow="never">
|
||||
<vi-title2 title="作品列表">
|
||||
<template #func>
|
||||
<el-button type="primary" icon="el-icon-position" size="small" @click="openAudit" class="mr10"
|
||||
:disabled="multipleSelection.length==0">
|
||||
批量审核
|
||||
</el-button>
|
||||
<el-radio-group v-model="pageForm.isAudit" @change="doSearch" size="small">
|
||||
<el-radio-button :label="null">全部</el-radio-button>
|
||||
<el-radio-button :label="true">已审核</el-radio-button>
|
||||
<el-radio-button :label="false">未审核</el-radio-button>
|
||||
</el-radio-group>
|
||||
</template>
|
||||
</vi-title2>
|
||||
<el-table :data="tableData" ref="table" @sort-change="pageOrder" row-key="id"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column
|
||||
reserve-selection
|
||||
:selectable="(row)=>{return row.auditState=='4000'}"
|
||||
type="selection"
|
||||
width="55">
|
||||
</el-table-column>
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center"
|
||||
width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="username" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="auditState" header-align="center"
|
||||
label="审核状态" sortable>
|
||||
<template scope="scope">
|
||||
<span :style="'color:'+scope.row.stateColor">{{scope.row.stateName}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="primary" @click="viewInfo(scope.row)">查看</el-button>
|
||||
|
||||
<el-button
|
||||
v-if="scope.row.auditState==='4000'||scope.row.auditState==='4250'"
|
||||
type="primary" size="mini"
|
||||
@click="openAudit(scope.row)">审核
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!--#include("/layouts/pagination.html"){}#-->
|
||||
</el-card>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
<template #view>
|
||||
<info ref="info" @playvideo="playvideo"></info>
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<template v-if="multipleSelection.length===0">
|
||||
<info ref="info2" handle label="分工会审核" @playvideo="playvideo">
|
||||
<template #handle>
|
||||
<el-form :model="formData" ref="form" :rules="formRules" label-position="right"
|
||||
style="padding: 20px 0"
|
||||
label-width="120px">
|
||||
<el-form-item label="审核信息 " label-width="135px" class="view-header">
|
||||
</el-form-item>
|
||||
<template v-if="multipleSelection.length>0">
|
||||
<el-table :data="multipleSelection">
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="username" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
<el-row gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditor" label="审核人员">
|
||||
<el-input v-model="formData.username"
|
||||
disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditTime" label="审核时间">
|
||||
<el-input v-model="formData.auditTime" disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item prop="auditOpinion" label="审核意见">
|
||||
<el-input type="textarea" v-model="formData.auditOpinion" rows="4"
|
||||
maxlength="500"
|
||||
placeholder="请填写您的审核意见"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="auditSign" label="签  字" class="is-required">
|
||||
<sign :qz.sync="formData.auditSign"></sign>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doReview(1)">拒绝</el-button>
|
||||
<el-button @click="doReview(2)" type="warning">返回修改</el-button>
|
||||
<el-button type="primary" @click="doReview(3)">通过</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</info>
|
||||
</template>
|
||||
<template v-else>
|
||||
<el-form :model="formData" ref="form" :rules="formRules" label-position="right"
|
||||
style="padding: 20px 0"
|
||||
label-width="120px">
|
||||
<el-form-item label="审核信息 " label-width="135px" class="view-header">
|
||||
</el-form-item>
|
||||
|
||||
<el-row gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditor" label="审核人员">
|
||||
<el-input v-model="formData.username"
|
||||
disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item prop="auditTime" label="审核时间">
|
||||
<el-input v-model="formData.auditTime" disabled></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row gutter="20">
|
||||
<el-form-item>
|
||||
<el-table :data="multipleSelection" max-height="500px">
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="username" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
</el-row>
|
||||
|
||||
<el-form-item prop="auditOpinion" label="审核意见">
|
||||
<el-input type="textarea" v-model="formData.auditOpinion" rows="4"
|
||||
maxlength="500"
|
||||
placeholder="请填写您的审核意见"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="auditSign" label="签  字" class="is-required">
|
||||
<sign :qz.sync="formData.auditSign"></sign>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doReview(1)">拒绝</el-button>
|
||||
<el-button @click="doReview(2)" type="warning">返回修改</el-button>
|
||||
<el-button type="primary" @click="doReview(3)">通过</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</guava>
|
||||
|
||||
<el-dialog :visible.sync="fileDialogVisible" class="filedialog" @close="filedialogClose"
|
||||
:close-on-click-modal="false">
|
||||
<div id="videoContainer"></div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
multipleSelection: [],
|
||||
fileDialogVisible: false,
|
||||
videoShow: false,
|
||||
pageForm: {
|
||||
isAudit: false
|
||||
},
|
||||
unions: [],
|
||||
units: [],
|
||||
hdxxlist: [],
|
||||
hdlblist: [],
|
||||
hdzplblist: [],
|
||||
formRules: {
|
||||
auditOpinion: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
},
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'info': httpVueLoader('/components/hd/hdwmInfo.vue'),
|
||||
},
|
||||
methods: {
|
||||
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
doReview(flag) {
|
||||
this.$refs["form"].validate(async (valid) => {
|
||||
if (valid) {
|
||||
const confirm = await this.$confirm('确定要' + (flag === 1 ? '拒绝' : flag === 2 ? '退回修改' : '通过审核') + '吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
if (confirm === "confirm") {
|
||||
this.formData.pass = flag
|
||||
this.formData.ids = JSON.stringify(this.multipleSelection.map(v => v.id))
|
||||
const resp = await $.post(loc() + "/doReview", this.formData)
|
||||
if(resp.code===0){
|
||||
this.$refs.table.clearSelection()
|
||||
this.doSearch()
|
||||
this.$refs.guava.index()
|
||||
this.notifySuccess(resp.msg)
|
||||
}else{
|
||||
this.notifyWarning(resp.msg)
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
openAudit(row) {
|
||||
this.$refs.guava.edit()
|
||||
if (this.multipleSelection.length === 0) {
|
||||
this.$refs.info2.getInfo(row.id)
|
||||
}
|
||||
const {id} = row
|
||||
this.formData = {
|
||||
id: id ? id : null,
|
||||
username: "${@shiro.getPrincipalProperty('username')}",
|
||||
loginname: "${@shiro.getPrincipalProperty('loginname')}",
|
||||
auditTime: moment().format('YYYY-MM-DD'),
|
||||
auditOpinion: '同意'
|
||||
}
|
||||
if (this.$refs['form']) {
|
||||
this.$refs['form'].resetFields()
|
||||
}
|
||||
},
|
||||
viewInfo(row) {
|
||||
this.$refs.info.getInfo(row.id)
|
||||
this.$refs.guava.view()
|
||||
},
|
||||
hdchange(id) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
hdlbchange(id) {
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
initHdxxlist() {
|
||||
$.post(base + '/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdxxlist = data.data[0].children;
|
||||
}
|
||||
});
|
||||
},
|
||||
async flushUnits() {
|
||||
this.$set(this.pageForm, "unitId", "")
|
||||
if ("${@shiro.hasRole('sysadmin')||@shiro.hasRole('A06')||@shiro.hasRole('H03')}" === 'true') {
|
||||
this.units = await getUnits(this.pageForm.unionId)
|
||||
} else {
|
||||
this.units = await getUnits("${@shiro.getPrincipalProperty('unit').getUnionid()}")
|
||||
}
|
||||
},
|
||||
filedialogClose() {
|
||||
//关闭的时候需要销毁video 但是随之dom元素也会被删除！！！！
|
||||
this.imgShow = false;
|
||||
this.videoShow = false;
|
||||
videojs('my-video').dispose();
|
||||
},
|
||||
playvideo(fjurl) {
|
||||
this.fileDialogVisible = true;
|
||||
this.videoShow = true;
|
||||
this.$nextTick(function () {
|
||||
let vc = document.getElementById('videoContainer');
|
||||
let newVideo = document.createElement("div");//创建一个标签
|
||||
newVideo.innerHTML = '<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"></video>';
|
||||
vc.appendChild(newVideo);
|
||||
let option = {autoplay: false, language: 'zh-CN'};
|
||||
let myPlayer = videojs('my-video', option, function onPlayerReady() {
|
||||
let myPlayer = this;
|
||||
myPlayer.src({src: fjurl, type: "video/mp4"});
|
||||
/*videojs.log("播放器已经准备好了!");*/
|
||||
//this.play();
|
||||
});
|
||||
})
|
||||
},
|
||||
},
|
||||
async created() {
|
||||
this.unions = await getUnions()
|
||||
this.flushUnits()
|
||||
this.initHdxxlist();
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,930 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
|
||||
.tpa {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
width: 12%;
|
||||
color: #a0a9b4;
|
||||
background-color: rgb(250, 250, 250);
|
||||
border: 1px solid rgb(220, 220, 220);
|
||||
}
|
||||
|
||||
.tpb {
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
color: #4f576b;
|
||||
width: 15%;
|
||||
border: 1px solid rgb(220, 220, 220);
|
||||
}
|
||||
|
||||
input[type=file] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__header i {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.filedialog .el-dialog__body {
|
||||
padding: 20px 0 0 0;
|
||||
}
|
||||
|
||||
/*video{
|
||||
width: 100%!important;
|
||||
height: 500px!important;
|
||||
outline:none;
|
||||
}*/
|
||||
.video-js {
|
||||
width: 100%;
|
||||
height: 450px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.vjs-tech, .video-js button {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
#app .el-table th.gutter {
|
||||
display: table-cell !important
|
||||
}
|
||||
|
||||
.filedialog .el-dialog {
|
||||
min-height: 500px;
|
||||
}
|
||||
|
||||
|
||||
.video-js .vjs-big-play-button { /* 中间大的播放按钮 */
|
||||
font-size: 2.5em;
|
||||
line-height: 2.3em;
|
||||
height: 2.5em;
|
||||
width: 2.5em;
|
||||
-webkit-border-radius: 2.5em;
|
||||
-moz-border-radius: 2.5em;
|
||||
border-radius: 2.5em;
|
||||
background-color: rgba(115, 133, 159, .5);
|
||||
border-width: 0.12em;
|
||||
margin-top: -1.25em;
|
||||
margin-left: -1.75em;
|
||||
}
|
||||
|
||||
.video-js.vjs-paused .vjs-big-play-button { /* 视频暂停时显示播放按钮 */
|
||||
display: block;
|
||||
}
|
||||
|
||||
.video-js.vjs-error .vjs-big-play-button { /* 视频加载出错时隐藏播放按钮 */
|
||||
display: none;
|
||||
}
|
||||
|
||||
.vjs-loading-spinner { /* 加载圆圈 */
|
||||
font-size: 2.5em;
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
border-radius: 1em;
|
||||
margin-top: -1em;
|
||||
margin-left: -1.5em;
|
||||
}
|
||||
|
||||
.el-image {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #abc5df;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #e5edf6;
|
||||
}
|
||||
|
||||
.view-myvideo-tab {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
background-color: #C0C4CC;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-camera-solid {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.video-toggle-i:hover .el-icon-video-play {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-video-camera-solid, .view-myvideo-tab .el-icon-video-play, .view-myvideo-tab .el-icon-document {
|
||||
color: #000000;
|
||||
line-height: 80px;
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
|
||||
.view-myvideo-tab .el-icon-download {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.el-icon-video-play {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-dialog__body {
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.el-icon-download {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.file-down-span {
|
||||
background: black;
|
||||
opacity: 0.5;
|
||||
z-index: 1000;
|
||||
width: 100px;
|
||||
text-align: center;
|
||||
/*position: absolute;*/
|
||||
position: relative;
|
||||
bottom: -100px;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.file-down-span:hover {
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
.ckdialogclass .el-icon-circle-close {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.form-item-container {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.form-item-container .el-form-item {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.el-upload--picture-card {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
line-height: 98px;
|
||||
}
|
||||
|
||||
.el-upload-list--picture-card .el-upload-list__item {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.el-loading-mask.is-fullscreen .el-loading-spinner {
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
<link rel="stylesheet" href="${base!}/assets/platform/plugins/video/css/video-js.min.css">
|
||||
<script src="${base!}/assets/platform/plugins/video/js/video.min.js"></script>
|
||||
<div id="app" v-cloak>
|
||||
<guava ref="guava">
|
||||
<template>
|
||||
<el-card shadow="never">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-date-picker v-model="pageForm.year"
|
||||
placeholder="年度"
|
||||
type="year"
|
||||
@change="yearChange"
|
||||
value-format="yyyy"></el-date-picker>
|
||||
</div>
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdid" clearable @change="hdchange"
|
||||
placeholder="请选择活动主题">
|
||||
<el-option v-for="o in hdxxlist" :label="o.label"
|
||||
:value="o.value"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.hdlb" placeholder="请选择活动类别" clearable
|
||||
@change="hdlbchange">
|
||||
<el-option v-for="o in hdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.zplb" placeholder="请选择作品类型" clearable>
|
||||
<el-option v-for="o in hdzplblist" :label="o.zname"
|
||||
:value="o.zid"></el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button type="primary" icon="el-icon-search" @click="doSearch"></el-button>
|
||||
</div>
|
||||
|
||||
|
||||
</el-card>
|
||||
|
||||
<el-card class="mt20" shadow="never">
|
||||
<vi-title2 title="作品列表">
|
||||
<template #func>
|
||||
<el-button @click="openAdd" type="primary" size="small">上传作品</el-button>
|
||||
</template>
|
||||
</vi-title2>
|
||||
<el-table :data="tableData">
|
||||
<el-table-column label="序号" type="index" header-align="center" align="center"
|
||||
width="50">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="hdname" label="活动主题" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<!-- <el-table-column prop="hdsbzpzt" label="作品主题" header-align="center" align="center"-->
|
||||
<!-- show-overflow-tooltip></el-table-column>-->
|
||||
<el-table-column prop="sbrname" label="教职工姓名" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="loginname" label="工资号" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="dwname" label="单位" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="ghname" label="分工会" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdlbname" label="活动类别" header-align="center"
|
||||
align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="zplbname" label="作品类别" header-align="center" align="center"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column prop="hdsbsj" label="上传时间" header-align="center" align="center"
|
||||
show-overflow-tooltip>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" prop="auditState" header-align="center"
|
||||
label="申请状态" sortable>
|
||||
<template scope="scope">
|
||||
<span :style="'color:'+scope.row.statecolor">{{scope.row.statename}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="300">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="primary" @click="viewInfo(scope)">查看</el-button>
|
||||
<!-- v-if="scope.row.auditstate==='3999'||scope.row.auditstate==='4100'||scope.row.auditstate==='4250'"-->
|
||||
<el-button
|
||||
|
||||
type="primary" size="mini"
|
||||
@click="openEdit(scope)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.auditstate==='3999'" type="danger"
|
||||
size="mini"
|
||||
@click="dodelete(scope.row.id)">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</el-card>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<template #edit>
|
||||
<el-form :model="AddFormData" label-width="120px" :rules="rules" ref="AddForm">
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="loginname" label="工资号">
|
||||
<el-input value="${@shiro.getPrincipalProperty('loginname')}"
|
||||
readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="username" label="姓名">
|
||||
<el-input value="${@shiro.getPrincipalProperty('username')}"
|
||||
readonly></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="ghname" label="所属工会">
|
||||
<el-input v-model="currentUserGhname" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="mobile" label="手机号码">
|
||||
<el-input v-model="AddFormData.mobile"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-divider content-position="left">活动信息</el-divider>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="hdid" label="活动主题">
|
||||
<el-select v-model="AddFormData.hdid" style="width: 100%"
|
||||
@change="formhdchange">
|
||||
<el-option v-for="o in formhdxxlist" :label="o.hdname" :value="o.hdid"
|
||||
:key="o.hdid">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdzplx" label="活动类别">
|
||||
<el-select v-model="AddFormData.hdzplx" style="width: 100%"
|
||||
@change="formhdlbchange">
|
||||
<el-option v-for="o in formhdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="form-item-container">
|
||||
|
||||
<!-- <el-form-item prop="step_count" label="健步走步数">
|
||||
<el-input-number style="width: 100%" v-model="AddFormData.step_count"></el-input-number>
|
||||
</el-form-item>-->
|
||||
<el-form-item prop="hdzplx2" label="类别">
|
||||
<el-select v-model="AddFormData.hdzplx2" style="width: 100%"
|
||||
@change="changeHdzplx2">
|
||||
<el-option v-for="o in formhdzplblist" :label="o.zname" :value="o.zid"
|
||||
:key="o.zid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="zpmc" label="标题">
|
||||
<el-input v-model="AddFormData.zpmc"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item prop="hdsbzpms" label="作品描述/介绍">
|
||||
<el-input type="textarea" v-model="AddFormData.hdsbzpms"
|
||||
:maxlength="zplb2Config.maxWordCount" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<div v-if="zplb2Config.isUploadPhoto||zplb2Config.isUploadOther">
|
||||
<el-divider content-position="left">作品信息</el-divider>
|
||||
<el-form-item label="照片" required v-if="zplb2Config.isUploadPhoto">
|
||||
<el-upload
|
||||
name="picturefile"
|
||||
:file-list="picturelist"
|
||||
:auto-upload="false"
|
||||
action=""
|
||||
list-type="picture-card"
|
||||
:limit="zplb2Config.photoNum"
|
||||
:on-exceed="pictureExceed"
|
||||
:on-change="pictureChange">
|
||||
<i class="el-icon-plus"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="音/视频、文档" v-if="zplb2Config.isUploadOther">
|
||||
<el-upload
|
||||
name="vadfile"
|
||||
:file-list="vadlist"
|
||||
:auto-upload="false"
|
||||
action=""
|
||||
:limit="zplb2Config.otherFileNum"
|
||||
:on-exceed="vadExceed"
|
||||
:on-change="vadChange">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doAdd(false)">保 存</el-button>
|
||||
<el-button type="primary" @click="doAdd(true)">提 交</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #view>
|
||||
<info ref="info" @playvideo="playvideo"></info>
|
||||
</template>
|
||||
|
||||
<template #public>
|
||||
<el-form :model="EditFormData" label-width="120px" :rules="rules" ref="EditForm">
|
||||
<el-divider content-position="left">基本信息</el-divider>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="loginname" label="工资号">
|
||||
<el-input value="${@shiro.getPrincipalProperty('loginname')}"
|
||||
readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="username" label="姓名">
|
||||
<el-input value="${@shiro.getPrincipalProperty('username')}"
|
||||
readonly></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="ghname" label="所属工会">
|
||||
<el-input v-model="currentUserGhname" readonly></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="mobile" label="手机号码">
|
||||
<el-input v-model="EditFormData.mobile"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-divider content-position="left">活动信息</el-divider>
|
||||
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="hdid" label="活动主题">
|
||||
<el-select v-model="EditFormData.hdid" style="width: 100%"
|
||||
@change="formhdchange">
|
||||
<el-option v-for="o in formhdxxlist" :label="o.hdname" :value="o.hdid"
|
||||
:key="o.hdid">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="hdzplx" label="活动类别">
|
||||
<el-select v-model="EditFormData.hdzplx" style="width: 100%"
|
||||
@change="formhdlbchange">
|
||||
<el-option v-for="o in formhdlblist" :label="o.lname"
|
||||
:value="o.lid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div class="form-item-container">
|
||||
<el-form-item prop="hdzplx2" label="类别"
|
||||
v-if="formhdzplblist&&formhdzplblist.length>0">
|
||||
<el-select v-model="EditFormData.hdzplx2" style="width: 100%"
|
||||
@change="changeHdzplx2">
|
||||
<el-option v-for="o in formhdzplblist" :label="o.zname" :value="o.zid"
|
||||
:key="o.zid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="zpmc" label="标题">
|
||||
<el-input v-model="EditFormData.zpmc"></el-input>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item prop="hdsbzpms" label="作品描述/介绍">
|
||||
<el-input type="textarea" v-model="EditFormData.hdsbzpms"
|
||||
:maxlength="zplb2Config.maxWordCount" show-word-limit></el-input>
|
||||
</el-form-item>
|
||||
<div v-if="zplb2Config.isUploadPhoto||zplb2Config.isUploadOther">
|
||||
<el-divider content-position="left">作品信息</el-divider>
|
||||
<el-form-item label="照片" required v-if="zplb2Config.isUploadPhoto">
|
||||
<el-upload
|
||||
name="picturefile"
|
||||
:file-list="picturelist"
|
||||
:auto-upload="false"
|
||||
action=""
|
||||
list-type="picture-card"
|
||||
:limit="zplb2Config.photoNum"
|
||||
:on-remove="pictureRemove"
|
||||
:on-exceed="pictureExceed"
|
||||
:on-change="pictureChange">
|
||||
<i class="el-icon-plus"></i>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="音/视频、文档" v-if="zplb2Config.isUploadOther">
|
||||
<el-upload
|
||||
name="vadfile"
|
||||
:file-list="vadlist"
|
||||
:auto-upload="false"
|
||||
action=""
|
||||
:limit="zplb2Config.otherFileNum"
|
||||
:on-remove="vadRemove"
|
||||
:on-change="vadChange">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
</el-form>
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="doEdit(false)">保 存</el-button>
|
||||
<el-button type="primary" @click="doEdit(true)">提 交</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</guava>
|
||||
|
||||
|
||||
<el-dialog :visible.sync="fileDialogVisible" class="filedialog" @close="filedialogClose"
|
||||
:close-on-click-modal="false">
|
||||
<div id="videoContainer"></div>
|
||||
</el-dialog>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
mixins: [initTableMixins],
|
||||
data() {
|
||||
return {
|
||||
hdid: GetQueryString("hdid"),
|
||||
editDialogVisible: false,
|
||||
picturelist: [],
|
||||
PicturedialogVisible: false,
|
||||
vadlist: [],
|
||||
currentUserGhname: '',
|
||||
currenttime: moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||
hasSuperAdminRole: "${@shiro.hasRole('sysadmin')}" === 'true' ? true : false,
|
||||
tableData: [],
|
||||
pageForm: {
|
||||
year: new Date().getFullYear() + '',
|
||||
hdid: '',
|
||||
hdlb: '',
|
||||
zplb: '',
|
||||
searchName: '',
|
||||
searchKeyword: '',
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
},
|
||||
videoSrc: '',
|
||||
viewDialogVisible: false,
|
||||
fileDialogVisible: false,
|
||||
imgSrc: '',
|
||||
fileList: [],
|
||||
viewData: {},
|
||||
imgtype: ['gif', 'jpg', 'png', 'jpeg'],
|
||||
videotype: ['flv', 'swf', 'mkv', 'avi', 'rm', 'rmvb', 'wmv', 'mp4', 'mov', 'mpg', 'mpeg'],
|
||||
doctype: ['doc', 'docx', 'xlsx', 'xls', 'txt'],
|
||||
audiotype: ['mp3', 'wma', 'flac', 'wav', 'm4a', 'amr', 'au'],
|
||||
prevImgList: [],
|
||||
img2List: [],
|
||||
videoList: [],
|
||||
docList: [],
|
||||
audioList: [],
|
||||
hdxxlist: [],
|
||||
hdlblist: [],
|
||||
hdzplblist: [],
|
||||
addDialogVisible: false,
|
||||
AddFormData: {},
|
||||
formhdlblist: [],
|
||||
formhdzplblist: [],
|
||||
rules: {
|
||||
hdid: [{required: true, message: '请选择活动主题', trigger: ['blur', 'change']}],
|
||||
hdzplx: [{required: true, message: '请选择活动类别', trigger: ['blur', 'change']}],
|
||||
hdzplx2: [{required: true, message: '请选择作品类别', trigger: ['blur', 'change']}],
|
||||
zpmc: [{required: true, message: '请填写作品类别', trigger: ['blur', 'change']}],
|
||||
hdsbzpzt: [{required: true, message: '请填写作品主题', trigger: ['blur', 'change']}],
|
||||
},
|
||||
EditFormData: {},
|
||||
readytodelfile: [],
|
||||
formhdxxlist: [],
|
||||
yearActivityList: [],
|
||||
zplb2Config: {},
|
||||
}
|
||||
},
|
||||
components: {
|
||||
'info': httpVueLoader('/components/hd/hdwmInfo.vue'),
|
||||
},
|
||||
methods: {
|
||||
|
||||
changeHdzplx2(id) {
|
||||
this.zplb2Config = this.formhdzplblist.find(v => v.zid === id)
|
||||
},
|
||||
yearChange(val) {
|
||||
let activityList = []
|
||||
if (val === null) {
|
||||
this.yearActivityList.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
} else {
|
||||
let enen = this.yearActivityList.filter(v => v.value == val)
|
||||
enen.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
}
|
||||
|
||||
this.hdxxlist = activityList
|
||||
this.$set(this.pageForm, "hdid", null)
|
||||
this.$set(this.pageForm, "hdlb", null)
|
||||
this.$set(this.pageForm, "zplb", null)
|
||||
},
|
||||
formhdchange(id) {
|
||||
this.$set(this.AddFormData, 'hdzplx', null);
|
||||
this.$set(this.AddFormData, 'hdzplx2', null);
|
||||
this.$set(this.EditFormData, 'hdzplx', null);
|
||||
this.$set(this.EditFormData, 'hdzplx2', null);
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.formhdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
formhdlbchange(id) {
|
||||
this.$set(this.AddFormData, 'hdzplx2', null);
|
||||
$.post('/platform/hd/jzghd/sczp/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.formhdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
pictureExceed() {
|
||||
this.$message.warning('照片最多上传' + this.zplb2Config.photoNum + '张');
|
||||
},
|
||||
vadExceed() {
|
||||
this.$message.warning('音/视频、文档最多上传' + this.zplb2Config.otherFileNum + '个');
|
||||
},
|
||||
pictureChange(file, fileList) {
|
||||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1).toLowerCase();
|
||||
const whiteList = this.zplb2Config.photoType
|
||||
if (!whiteList.includes(fileSuffix)) {
|
||||
this.picturelist = []
|
||||
this.$message.warning('上传照片只能是' + whiteList.join(',') + '格式')
|
||||
return false
|
||||
}
|
||||
this.picturelist = fileList
|
||||
},
|
||||
pictureRemove(file, fileList) {
|
||||
if (file.status === 'success') {
|
||||
const length = file.url.lastIndexOf("=") + 1
|
||||
this.readytodelfile.push(file.url.substring(length));
|
||||
this.picturelist.map(v => {
|
||||
const length = v.url.lastIndexOf("=") + 1
|
||||
v.urlId = v.url.substring(length);
|
||||
})
|
||||
this.picturelist = this.picturelist.filter(v => v.urlId !== file.url.substring(length))
|
||||
}
|
||||
},
|
||||
vadChange(file, fileList) {
|
||||
const fileSuffix = file.name.substring(file.name.lastIndexOf(".") + 1).toLowerCase();
|
||||
const whiteList = this.zplb2Config.otherType
|
||||
if (!whiteList.includes(fileSuffix)) {
|
||||
this.vadlist = []
|
||||
this.$message.warning('上传音/视频、文档只能是' + whiteList.join(',') + '格式')
|
||||
return false
|
||||
}
|
||||
this.vadlist = fileList;
|
||||
},
|
||||
vadRemove(file, fileList) {
|
||||
if (file.status === 'success') {
|
||||
const length = file.url.lastIndexOf("=") + 1
|
||||
this.readytodelfile.push(file.url.substring(length));
|
||||
this.vadlist.map(v => {
|
||||
const length = v.url.lastIndexOf("=") + 1
|
||||
v.urlId = v.url.substring(length);
|
||||
})
|
||||
this.vadlist = this.vadlist.filter(v => v.urlId !== file.url.substring(length))
|
||||
}
|
||||
},
|
||||
openAdd() {
|
||||
this.AddFormData = {}
|
||||
this.zplb2Config = {}
|
||||
this.AddFormData.mobile = "${@shiro.getPrincipalProperty('mobile')}";
|
||||
if (this.formhdxxlist.find(v => v.hdid === this.hdid)) {
|
||||
this.AddFormData.hdid = this.hdid;
|
||||
} else if (this.pageForm.hdid) {
|
||||
this.AddFormData.hdid = this.pageForm.hdid;
|
||||
}
|
||||
this.formhdchange(this.AddFormData.hdid)
|
||||
this.picturelist = [];
|
||||
this.vadlist = [];
|
||||
this.$refs.guava.edit()
|
||||
if (this.$refs['AddForm']) {
|
||||
this.$refs['AddForm'].resetFields();
|
||||
}
|
||||
},
|
||||
doAdd(flag) {
|
||||
this.$refs['AddForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (flag && ((this.zplb2Config.isUploadPhoto && this.picturelist.length === 0) ||
|
||||
(this.zplb2Config.isUploadOther && this.vadlist.length === 0))) {
|
||||
this.$message.warning('请上传您的作品');
|
||||
return;
|
||||
}
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '上传中',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
let formdata = new FormData();
|
||||
formdata.append("flag", flag);
|
||||
formdata.append("data", JSON.stringify(this.AddFormData));
|
||||
this.picturelist.forEach(val => {
|
||||
formdata.append("file", val.raw);
|
||||
});
|
||||
this.vadlist.forEach(val => {
|
||||
formdata.append("file", val.raw);
|
||||
});
|
||||
$.ajax({
|
||||
url: "/platform/hd/jzghd/sczp/doSubmit",
|
||||
type: "post",
|
||||
data: formdata,
|
||||
processData: false,
|
||||
contentType: false
|
||||
}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
// this.addDialogVisible = false;
|
||||
this.doSearch();
|
||||
this.$refs.guava.index()
|
||||
this.$message.success('上传成功');
|
||||
} else {
|
||||
this.$message.error('上传失败');
|
||||
}
|
||||
loading.close();
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
openEdit(scope) {
|
||||
this.readytodelfile = [];
|
||||
this.picturelist = [];
|
||||
this.vadlist = [];
|
||||
|
||||
$.post('/platform/hd/wmhd/findOne', {id: scope.row.id}).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.formhdlblist = res.data.hdlblist;
|
||||
this.formhdzplblist = res.data.hdzplblist;
|
||||
this.EditFormData = res.data;
|
||||
this.EditFormData.hdzplx = res.data.hdzplx ? res.data.hdzplx.toString() : "";
|
||||
this.EditFormData.hdzplx2 = res.data.hdzplx2 ? res.data.hdzplx2.toString() : "";
|
||||
this.changeHdzplx2(this.EditFormData.hdzplx2)
|
||||
res.data.piclist.forEach(v => {
|
||||
this.picturelist.push({url: APP_DOMAIN + '/file_server/fileStreamPreview?id=' + v.id})
|
||||
})
|
||||
this.vadlist = res.data.vadlist;
|
||||
}
|
||||
});
|
||||
this.$refs.guava.public()
|
||||
|
||||
|
||||
},
|
||||
doEdit(flag) {
|
||||
this.$refs['EditForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
if (flag && ((this.zplb2Config.isUploadPhoto && this.picturelist.length === 0) ||
|
||||
(this.zplb2Config.isUploadOther && this.vadlist.length === 0))) {
|
||||
this.$message.warning('请上传您的作品');
|
||||
return;
|
||||
}
|
||||
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '上传中',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
let formdata = new FormData();
|
||||
formdata.append("flag", flag);
|
||||
formdata.append("data", JSON.stringify(this.EditFormData));
|
||||
formdata.append("readytodelfile", JSON.stringify(this.readytodelfile));
|
||||
this.picturelist.forEach(val => {
|
||||
if (val.status === 'ready') {
|
||||
formdata.append("file", val.raw);
|
||||
}
|
||||
});
|
||||
this.vadlist.forEach(val => {
|
||||
if (val.status === 'ready') {
|
||||
formdata.append("file", val.raw);
|
||||
}
|
||||
});
|
||||
$.ajax({
|
||||
url: "/platform/hd/jzghd/sczp/doEdit",
|
||||
type: "post",
|
||||
data: formdata,
|
||||
processData: false,
|
||||
contentType: false
|
||||
}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.picturelist = [];
|
||||
this.vadlist = [];
|
||||
this.doSearch();
|
||||
this.$refs.guava.index()
|
||||
this.$message.success('上传成功');
|
||||
} else {
|
||||
this.$message.error('上传失败');
|
||||
}
|
||||
loading.close();
|
||||
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
pageData() {
|
||||
sublime.showLoadingbar();
|
||||
$.post('/platform/hd/jzghd/sczp/pageData', this.pageForm).then(res => {
|
||||
sublime.closeLoadingbar();
|
||||
if (res.code == 0) {
|
||||
this.tableData = res.data.list;
|
||||
this.pageForm.totalCount = res.data.totalCount;
|
||||
}
|
||||
});
|
||||
},
|
||||
pageSizeChange: function (val) {
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange: function (val) {
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
doSearch: function () {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
viewInfo(scope) {
|
||||
this.$refs.info.getInfo(scope.row.id)
|
||||
this.$refs.guava.view()
|
||||
},
|
||||
playvideo(fjurl) {
|
||||
this.fileDialogVisible = true;
|
||||
this.videoShow = true;
|
||||
this.$nextTick(function () {
|
||||
let vc = document.getElementById('videoContainer');
|
||||
let newVideo = document.createElement("div");//创建一个标签
|
||||
newVideo.innerHTML = '<video id="my-video" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto"></video>';
|
||||
vc.appendChild(newVideo);
|
||||
let option = {autoplay: false, language: 'zh-CN'};
|
||||
let myPlayer = videojs('my-video', option, function onPlayerReady() {
|
||||
let myPlayer = this;
|
||||
myPlayer.src({src: fjurl, type: "video/mp4"});
|
||||
/*videojs.log("播放器已经准备好了!");*/
|
||||
//this.play();
|
||||
});
|
||||
})
|
||||
},
|
||||
filedialogClose() {
|
||||
//关闭的时候需要销毁video 但是随之dom元素也会被删除！！！！
|
||||
this.imgShow = false;
|
||||
this.videoShow = false;
|
||||
videojs('my-video').dispose();
|
||||
},
|
||||
downLoad: function (item) {
|
||||
window.open('/platform/hd/wmhd/download?filepath=' + item.fjurl + '&filename=' + item.fjname + "&username=" + this.ckusername);
|
||||
},
|
||||
YlDoc: function (item) {
|
||||
var self = this;
|
||||
window.open('/platform/hd/wmhd/YlDoc?fjurl=' + item.fjurl);
|
||||
},
|
||||
initHdxxlist() {
|
||||
$.post(base + '/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
if (data.code == 0) {
|
||||
this.yearActivityList = data.data
|
||||
let activityList = []
|
||||
data.data.map(v => {
|
||||
activityList = activityList.concat(v.children)
|
||||
})
|
||||
this.hdxxlist = activityList
|
||||
}
|
||||
});
|
||||
},
|
||||
hdchange(id) {
|
||||
this.$set(this.pageForm, 'hdlb', '');
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdlblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
|
||||
this.hdlblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
hdlbchange(id) {
|
||||
this.$set(this.pageForm, 'zplb', '');
|
||||
$.post('/platform/hd/childhd/zpxx/gethdzplblist', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.hdzplblist = data.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
dodelete(id) {
|
||||
this.$confirm('此操作将永久删除该记录, 确定吗?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
$.post('/platform/hd/wmhd/doDelete', {id: id}).then(data => {
|
||||
if (data.code == 0) {
|
||||
this.doSearch();
|
||||
this.$message.success(data.msg);
|
||||
}
|
||||
});
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
},
|
||||
getCurrentUserGhname() {
|
||||
$.post('/platform/hd/childhd/sczp/getGhname').then(data => {
|
||||
this.currentUserGhname = data;
|
||||
});
|
||||
},
|
||||
async getUserActivityGroup() {
|
||||
const {data} = await $.post("/platform/hd/wmhdMange/getUserActivityGroup")
|
||||
this.formhdxxlist = data.filter(v => v.hdflag)
|
||||
|
||||
/*$.post('/platform/hd/wmhd/initHdxxlist').then(data => {
|
||||
this.formhdxxlist = data.data[0].children;
|
||||
});*/
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.initHdxxlist();
|
||||
this.getUserActivityGroup();
|
||||
this.pageData();
|
||||
this.getCurrentUserGhname();
|
||||
if (this.hdid) {
|
||||
setTimeout(() => {
|
||||
this.openAdd()
|
||||
}, 500)
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,306 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<!-- 在线答题-答题页面 -->
|
||||
<style>
|
||||
#qsmEditor .w-e-text-container {
|
||||
height: 450px !important;
|
||||
}
|
||||
|
||||
#qsmEditor div {
|
||||
z-index: 0 !important;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.inputParent input {
|
||||
border: none;
|
||||
border-bottom: 1px solid rgb(220, 223, 230);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.issueList > .el-table__header-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.issueList .el-table__expanded-cell {
|
||||
background-color: rgb(250, 250, 250) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<el-row class="transition-row">
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='index'" class="transition-item">
|
||||
<el-row class="header navbar bg-white shadow">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword">
|
||||
<template slot="prepend">试卷名称</template>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="el-table-container">
|
||||
<el-table :data="tableData" size="medium" header-align="center" align="center" style="width: 100%">
|
||||
<el-table-column
|
||||
label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="试卷名称" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="explain_txt" label="说明" show-overflow-tooltip header-align="center"
|
||||
align="center">
|
||||
<template scope="scope">
|
||||
<span v-html="scope.row.explain_txt"></span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_start_time" label="答题时间" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.row.answer_start_time}}-{{scope.row.answer_end_time}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_num" label="答题次数" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="fraction" label="分值" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建时间" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="200px">
|
||||
<template scope="scope">
|
||||
<el-button type="primary" plain size="small" @click="openAdd(scope.row)">开始答题
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- 答题 -->
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='add'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<div style="padding-left: 20px;padding-right: 20px">
|
||||
<el-row style="text-align: center;margin-bottom: 20px">
|
||||
<h2>{{viewData.name}}</h2>
|
||||
<span style="color: rgb(120,120,120)">考试时间：{{viewData.answer_start_time}} - {{viewData.answer_end_time}}</span>
|
||||
<span style="color: rgb(120,120,120)">分值：({{viewData.fraction}})</span>
|
||||
</el-row>
|
||||
<el-row style="margin-bottom: 20px">
|
||||
<div v-html="viewData.explain_txt"></div>
|
||||
</el-row>
|
||||
|
||||
<el-row v-for="sub,idx in viewData.subjects"
|
||||
style="border-bottom: 1px solid rgb(200,200,200);padding: 20px 0;margin-bottom: 20px">
|
||||
<el-col :span="1">
|
||||
<span style="font-weight: bolder;color: rgb(120,120,120)">第 {{idx+1}} 题：</span>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-row>
|
||||
<div v-html="sub.name" style="display: inline-block"></div>
|
||||
<span style="color: rgb(180,180,180)" v-if="sub.type==1">[单选题]</span>
|
||||
<span style="color: rgb(180,180,180)" v-if="sub.type==2">[多选题]</span>
|
||||
</el-row>
|
||||
|
||||
<el-checkbox-group v-model="sub.val">
|
||||
<el-row v-for="ans in sub.answer">
|
||||
<el-row style="margin-top: 5px">
|
||||
<el-radio v-if="sub.type==1" :label="ans.id" v-model="sub.val">
|
||||
{{ans.option_txt}}
|
||||
</el-radio>
|
||||
|
||||
<el-checkbox v-if="sub.type==2" :label="ans.id">{{ans.option_txt}}
|
||||
</el-checkbox>
|
||||
</el-row>
|
||||
</el-row>
|
||||
</el-checkbox-group>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
<div style="width: 100%;text-align: center;margin-top: 30px">
|
||||
<el-button type="primary" @click="doAdd" style="width: 70%">提交试卷</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
searchName: "name",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
},
|
||||
tableData: [],
|
||||
formData: [],
|
||||
viewData: {},
|
||||
v: 'index',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
openAdd(row) {
|
||||
this.formData = []
|
||||
/*if (moment().format("HH:mm:ss") < row.answer_start_time) {
|
||||
this.$message.warning("未到答题时间")
|
||||
return
|
||||
} else if (moment().format("HH:mm:ss") > row.answer_end_time) {
|
||||
this.$message.warning("答题时间已过")
|
||||
return
|
||||
}*/
|
||||
|
||||
$.get("/platform/hd/zxdt/answer/findOne", {id: row.id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (!data) {
|
||||
this.$message.warning("您今日的答题次数已用完")
|
||||
return
|
||||
}
|
||||
if (code == 0) {
|
||||
data.subjects.forEach(v => {
|
||||
v.val = v.type == 1 ? "" : []
|
||||
})
|
||||
this.viewData = data
|
||||
this.v = 'add'
|
||||
} else {
|
||||
this.$message.warning(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
doAdd() {
|
||||
if (moment().format("HH:mm:ss") > this.viewData.answer_end_time) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: "您已超时,此次作废！",
|
||||
type: 'warning'
|
||||
});
|
||||
this.v = 'index'
|
||||
return
|
||||
}
|
||||
|
||||
let subject = this.viewData.subjects
|
||||
for (let i = 0; i < subject.length; i++) {
|
||||
if (subject[i].val == "" || subject[i].val == []) {
|
||||
this.$notify({
|
||||
title: '警告',
|
||||
message: "第" + (i + 1) + "题未答",
|
||||
type: 'warning'
|
||||
});
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.viewData.subjects.forEach(v => {
|
||||
if (v.type == 1) {
|
||||
this.formData.push({"papers_id": this.viewData.id, "subject_id": v.id, "answer_id": v.val})
|
||||
} else if (v.type == 2) {
|
||||
v.val.forEach(x => {
|
||||
this.formData.push({"papers_id": this.viewData.id, "subject_id": v.id, "answer_id": x})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据提交中...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
$.post(base + "/platform/hd/zxdt/answer/doAdd", {replyList: JSON.stringify(this.formData)}, (data) => {
|
||||
if (data.code == 0) {
|
||||
this.pageData()
|
||||
this.$notify({
|
||||
title: '成功',
|
||||
message: "试卷已提交",
|
||||
type: 'success'
|
||||
});
|
||||
} else {
|
||||
this.$notify({
|
||||
title: '错误',
|
||||
message: data.msg,
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
loading.close()
|
||||
this.v = 'index'
|
||||
}, "json");
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
pageOrder(column) {//按字段排序
|
||||
this.pageForm.pageOrderName = column.prop;
|
||||
this.pageForm.pageOrderBy = column.order;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange(val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageSizeChange(val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageData() {
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/zxdt/answer/pageData", this.pageForm, (res) => {
|
||||
const {code, msg, data} = res
|
||||
if (code == 0) {
|
||||
this.tableData = data.list;
|
||||
this.pageForm.totalCount = data.totalCount;
|
||||
sublime.closeLoadingbar();
|
||||
} else {
|
||||
this.$message.error(msg);
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.pageData();
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,174 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
<style>
|
||||
[v-clock] {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<div v-clock id="app" style="padding: 0 10px;">
|
||||
<div v-show="showMsg"
|
||||
style="margin: 1.2rem 0.20rem 0.4rem 0.20rem;padding: 0.3rem 0.34rem;text-align: center">
|
||||
<div class="weui-msg">
|
||||
<div class="weui-msg__icon-area">
|
||||
<i v-if="flag" class="weui-icon-success weui-icon_msg"></i>
|
||||
<i v-else class="weui-icon-warn weui-icon_msg"></i>
|
||||
</div>
|
||||
<div class="weui-msg__text-area">
|
||||
<h2 class="weui-msg__title">{{msg}}</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-show="!showMsg" style="padding-top: 20px">
|
||||
<div style="width: 100%;text-align: center;color: #1ea0fa"><h2>{{viewData.name}}</h2></div>
|
||||
<div style="width: 100%;margin-top: 20px;font-size: 14px; text-align: center;color: rgb(120,120,120)">
|
||||
<span>考试时间：{{viewData.answer_start_time}} - {{viewData.answer_end_time}}</span>
|
||||
<span>分值：({{viewData.fraction}})</span>
|
||||
</div>
|
||||
<div style="width: 100%;margin-top: 20px" v-if="viewData.explain_txt" v-html="viewData.explain_txt">
|
||||
</div>
|
||||
<hr v-if="viewData.explain_txt"
|
||||
style="margin-top: 20px;border: none;border-bottom: 1px rgb(150,150,150) dashed"/>
|
||||
|
||||
<div style="margin-top: 50px">
|
||||
<van-panel style="margin: 20px 0;box-shadow: 0 0 10px rgb(220,220,220)"
|
||||
v-for="sub,idx in viewData.subjects" :title="(idx+1)+'. '+ getTxt(sub.name)">
|
||||
<!-- 单选-->
|
||||
<div style="padding: 10px" v-if="sub.type==1">
|
||||
<van-radio v-for="ans in sub.answer" :name="ans.id" v-model="sub.val"
|
||||
style="padding: 10px 10px;margin: 0;box-sizing: border-box;">
|
||||
<div style="width: 100%;margin: 5px 0" v-html="ans.option_txt"></div>
|
||||
</van-radio>
|
||||
</div>
|
||||
|
||||
<!-- 多选-->
|
||||
<div style="padding: 10px" v-if="sub.type==2">
|
||||
<van-checkbox-group style="position: relative;box-sizing: border-box;" v-model="sub.val">
|
||||
|
||||
<van-checkbox v-for="ans in sub.answer" shape="square" :name="ans.id"
|
||||
style="padding: 10px 10px;margin: 0;box-sizing: border-box;">
|
||||
<div style="width: 100%;margin: 5px 0" v-html="ans.option_txt"></div>
|
||||
|
||||
</van-checkbox>
|
||||
|
||||
</van-checkbox-group>
|
||||
</div>
|
||||
</van-panel>
|
||||
</div>
|
||||
|
||||
<div style="width: 100%;text-align: center;margin-top: 30px;margin-bottom: 10px">
|
||||
<van-button color="#1ea0fa" v-show="viewData!={}" type="primary" :loading="loading" @click.native="subData"
|
||||
style="width: 70%">
|
||||
提交试卷
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: "#app",
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
showMsg: false,
|
||||
showPage: false,
|
||||
msg: '',
|
||||
flag: false,
|
||||
viewData: {},
|
||||
formData: [],
|
||||
getTxt(val) {
|
||||
if (val) {
|
||||
return val.replace(/<(style|script|iframe)[^>]*?>[\s\S]+?<\/\1\s*>/gi, '').replace(/<[^>]+?>/g, '').replace(/\s+/g, ' ').replace(/ /g, ' ').replace(/>/g, ' ');
|
||||
}
|
||||
return ''
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
subData() {
|
||||
this.formData = []
|
||||
let subject = this.viewData.subjects
|
||||
|
||||
if (moment().format("HH:mm:ss") > this.viewData.answer_end_time) {
|
||||
this.$notify({type: 'danger', message: "您已超时,此次作废！"})
|
||||
this.flag = true
|
||||
this.showMsg = true
|
||||
return
|
||||
}
|
||||
|
||||
for (let i = 0; i < subject.length; i++) {
|
||||
if (subject[i].val == "" || subject[i].val == []) {
|
||||
this.$notify({type: 'warning', message: "第" + (i + 1) + "题未答"})
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.viewData.subjects.forEach(v => {
|
||||
if (v.type == 1) {
|
||||
this.formData.push({"papers_id": this.viewData.id, "subject_id": v.id, "answer_id": v.val})
|
||||
} else if (v.type == 2) {
|
||||
v.val.forEach(x => {
|
||||
this.formData.push({"papers_id": this.viewData.id, "subject_id": v.id, "answer_id": x})
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
this.loading = true
|
||||
$.post("/platform/hd/zxdt/mobile/answer/doAdd", {replyList: JSON.stringify(this.formData)}, (res) => {
|
||||
if (res.code == 0) {
|
||||
this.loading = false
|
||||
this.msg = '您的答卷已提交，感谢您的参与！'
|
||||
this.flag = true
|
||||
this.showMsg = true
|
||||
} else {
|
||||
this.$notify({type: 'danger', message: res.msg})
|
||||
}
|
||||
})
|
||||
},
|
||||
pageData() {
|
||||
this.formData = []
|
||||
$.get("/platform/hd/zxdt/mobile/answer/findOne", (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (!data) {
|
||||
this.msg = "您今日的答题次数已用完"
|
||||
this.flag = true
|
||||
this.showMsg = true
|
||||
return
|
||||
}
|
||||
|
||||
if (code == 0) {
|
||||
|
||||
if (moment().format("HH:mm:ss") < data.answer_start_time) {
|
||||
this.msg = "未到答题时间"
|
||||
this.flag = true
|
||||
this.showMsg = true
|
||||
return
|
||||
} else if (moment().format("HH:mm:ss") > data.answer_end_time) {
|
||||
this.msg = "答题时间已过"
|
||||
this.flag = true
|
||||
this.showMsg = true
|
||||
return
|
||||
}
|
||||
|
||||
data.subjects.forEach(v => {
|
||||
v.val = v.type === 1 ? "" : []
|
||||
})
|
||||
this.viewData = data
|
||||
this.showMsg = false
|
||||
} else {
|
||||
this.msg = msg
|
||||
this.showMsg = true
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,665 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<!-- 在线答题-试卷管理 -->
|
||||
<style>
|
||||
#qsmEditor .w-e-text-container {
|
||||
height: 450px !important;
|
||||
}
|
||||
|
||||
#qsmEditor div {
|
||||
z-index: 0 !important;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.inputParent input {
|
||||
border: none;
|
||||
border-bottom: 1px solid rgb(220, 223, 230);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.issueList > .el-table__header-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.issueList .el-table__expanded-cell {
|
||||
background-color: rgb(250, 250, 250) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<el-row class="transition-row">
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='index'" class="transition-item">
|
||||
<el-row class="header navbar bg-white shadow">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword">
|
||||
<template slot="prepend">试卷名称</template>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button size="medium" type="primary" plain @click="openAdd"><i class="ti-plus"></i>新建试卷
|
||||
</el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="el-table-container">
|
||||
<el-table :data="tableData" size="medium" header-align="center" align="center" style="width: 100%">
|
||||
<el-table-column
|
||||
label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="试卷名称" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="explain_txt" label="说明" show-overflow-tooltip header-align="center"
|
||||
align="center">
|
||||
<template scope="scope">
|
||||
<span v-html="scope.row.explain_txt"></span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_start_time" label="答题时间" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.row.answer_start_time}}-{{scope.row.answer_end_time}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_num" label="答题次数" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="fraction" label="分值" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建时间" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column align="center" label="在线答题二维码">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="small" plain type="primary" @click="saveCode(scope.row.id)">保存二维码
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="200px">
|
||||
<template scope="scope">
|
||||
<el-button size="small" @click="openView(scope.row.id)">查看</el-button>
|
||||
<el-button size="small" type="primary"
|
||||
@click="openEdit(scope.row.id)" plain>编辑
|
||||
</el-button>
|
||||
<el-button size="small" type="danger"
|
||||
@click="doDelete(scope.row.id)" plain>删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- 新增、修改 -->
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='add'||v=='edit'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<el-row v-loading="loading">
|
||||
|
||||
<el-steps :active="stepActive" simple finish-status="success">
|
||||
<el-step title="试卷信息" description=""></el-step>
|
||||
<el-step title="选择题目" description=""></el-step>
|
||||
</el-steps>
|
||||
|
||||
<transition name="el-zoom-in-top">
|
||||
<div v-show="stepActive==0" class="transition-box" style="margin-top: 20px;">
|
||||
<el-form ref="addForm" :model="formData" label-width="60px" label-position="right"
|
||||
:rules="formRules">
|
||||
|
||||
<el-form-item label="试卷名称" class="is-required" prop="name" label-width="120px">
|
||||
<el-input v-model="formData.name"
|
||||
placeholder="请填写试卷名称"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="7">
|
||||
<el-form-item label="可答次数" class="is-required" prop="answer_num"
|
||||
label-width="120px">
|
||||
<el-input-number style="width: 100%" v-model="formData.answer_num"
|
||||
controls-position="right"
|
||||
:min="1" :max="100"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-form-item label="分值" class="is-required" prop="fraction"
|
||||
label-width="120px">
|
||||
<el-input-number style="width: 100%" v-model="formData.fraction"
|
||||
controls-position="right"
|
||||
:min="1" :max="200"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="10">
|
||||
<el-form-item label="答题时间" prop="answer_time"
|
||||
label-width="200px">
|
||||
<el-time-picker
|
||||
value-format="HH:mm:ss"
|
||||
style="width: 100%"
|
||||
is-range
|
||||
v-model="formData.answer_time"
|
||||
range-separator="-"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
placeholder="选择时间范围">
|
||||
</el-time-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-form-item label="说明" prop="explain_txt" label-width="120px">
|
||||
<div id="qsmEditor"></div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button type="primary" @click="next">下一步</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
<transition name="el-zoom-in-bottom">
|
||||
<div v-show="stepActive==1" class="transition-box" style="margin-top: 20px;">
|
||||
<el-row type="flex" justify="end" :gutter="20">
|
||||
|
||||
<div class="btn-group tool-button mt5" style="margin-right: 5px">
|
||||
<el-input placeholder="请输入题目" size="small"
|
||||
v-model="subjectForm.searchKeyword"></el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5" style="margin-right: 5px">
|
||||
<el-select v-model="subjectForm.type" clearable size="small"
|
||||
placeholder="题型">
|
||||
<el-option
|
||||
v-for="item in typeOptions"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button icon="el-icon-search" @click="doSubjectSearch"
|
||||
style="background-color:#409eff;color: white;"
|
||||
size="small"></el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-table :data="subjectTable" row-key="id" ref="multipleSubject"
|
||||
@selection-change="handleSelectionChange" size="medium"
|
||||
@select="selectCheckbox">
|
||||
|
||||
<el-table-column type="selection" width="55"
|
||||
reserve-selection></el-table-column>
|
||||
|
||||
<el-table-column align="center" type="index" header-align="center"
|
||||
label="序号" width="55">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(subjectForm.pageNumber - 1) * subjectForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="name" show-overflow-tooltip label="题目"
|
||||
header-align="center"
|
||||
align="center"></el-table-column>
|
||||
|
||||
<el-table-column prop="type" label="题型" header-align="center" align="center"
|
||||
width="80px">
|
||||
<template scope="scope">
|
||||
<span v-if="scope.row.type==1">单选</span>
|
||||
<span v-if="scope.row.type==2">多选</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column prop="option_txt" show-overflow-tooltip label="正确答案"
|
||||
header-align="center"
|
||||
align="center"></el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="subjectSizeChange"
|
||||
@current-change="subjectNumberChange"
|
||||
:current-page="subjectForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="subjectForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="subjectForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
|
||||
<div style="float: right;margin: 20px 0">
|
||||
<el-button @click="stepActive=0">上一步</el-button>
|
||||
<el-button type="primary" :disabled="subDis" @click="operation">提
|
||||
交
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- 查看 -->
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='view'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<div style="padding-left: 20px;padding-right: 20px">
|
||||
<el-row style="text-align: center;margin-bottom: 20px">
|
||||
<h2>{{viewData.name}}</h2>
|
||||
<span style="color: rgb(120,120,120)">考试时间：{{viewData.answer_start_time}} - {{viewData.answer_end_time}}</span>
|
||||
<span style="color: rgb(120,120,120)">分值：({{viewData.fraction}})</span>
|
||||
</el-row>
|
||||
<el-row style="margin-bottom: 20px">
|
||||
<div v-html="viewData.explain_txt"></div>
|
||||
</el-row>
|
||||
|
||||
<el-row v-for="sub,idx in viewData.subjects"
|
||||
style="border-bottom: 1px solid rgb(200,200,200);padding: 20px 0;margin-bottom: 20px">
|
||||
<el-col :span="1">
|
||||
<span style="font-weight: bolder">{{idx+1}}.</span>
|
||||
</el-col>
|
||||
<el-col :span="23">
|
||||
<el-row>
|
||||
<div v-html="sub.name"></div>
|
||||
</el-row>
|
||||
|
||||
<el-checkbox-group v-model="sub.val">
|
||||
|
||||
<el-row v-for="ans,idx2 in sub.answer">
|
||||
<el-row style="margin-top: 5px">
|
||||
<el-radio v-if="sub.type==1" :label="ans.id" v-model="sub.val">
|
||||
{{ans.option_txt}}
|
||||
</el-radio>
|
||||
|
||||
<el-checkbox v-if="sub.type==2" :label="ans.id">
|
||||
{{ans.option_txt}}
|
||||
</el-checkbox>
|
||||
</el-row>
|
||||
</el-row>
|
||||
|
||||
</el-checkbox-group>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
</el-row>
|
||||
|
||||
<a id="download" style="display: none"></a>
|
||||
<div id="qrcode" style="display: none;width: 500px;height: 500px"></div>
|
||||
</div>
|
||||
<script src="${base!}/assets/platform/js/jquery.qrcode.min.js"></script>
|
||||
<script>
|
||||
let qsmEditor
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
searchName: "name",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
},
|
||||
subjectForm: {
|
||||
searchName: "sub.name",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
type: ""
|
||||
},
|
||||
viewData: {},
|
||||
formData: {},
|
||||
subjectTable: [],
|
||||
tableData: [],
|
||||
multipleSelection: [],
|
||||
multipleSelection2: [],
|
||||
stepActive: 0,
|
||||
tabKey: new Date().getTime(),
|
||||
v: 'index',
|
||||
loading: false,
|
||||
subDis: false,
|
||||
redirect_uri: location.protocol + "//" + location.host,
|
||||
formRules: {
|
||||
name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
fraction: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
answer_num: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
answer_time: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
},
|
||||
typeOptions: [{id: 1, name: "单选题"}, {id: 2, name: "多选题"}],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
IEVersion() {
|
||||
let userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
|
||||
let isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器
|
||||
let isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器
|
||||
let isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
|
||||
if (isIE) {
|
||||
let reIE = new RegExp("MSIE (\\d+\\.\\d+);");
|
||||
reIE.test(userAgent);
|
||||
let fIEVersion = parseFloat(RegExp["$1"]);
|
||||
if (fIEVersion == 7) {
|
||||
return 7;
|
||||
} else if (fIEVersion == 8) {
|
||||
return 8;
|
||||
} else if (fIEVersion == 9) {
|
||||
return 9;
|
||||
} else if (fIEVersion == 10) {
|
||||
return 10;
|
||||
} else {
|
||||
return 6;//IE版本<=7
|
||||
}
|
||||
} else if (isEdge) {
|
||||
return 'edge';//edge
|
||||
} else if (isIE11) {
|
||||
return 11; //IE11
|
||||
} else {
|
||||
return -1;//不是ie浏览器
|
||||
}
|
||||
},
|
||||
dwnCode(name) {
|
||||
let type = 'png';
|
||||
if (this.IEVersion() != -1) {
|
||||
let blob = $("canvas").get(0).msToBlob();
|
||||
window.navigator.msSaveBlob(blob, name + '_' + (new Date()).getTime() + '.' + type);
|
||||
} else {
|
||||
$('#download').attr({
|
||||
href: $("canvas").get(0).toDataURL('image/png').replace("image/png", "image/octet-stream"),
|
||||
download: name + '_' + (new Date()).getTime() + '.' + type
|
||||
}).get(0).click();
|
||||
}
|
||||
},
|
||||
saveCode(id) {
|
||||
let self = this
|
||||
$("#qrcode").html("")
|
||||
$("#qrcode").qrcode({
|
||||
render: "canvas",
|
||||
width: $("#qrcode").width(),
|
||||
height: $("#qrcode").width(),
|
||||
text: self.redirect_uri + '/platform/hd/zxdt/mobile/answer?papers_id=' + id,
|
||||
correctLevel: 3
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.dwnCode("在线答题")
|
||||
})
|
||||
},
|
||||
selectCheckbox(selection, row) {
|
||||
const checked = selection.some(v => v.id == row.id)
|
||||
if (checked) {
|
||||
this.multipleSelection2.push(row.id)
|
||||
} else {
|
||||
this.multipleSelection2.splice(this.multipleSelection2.findIndex(v => v == row.id), 1)
|
||||
}
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
next() {
|
||||
if (!this.formData.explain_txt || !dd3s.html2txt(this.formData.explain_txt)) {
|
||||
this.$message.warning("请填写说明")
|
||||
return
|
||||
}
|
||||
this.$refs["addForm"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.stepActive = 1
|
||||
}
|
||||
})
|
||||
},
|
||||
openView(id) {
|
||||
$.get("/platform/hd/zxdt/papers/findOne", {id: id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (code == 0) {
|
||||
this.viewData = data
|
||||
data.subjects.forEach(v => {
|
||||
if (v.type == 2) {
|
||||
v.val = []
|
||||
v.answer.map((x) => {
|
||||
if (x.is_yes) {
|
||||
v.val.push(x.id)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
v.val = v.answer.find(x => x.is_yes).id
|
||||
}
|
||||
})
|
||||
this.v = 'view'
|
||||
} else {
|
||||
this.$message.error(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
doDelete(id) {
|
||||
let that = this
|
||||
this.$confirm('确定要删除吗', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
callback(a, b) {
|
||||
if ("confirm" == a) {
|
||||
$.post(base + "/platform/hd/zxdt/papers/delete", {id: id}, (data) => {
|
||||
if (data.code == 0) {
|
||||
that.$message.success(data.msg);
|
||||
that.pageData();
|
||||
} else {
|
||||
that.$message.error(data.msg);
|
||||
}
|
||||
}, "json");
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
openAdd() {
|
||||
this.v = 'add'
|
||||
this.formData = {}
|
||||
this.stepActive = 0
|
||||
this.tabKey = new Date().getTime()
|
||||
this.multipleSelection = []
|
||||
this.subjectTable = []
|
||||
this.$nextTick(() => {
|
||||
$('#qsmEditor').html("")
|
||||
E = window.wangEditor
|
||||
qsmEditor = new E('#qsmEditor')
|
||||
qsmEditor.config.uploadImgShowBase64 = true
|
||||
qsmEditor.config.onchange = (html) => {
|
||||
this.$set(this.formData, "explain_txt", html)
|
||||
}
|
||||
qsmEditor.create()
|
||||
})
|
||||
this.subjectData()
|
||||
},
|
||||
openEdit(id) {
|
||||
this.stepActive = 0
|
||||
this.tabKey = new Date().getTime()
|
||||
this.multipleSelection = []
|
||||
this.subjectTable = []
|
||||
$.get("/platform/hd/zxdt/papers/findOne", {id: id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (code == 0) {
|
||||
$('#qsmEditor').html(data.explain_txt)
|
||||
E = window.wangEditor
|
||||
qsmEditor = new E('#qsmEditor')
|
||||
|
||||
qsmEditor.config.onchange = (html) => {
|
||||
this.$set(this.formData, "explain_txt", html)
|
||||
}
|
||||
qsmEditor.create()
|
||||
this.formData = data
|
||||
if (this.formData.answer_start_time && this.formData.answer_end_time) {
|
||||
this.$set(this.formData, 'answer_time', [this.formData.answer_start_time, this.formData.answer_end_time])
|
||||
}
|
||||
|
||||
this.multipleSelection = data.subjects.map(v => {
|
||||
return v.id
|
||||
})
|
||||
this.multipleSelection2 = this.multipleSelection
|
||||
|
||||
this.subjectData()
|
||||
this.v = "edit"
|
||||
} else {
|
||||
this.$message.error(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
operation() {
|
||||
let url
|
||||
if (this.v == 'edit') {
|
||||
url = "/platform/hd/zxdt/papers/doEdit"
|
||||
} else if (this.v == 'add') {
|
||||
url = "/platform/hd/zxdt/papers/doAdd"
|
||||
}
|
||||
|
||||
if (this.multipleSelection.length == 0) {
|
||||
this.$message.warning('请选择题目！');
|
||||
return
|
||||
}
|
||||
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据提交中...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
this.formData.answer_start_time = this.formData.answer_time[0]
|
||||
this.formData.answer_end_time = this.formData.answer_time[1]
|
||||
|
||||
this.$refs["addForm"].validate((valid) => {
|
||||
if (valid) {
|
||||
$.post(base + url, {
|
||||
papers: JSON.stringify(this.formData),
|
||||
subject: JSON.stringify(this.multipleSelection)
|
||||
}, (data) => {
|
||||
if (data.code == 0) {
|
||||
this.v = 'index'
|
||||
this.pageData()
|
||||
this.$message.success(data.msg)
|
||||
} else {
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
loading.close()
|
||||
}, "json");
|
||||
}
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
pageOrder(column) {//按字段排序
|
||||
this.pageForm.pageOrderName = column.prop;
|
||||
this.pageForm.pageOrderBy = column.order;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange(val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageSizeChange(val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
doSubjectSearch() {
|
||||
this.subjectForm.pageNumber = 1;
|
||||
this.subjectData();
|
||||
},
|
||||
subjectNumberChange(val) {//页码更新操作
|
||||
this.subjectForm.pageNumber = val;
|
||||
this.subjectData();
|
||||
},
|
||||
subjectSizeChange(val) {//分页大小更新操作
|
||||
this.subjectForm.pageSize = val;
|
||||
this.subjectData();
|
||||
},
|
||||
pageData() {//加载分页数据
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/zxdt/papers/pageData", this.pageForm, (res) => {
|
||||
const {code, msg, data} = res
|
||||
if (code == 0) {
|
||||
this.tableData = data.list;
|
||||
this.pageForm.totalCount = data.totalCount;
|
||||
sublime.closeLoadingbar();
|
||||
} else {
|
||||
this.$message.error(msg);
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
subjectData() {
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/zxdt/papers/findSubject", this.subjectForm, (res) => {
|
||||
const {code, msg, data} = res
|
||||
if (code == 0) {
|
||||
this.subjectTable = data.list;
|
||||
this.subjectForm.totalCount = data.totalCount;
|
||||
this.$nextTick(() => {
|
||||
const arr = JSON.parse(JSON.stringify(this.multipleSelection2))
|
||||
this.subjectTable.forEach(v => {
|
||||
if (arr.includes(v.id)) {
|
||||
this.$refs.multipleSubject.toggleRowSelection(v, true)
|
||||
}
|
||||
})
|
||||
})
|
||||
sublime.closeLoadingbar();
|
||||
} else {
|
||||
this.$message.error(msg);
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.pageData();
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,240 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<!-- 在线答题-数据分析 -->
|
||||
<style>
|
||||
#qsmEditor .w-e-text-container {
|
||||
height: 450px !important;
|
||||
}
|
||||
|
||||
#qsmEditor div {
|
||||
z-index: 0 !important;
|
||||
}
|
||||
|
||||
.el-divider {
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.inputParent input {
|
||||
border: none;
|
||||
border-bottom: 1px solid rgb(220, 223, 230);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.subList > .el-table__header-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.subList .el-table__expanded-cell {
|
||||
background-color: rgb(250, 250, 250) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<el-row class="transition-row">
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='index'" class="transition-item">
|
||||
<el-row class="header navbar bg-white shadow">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword">
|
||||
<template slot="prepend">试卷名称</template>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="el-table-container">
|
||||
<el-table :data="tableData" size="medium" header-align="center" align="center" style="width: 100%">
|
||||
<el-table-column
|
||||
label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" label="试卷名称" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="explain_txt" label="说明" show-overflow-tooltip header-align="center"
|
||||
align="center">
|
||||
<template scope="scope">
|
||||
<span v-html="scope.row.explain_txt"></span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_start_time" label="答题时间" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.row.answer_start_time}}-{{scope.row.answer_end_time}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="answer_num" label="答题次数" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="fraction" label="分值" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="create_time" label="创建时间" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="200px">
|
||||
<template scope="scope">
|
||||
<el-button type="primary" plain size="small" @click="openView(scope.row.id)">查看详情
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- 查看 -->
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='view'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
</div>
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<el-row style="text-align: center;margin-bottom: 20px">
|
||||
<h2>{{viewData.hd_papers.name}}</h2>
|
||||
<span style="color: rgb(120,120,120)">考试时间：{{viewData.hd_papers.answer_start_time}} - {{viewData.hd_papers.answer_end_time}}</span>
|
||||
<span style="color: rgb(120,120,120)">分值：({{viewData.hd_papers.fraction}})</span>
|
||||
</el-row>
|
||||
<el-row style="margin-bottom: 20px">
|
||||
<div v-html="viewData.hd_papers.explain_txt"></div>
|
||||
</el-row>
|
||||
|
||||
<el-row v-for="sub,idx in viewData.hd_papers.subjects">
|
||||
<el-row>
|
||||
<span style="font-weight: bolder;color: rgb(120,120,120)">第 {{idx+1}} 题：</span>
|
||||
<div v-html="sub.name" style="display: inline-block"></div>
|
||||
<span style="color: rgb(180,180,180)" v-if="sub.type==1">[单选题]</span>
|
||||
<span style="color: rgb(180,180,180)" v-if="sub.type==2">[多选题]</span>
|
||||
</el-row>
|
||||
|
||||
<el-row style="margin: 20px 0">
|
||||
<el-table :row-class-name="tableRowClassName" :data="sub.answer"
|
||||
header-align="center"
|
||||
style="width: 100%">
|
||||
<el-table-column prop="option_txt" label="选项" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
{{scope.row.option_txt}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="xj" label="小计" header-align="center" align="center">
|
||||
</el-table-column>
|
||||
<el-table-column prop="bl" label="比例" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<el-progress v-if="scope.row.bl!=undefined"
|
||||
:percentage="scope.row.bl"></el-progress>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
</el-row>
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
searchName: "name",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
},
|
||||
viewData: {hd_papers: {subjects: [{answer: []}]}},
|
||||
tableData: [],
|
||||
v: 'index',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tableRowClassName(row) {
|
||||
if (!row.row.bl) {
|
||||
return 'last-row';
|
||||
}
|
||||
return '';
|
||||
},
|
||||
openView(id) {
|
||||
$.get("/platform/hd/zxdt/result/findOne", {id: id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (code == 0) {
|
||||
data.hd_papers.subjects.forEach((sub) => {
|
||||
sub.answer.forEach((ans) => {
|
||||
ans.xj = data[sub.id].hasOwnProperty(ans.id) ? data[sub.id][ans.id] : 0
|
||||
ans.bl = (ans.xj / data[sub.id].yxs).toFixed(2) * 100
|
||||
ans.bl = isNaN(ans.bl) ? 0 : ans.bl
|
||||
})
|
||||
sub.answer.push({option_txt: '本题有效填写人次', xj: data[sub.id].yxs})
|
||||
}
|
||||
)
|
||||
this.viewData = data
|
||||
this.v = 'view'
|
||||
} else {
|
||||
this.$message.error(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
pageOrder(column) {//按字段排序
|
||||
this.pageForm.pageOrderName = column.prop;
|
||||
this.pageForm.pageOrderBy = column.order;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange(val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageSizeChange(val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageData() {//加载分页数据
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/zxdt/result/pageData", this.pageForm, (res) => {
|
||||
const {code, msg, data} = res
|
||||
if (code == 0) {
|
||||
this.tableData = data.list;
|
||||
this.pageForm.totalCount = data.totalCount;
|
||||
sublime.closeLoadingbar();
|
||||
} else {
|
||||
this.$message.error(msg);
|
||||
}
|
||||
}, "json");
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.pageData();
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,486 @@
|
||||
<!--#
|
||||
layout("/layouts/platform.html"){
|
||||
#-->
|
||||
<!-- 在线答题-题库管理 -->
|
||||
<style>
|
||||
.el-divider {
|
||||
background-color: #409EFF;
|
||||
}
|
||||
|
||||
.el-divider__text {
|
||||
color: #409EFF;
|
||||
}
|
||||
|
||||
.inputParent input {
|
||||
border: none;
|
||||
border-bottom: 1px solid rgb(220, 223, 230);
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.issueList > .el-table__header-wrapper {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.issueList .el-table__expanded-cell {
|
||||
background-color: rgb(250, 250, 250) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<el-row class="transition-row">
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='index'" class="transition-item">
|
||||
<el-row class="header navbar bg-white shadow">
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-input placeholder="请输入内容" v-model="pageForm.searchKeyword">
|
||||
<template slot="prepend">题目</template>
|
||||
</el-input>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-select v-model="pageForm.type" clearable
|
||||
placeholder="题型">
|
||||
<el-option
|
||||
v-for="item in typeOptions"
|
||||
:label="item.name"
|
||||
:value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
|
||||
<div class="btn-group tool-button mt5">
|
||||
<el-button icon="el-icon-search" @click="doSearch"
|
||||
style="background-color:#409eff;color: white;"></el-button>
|
||||
</div>
|
||||
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button size="medium" type="primary" @click="openAdd"><i class="ti-plus"></i>新建题目
|
||||
</el-button>
|
||||
</div>
|
||||
</el-row>
|
||||
<el-row class="el-table-container">
|
||||
<el-table :data="tableData" size="medium" header-align="center" align="center" style="width: 100%">
|
||||
<el-table-column
|
||||
label="序号" type="index" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span>{{scope.$index+(pageForm.pageNumber - 1) * pageForm.pageSize + 1}} </span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="name" show-overflow-tooltip label="题目" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column prop="type" label="题型" header-align="center" align="center">
|
||||
<template scope="scope">
|
||||
<span v-if="scope.row.type==1">单选</span>
|
||||
<span v-if="scope.row.type==2">多选</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="create_time" label="创建时间" header-align="center"
|
||||
align="center"></el-table-column>
|
||||
<el-table-column label="操作" header-align="center" align="center" width="230px">
|
||||
<template scope="scope">
|
||||
<el-button size="small" @click="openView(scope.row.id)">查看</el-button>
|
||||
<el-button size="small" type="primary"
|
||||
@click="openEdit(scope.row.id)">编辑
|
||||
</el-button>
|
||||
<el-button size="small" type="danger"
|
||||
@click="doDelete(scope.row.id)">删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
<el-row class="el-pagination-container">
|
||||
<el-pagination
|
||||
@size-change="pageSizeChange"
|
||||
@current-change="pageNumberChange"
|
||||
:current-page="pageForm.pageNumber"
|
||||
:page-sizes="[10, 20, 30, 50]"
|
||||
:page-size="pageForm.pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pageForm.totalCount">
|
||||
</el-pagination>
|
||||
</el-row>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='add'||v=='edit'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
<div class="pull-right offscreen-right mt5">
|
||||
<el-button size="medium" type="primary" @click="operation">确 定</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<el-form :model="formData" ref="addForm" label-position="right" :rules="formRules" size="small"
|
||||
label-width="80px">
|
||||
<el-form-item prop="name" label="题目名称">
|
||||
<el-input size="medium" type="textarea" placeholder="请输入题目名称"
|
||||
v-model="formData.name"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="type" label="题目类型">
|
||||
<el-radio-group v-model="formData.type">
|
||||
<el-radio :label="1">单选</el-radio>
|
||||
<el-radio :label="2">多选</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="22">
|
||||
<el-divider content-position="left" class="dia">
|
||||
<span style="color: #3ea1ec;">题目选项</span>
|
||||
</el-divider>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align: right">
|
||||
<el-button @click="formData.answer.push({option_txt:''})"
|
||||
style="margin-top: 10px"
|
||||
icon="el-icon-plus"
|
||||
type="warning" size="mini"></el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-checkbox-group v-model="checkVal">
|
||||
<el-table :data="formData.answer" header-align="center"
|
||||
style="width: 100%">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<el-table-column prop="option_txt" label="选项" header-align="center"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input placeholder="请输入选项名" maxlength="100"
|
||||
v-model="scope.row.option_txt"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_yes" label="正确答案" header-align="center" width="100px"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
|
||||
<el-radio v-model="is_yes" :label="scope.$index+1"
|
||||
v-if="formData.type==1">
|
||||
</el-radio>
|
||||
|
||||
<el-checkbox :label="scope.$index+1"
|
||||
v-if="formData.type==2">
|
||||
</el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" header-align="center" width="150px" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-button icon="el-icon-delete" type="danger"
|
||||
@click="delOptionX(scope)"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-checkbox-group>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<transition name="el-zoom-in-center">
|
||||
<div v-show="v=='view'" class="transition-item">
|
||||
<el-card class="box-card v-box" shadow="never">
|
||||
<div slot="header" class="clearfix">
|
||||
<el-button icon="el-icon-back" type="text" @click="v='index'"
|
||||
style="font-size: 18px">返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<div style="padding: 0 5%; height:calc(100vh - 150px);overflow-y: scroll">
|
||||
<el-form :model="viewData" ref="addForm" label-position="right" size="small"
|
||||
label-width="80px">
|
||||
<el-form-item prop="name" label="题目名称">
|
||||
<el-input readonly size="medium" type="textarea"
|
||||
v-model="viewData.name"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="type" label="题目类型">
|
||||
<el-radio-group v-model="viewData.type">
|
||||
<el-radio disabled :label="1">单选</el-radio>
|
||||
<el-radio disabled :label="2">多选</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="22">
|
||||
<el-divider content-position="left" class="dia">
|
||||
<span style="color: #3ea1ec;">题目选项</span>
|
||||
</el-divider>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-checkbox-group v-model="checkVal">
|
||||
<el-table :data="viewData.answer" header-align="center"
|
||||
style="width: 100%">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<el-table-column prop="option_txt" label="选项" header-align="center"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-input readonly maxlength="100"
|
||||
v-model="scope.row.option_txt"></el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column readonly prop="is_yes" label="正确答案" header-align="center"
|
||||
width="100px"
|
||||
align="center">
|
||||
<template slot-scope="scope">
|
||||
|
||||
<el-radio disabled v-model="is_yes" :label="scope.$index+1"
|
||||
v-if="viewData.type==1">
|
||||
</el-radio>
|
||||
|
||||
<el-checkbox disabled :label="scope.$index+1"
|
||||
v-if="viewData.type==2">
|
||||
</el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-checkbox-group>
|
||||
</el-row>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
</el-row>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
var vue = new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
searchName: "name",
|
||||
searchKeyword: "",
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
pageOrderName: "",
|
||||
pageOrderBy: "",
|
||||
type: ""
|
||||
},
|
||||
viewData: {},
|
||||
formData: {type: 1, answer: [{}, {}, {}, {}]},
|
||||
checkVal: [],
|
||||
is_yes: '',
|
||||
tableData: [],
|
||||
delOption: [],
|
||||
v: 'index',
|
||||
formRules: {
|
||||
name: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
type: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
option_txt: [{required: true, message: '必填', trigger: ['blur', 'change']}],
|
||||
},
|
||||
typeOptions: [{id: 1, name: "单选题"}, {id: 2, name: "多选题"}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
delOptionX(scope) {
|
||||
this.delOption = []
|
||||
if (scope.row.id) {
|
||||
this.delOption.push(scope.row.id)
|
||||
}
|
||||
if (this.formData.type == 1 && scope.$index == this.is_yes - 1) {
|
||||
this.is_yes = ''
|
||||
}
|
||||
if (this.formData.type == 2) {
|
||||
this.checkVal.splice(this.checkVal.indexOf(scope.$index + 1), 1)
|
||||
}
|
||||
this.formData.answer.splice(scope.$index, 1)
|
||||
},
|
||||
openView(id) {
|
||||
$.get("/platform/hd/zxdt/subject/findOne", {id: id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (code == 0) {
|
||||
this.viewData = data
|
||||
if (data.type == 2) {
|
||||
data.answer.forEach((val, idx) => {
|
||||
if (val.is_yes) {
|
||||
this.checkVal.push(idx + 1)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
data.answer.forEach((val, idx) => {
|
||||
if (val.is_yes) {
|
||||
this.is_yes = idx + 1
|
||||
}
|
||||
})
|
||||
}
|
||||
this.v = 'view'
|
||||
} else {
|
||||
this.$message.error(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
doDelete(id) {
|
||||
let that = this
|
||||
this.$confirm('确定要删除吗', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
callback(a, b) {
|
||||
if ("confirm" == a) {//确认后再执行
|
||||
$.get(base + "/platform/hd/zxdt/subject/delete", {id: id}).then(res => {
|
||||
if (res.code == 0) {
|
||||
that.$message.success(res.msg);
|
||||
that.pageData();
|
||||
} else {
|
||||
that.$message.warning(res.msg);
|
||||
}
|
||||
}).catch(err => {
|
||||
that.$message.error(err.msg);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
openAdd() {
|
||||
this.formData = {type: 1, answer: [{}, {}, {}, {}]}
|
||||
this.is_yes = ''
|
||||
this.checkVal = []
|
||||
this.v = 'add'
|
||||
},
|
||||
openEdit(id) {
|
||||
$.get("/platform/hd/zxdt/subject/findOne", {id: id}, (res) => {
|
||||
const {code, data, msg} = res
|
||||
if (code == 0) {
|
||||
this.formData = data
|
||||
if (data.type == 2) {
|
||||
data.answer.forEach((val, idx) => {
|
||||
if (val.is_yes) {
|
||||
this.checkVal.push(idx + 1)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
data.answer.forEach((val, idx) => {
|
||||
if (val.is_yes) {
|
||||
this.is_yes = idx + 1
|
||||
}
|
||||
})
|
||||
}
|
||||
this.v = "edit"
|
||||
} else {
|
||||
this.$message.error(msg)
|
||||
}
|
||||
})
|
||||
},
|
||||
operation() {
|
||||
let url
|
||||
if (this.formData.answer.length < 0) {
|
||||
this.$message.warning('请至少添加一个选项！');
|
||||
return
|
||||
}
|
||||
|
||||
for (let i = 0; i < this.formData.answer.length; i++) {
|
||||
if (!this.formData.answer[i].option_txt) {
|
||||
this.$message.warning('第 ' + (i + 1) + " 个选项的名字未填写！");
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
if (this.formData.type == '2') {
|
||||
if (this.checkVal.length < 1) {
|
||||
this.$message.warning('请至少选择一个选项为正确答案！');
|
||||
return
|
||||
}
|
||||
} else {
|
||||
if (!this.is_yes) {
|
||||
this.$message.warning('请至少选择一个选项为正确答案！');
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
if (this.v == 'edit') {
|
||||
url = "/platform/hd/zxdt/subject/doEdit"
|
||||
} else if (this.v == 'add') {
|
||||
url = "/platform/hd/zxdt/subject/doAdd"
|
||||
}
|
||||
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '数据提交中...',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
|
||||
this.$refs["addForm"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.formData.answer.forEach((value) => {
|
||||
value.is_yes = false
|
||||
})
|
||||
if (this.formData.type == "2") {
|
||||
this.checkVal.forEach((v) => {
|
||||
this.formData.answer[parseInt([v]) - 1].is_yes = true
|
||||
})
|
||||
} else {
|
||||
this.formData.answer[parseInt([this.is_yes]) - 1].is_yes = true
|
||||
}
|
||||
|
||||
$.post(base + url, {
|
||||
subject: JSON.stringify(this.formData),
|
||||
delOption: JSON.stringify(this.delOption)
|
||||
}, (data) => {
|
||||
if (data.code == 0) {
|
||||
this.v = 'index'
|
||||
this.pageData()
|
||||
this.$message.success(data.msg)
|
||||
} else {
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
loading.close()
|
||||
}, "json");
|
||||
}
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1;
|
||||
this.pageData();
|
||||
},
|
||||
pageOrder(column) {//按字段排序
|
||||
this.pageForm.pageOrderName = column.prop;
|
||||
this.pageForm.pageOrderBy = column.order;
|
||||
this.pageData();
|
||||
},
|
||||
pageNumberChange(val) {//页码更新操作
|
||||
this.pageForm.pageNumber = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageSizeChange(val) {//分页大小更新操作
|
||||
this.pageForm.pageSize = val;
|
||||
this.pageData();
|
||||
},
|
||||
pageData() {//加载分页数据
|
||||
sublime.showLoadingbar();
|
||||
$.post(base + "/platform/hd/zxdt/subject/pageData", this.pageForm, (res) => {
|
||||
const {code, msg, data} = res
|
||||
if (code == 0) {
|
||||
this.tableData = data.list;
|
||||
this.pageForm.totalCount = data.totalCount;
|
||||
sublime.closeLoadingbar();
|
||||
} else {
|
||||
this.$message.error(msg);
|
||||
}
|
||||
}, "json");
|
||||
}
|
||||
,
|
||||
},
|
||||
created() {
|
||||
this.pageData();
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user