<!DOCTYPE HTML>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
|
<meta name="renderer" content="webkit|ie-comp|ie-stand">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport"
|
content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
|
<meta http-equiv="Cache-Control" content="no-siteapp"/>
|
<!-- 本框架基本脚本和样式 -->
|
<script type="text/javascript"
|
th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript"
|
th:src="@{/js/systools/MBase.js}"></script>
|
<link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}">
|
<script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/MJsBase.js}"></script>
|
</head>
|
<body class="container-fluid">
|
<div id="app" class="pd-10">
|
<!-- 搜索框部分start -->
|
<div class="row form-head">
|
<form class="form-inline" id="serchform">
|
</form>
|
</div>
|
|
<div class="row mt-10" style="padding: 20px;">
|
<el-table ref="multipleTable" :data="tableData" border style="width: 100%">
|
<el-table-column type="selection" width="55">
|
</el-table-column>
|
<el-table-column type="expand">
|
<template slot-scope="props">
|
<el-form label-position="left" inline class="demo-table-expand">
|
<el-form-item v-for="(item, index) in props.row.salonAttr" :label="item.attrName">
|
<span>{{ item.attrValue }}</span>
|
</el-form-item>
|
</el-form>
|
</template>
|
</el-table-column>
|
<el-table-column prop="shopName" label="门店"></el-table-column>
|
<el-table-column prop="createTime" label="报名时间"></el-table-column>
|
<el-table-column prop="nickName" label="会员名称"></el-table-column>
|
<el-table-column prop="phone" label="联系电话"></el-table-column>
|
<el-table-column prop="status" :formatter="statusFormatter" label="报名状态"></el-table-column>
|
<el-table-column prop="status" label="操作">
|
<template slot-scope="scope">
|
<el-button type="text" size="small" @click="verifyStatus(scope.row.id, 2)">报名通过</el-button>
|
<el-button type="text" size="small" @click="verifyStatus(scope.row.id, 3)">报名不通过</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="pageVo.pageNum"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="pageVo.limit"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="pageVo.total">
|
</el-pagination>
|
</div>
|
</div>
|
<script type="text/javascript">
|
var vue = new Vue({
|
el: "#app",
|
data: {
|
id: "",
|
tableData: [],
|
pageVo: {
|
pageNum : 1,
|
offset: 0,
|
limit: 10,
|
total: 0
|
}
|
},
|
created: function () {
|
var id = $.query.get("id");
|
this.id = id;
|
this.initTableData(id, this.pageVo.limit, this.pageVo.offset);
|
},
|
methods: {
|
initTableData: function (id, limit, offset) {
|
var _this = this;
|
var data = {};
|
data.offset = offset;
|
data.limit = limit;
|
data.actId = id;
|
AjaxProxy.requst({
|
app: _this,
|
data: data,
|
url: basePath + '/admin/shopActivitiesSalon/findSalonRecord',
|
callback: function (data) {
|
_this.pageVo.total = data.total;
|
for (var i = 0, length = data.rows.length; i < length; i++) {
|
_this.tableData = [];
|
_this.tableData.push(data.rows[i]);
|
}
|
console.log(data);
|
}
|
})
|
},
|
statusFormatter: function (row, column) {
|
switch (row.status) {
|
case 1 :
|
return "报名中";
|
case 2 :
|
return "报名通过";
|
case 3:
|
return "报名不通过";
|
default:
|
return "-";
|
}
|
},
|
handleCurrentChange: function (val) {
|
console.log("handleCurrentChange", val);
|
this.pageVo.offset = (val - 1) * this.pageVo.limit;
|
this.pageVo.pageNum = val;
|
this.initTableData(this.id, this.pageVo.limit, this.pageVo.offset);
|
},
|
handleSizeChange: function (val) {
|
console.log("handleSizeChange", val);
|
this.pageVo.limit = val;
|
this.initTableData(this.id, this.pageVo.limit, this.pageVo.offset);
|
},
|
verifyStatus: function (id, val) {
|
var _this = this;
|
$.AjaxProxy().invoke(basePath + '/admin/shopActivitiesSalon/verifyStatus/' + id + "/" + val, function (loj) {
|
_this.initTableData(_this.id, _this.pageVo.limit, _this.pageVo.offset);
|
})
|
}
|
}
|
});
|
</script>
|
</body>
|
</html>
|