新增官网配置页面
This commit is contained in:
liaozetao
@@ -23,6 +23,41 @@ export const uploadFile = id => {
|
||||
});
|
||||
};
|
||||
|
||||
export const uploadQiNiuFile = (file) => {
|
||||
console.log(file);
|
||||
let formData = new FormData();
|
||||
formData.append('file', file);
|
||||
return new Promise((resolve, reject) => {
|
||||
request.post('/admin/qiniu/uploadPatch', formData).then(res => {
|
||||
resolve(res);
|
||||
}).catch(e => {
|
||||
reject(e);
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
export const uploadTencentFile = id => {
|
||||
return new Promise((resolve, reject) => {
|
||||
$.ajaxFileUpload({
|
||||
fileElementId: id,
|
||||
url: '/admin/upload/tencent/file',
|
||||
type: 'post',
|
||||
dataType: 'json',
|
||||
secureuri: false,
|
||||
async: true,
|
||||
submitType: 'ajax',
|
||||
success: function (res) {
|
||||
resolve(res);
|
||||
},
|
||||
error: function (res, status, e) {
|
||||
console.error(res);
|
||||
console.error(status);
|
||||
reject(e);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
export const uploadGift = (file) => {
|
||||
let formData = new FormData();
|
||||
console.log(file);
|
||||
|
||||
18
src/api/official/officialConfig.js
Normal file
18
src/api/official/officialConfig.js
Normal file
@@ -0,0 +1,18 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
export const getOfficialConfigList = query => {
|
||||
return request({
|
||||
url: '/admin/official/config/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
});
|
||||
};
|
||||
|
||||
export const saveOfficialConfig = data => {
|
||||
return request({
|
||||
url: '/admin/official/config/save',
|
||||
headers:{"Content-Type": 'application/x-www-form-urlencoded'},
|
||||
method: 'post',
|
||||
data: data
|
||||
});
|
||||
}
|
||||
9
src/api/official/officialRecord.js
Normal file
9
src/api/official/officialRecord.js
Normal file
@@ -0,0 +1,9 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
export const browseFor30Days = query => {
|
||||
return request({
|
||||
url: '/admin/official/browse/record/browseFor30Days',
|
||||
method: 'get',
|
||||
params: query
|
||||
});
|
||||
};
|
||||
487
src/views/official/OfficialConfigView.vue
Normal file
487
src/views/official/OfficialConfigView.vue
Normal file
@@ -0,0 +1,487 @@
|
||||
<template>
|
||||
<section class="content">
|
||||
<div class="box box-danger">
|
||||
<div class="box-body">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1 id="itemTitle"></h1>
|
||||
</section>
|
||||
<!-- .content -->
|
||||
<section class="content">
|
||||
<div id="configTable"></div>
|
||||
<div id="toolbar">
|
||||
<button id="addBtn" class="btn btn-default">
|
||||
<i class="glyphicon glyphicon-plus"></i>增加
|
||||
</button>
|
||||
</div>
|
||||
</section><!-- .content -->
|
||||
</div>
|
||||
<div class="box-body" style="height:150%;">
|
||||
<!-- Content Header (Page header) -->
|
||||
<section class="content-header">
|
||||
<h1 id="browseTitle">官网访问数据-最近30天</h1>
|
||||
</section>
|
||||
<!-- .content -->
|
||||
<div id="browseTable"></div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel">
|
||||
<div class="modal-dialog" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
<h4 class="modal-title" id="modalLabel">H5官网配置</h4>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<form class="form-horizontal">
|
||||
<input type="hidden" name="id" v-model="officialConfig.id" />
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label">iOS下载配置:</label>
|
||||
<div class="col-sm-8">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="iosVersion" class="col-sm-3 control-label">iOS版本号:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="categoryCode" id="categoryCode"
|
||||
v-model="officialConfig.iosVersion" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="iosSkipType" class="col-sm-3 control-label">iOS跳转类型:</label>
|
||||
<div class="col-sm-8">
|
||||
<select name="iosSkipType" id="iosSkipType" class="form-control" data-btn-class="btn-warning" v-model="officialConfig.iosSkipType">
|
||||
<option value="0">AppStore</option>
|
||||
<option value="1">其它H5链接</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="iosSkipUrl" class="col-sm-3 control-label">iOS跳转链接:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="iosSkipUrl" id="iosSkipUrl"
|
||||
v-model="officialConfig.iosSkipUrl" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label">Android下载配置:</label>
|
||||
<div class="col-sm-8">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="androidVersion" class="col-sm-3 control-label">Android版本号:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="androidVersion" id="androidVersion"
|
||||
v-model="officialConfig.androidVersion" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="androidSkipType" class="col-sm-3 control-label">Android跳转类型:</label>
|
||||
<div class="col-sm-8">
|
||||
<select name="androidSkipType" id="androidSkipType" class="form-control" data-btn-class="btn-warning" v-model="officialConfig.androidSkipType">
|
||||
<option value="0">GooglePlay</option>
|
||||
<option value="1">直接下载Apk</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group" v-if="officialConfig.androidSkipType == 0">
|
||||
<label for="androidSkipUrl" class="col-sm-3 control-label">Android跳转链接:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="androidSkipUrl" id="androidSkipUrl"
|
||||
v-model="officialConfig.androidSkipUrl" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="androidNormalUrl" class="col-sm-3 control-label">Android常规包:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="file" style="width: 26%; display: inline-block;" id="normalFile" name="uploadFile" @change="changeFile($event)" v-if="officialConfig.androidNormalUrl == ''"/>
|
||||
<span class="btn col-sm-4" id="normalUploadInfo" style="color:red;"></span>
|
||||
<button class="btn btn-default col-sm-4" type="button" id="normalUploadBtn" v-if="officialConfig.androidNormalUrl == ''">上传</button>
|
||||
<button class="btn btn-danger col-sm-4" type="button" id="normalDelBtn" v-if="officialConfig.androidNormalUrl != ''">删除</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="androidReserveUrl" class="col-sm-3 control-label">Android备用包:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="file" style="width: 26%; display: inline-block;" id="reserveFile" name="uploadFile" v-if="officialConfig.androidReserveUrl == ''"/>
|
||||
<span class="btn col-sm-4" id="reserveUploadInfo" style="color:red;"></span>
|
||||
<button class="btn btn-default col-sm-4" type="button" id="reserveUploadBtn" v-if="officialConfig.androidReserveUrl == ''">上传</button>
|
||||
<button class="btn btn-danger col-sm-4" type="button" id="reserveDelBtn" v-if="officialConfig.androidReserveUrl != ''">删除</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="col-sm-3 control-label">联系方式配置:</label>
|
||||
<div class="col-sm-8">
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact0" class="col-sm-3 control-label">Wechat:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="contact0" id="contact0"
|
||||
v-model="officialConfig.contact0" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact1" class="col-sm-3 control-label">Line:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="contact1" id="contact1"
|
||||
v-model="officialConfig.contact1" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="contact2" class="col-sm-3 control-label">Email:</label>
|
||||
<div class="col-sm-8">
|
||||
<input type="text" class="form-control validate[required]" name="contact2" id="contact2"
|
||||
v-model="officialConfig.contact2" />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
|
||||
<button type="button" class="btn btn-primary" id="save">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import TableHelper from '@/utils/bootstrap-table-helper';
|
||||
import { getOfficialConfigList, saveOfficialConfig } from '@/api/official/config';
|
||||
import { browseFor30Days } from '@/api/official/officialRecord';
|
||||
import { uploadQiNiuFile, uploadTencentFile } from '@/api/common/upload';
|
||||
import { apiResult } from '@/utils/maintainer';
|
||||
import { showLoading, hideLoading } from '@/utils/maintainer';
|
||||
|
||||
export default {
|
||||
name: 'CategoryView',
|
||||
data() {
|
||||
return {
|
||||
files: {},
|
||||
configColumns: [
|
||||
{ field: 'iosVersion', title: 'iOS版本号', align: 'center', width: '15%' },
|
||||
{
|
||||
field: 'iosSkipType',
|
||||
title: 'iOS跳转类型',
|
||||
align: 'center',
|
||||
width: '15%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
if (val == 0) {
|
||||
value = 'AppStore';
|
||||
} else {
|
||||
value = '其它H5链接';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{ field: 'iosSkipUrl', title: 'iOS跳转链接', align: 'center', width: '15%' },
|
||||
{ field: 'androidVersion', title: 'Android版本号', align: 'center', width: '15%' },
|
||||
{
|
||||
field: 'androidSkipType',
|
||||
title: 'Android跳转类型',
|
||||
align: 'center',
|
||||
width: '15%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
if (val == 0) {
|
||||
value = 'GooglePlay';
|
||||
} else if (val == 1) {
|
||||
value = '直接下载Apk';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'android',
|
||||
title: 'Android跳转链接',
|
||||
align: 'center',
|
||||
width: '15%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = 'GooglePlay：';
|
||||
if (row.androidSkipUrl) {
|
||||
value += row.androidSkipUrl;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
value += '<br/>';
|
||||
value += '常规包：';
|
||||
if (row.androidNormalUrl) {
|
||||
value += row.androidNormalUrl;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
value += '<br/>';
|
||||
value += '备用包：';
|
||||
if (row.androidReserveUrl) {
|
||||
value += row.androidReserveUrl;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
value += '<br/>';
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'contact',
|
||||
title: '联系方式',
|
||||
align: 'center',
|
||||
width: '15%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '';
|
||||
value += 'Wechat：';
|
||||
if (row.contact0) {
|
||||
value += row.contact0;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
value += '<br/>';
|
||||
value += 'Line：';
|
||||
if (row.contact1) {
|
||||
value += row.contact1;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
value += '<br/>';
|
||||
value += 'Email：';
|
||||
if (row.contact2) {
|
||||
value += row.contact2;
|
||||
} else {
|
||||
value += '无';
|
||||
}
|
||||
return value;
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'id',
|
||||
title: '操作',
|
||||
align: 'center',
|
||||
width: '15%',
|
||||
formatter: function (val, row, index) {
|
||||
let value = '<button class="btn btn-sm btn-success opt-edit" data-id="' + val + '" data-index="' + index + '">编辑</button>';
|
||||
return value;
|
||||
}
|
||||
}
|
||||
],
|
||||
browseColumns: [
|
||||
{ field: 'dateTime', title: '日期', align: 'center', width: '15%' },
|
||||
{ field: 'clientUv', title: '无线官网UV', align: 'center', width: '15%' },
|
||||
{ field: 'clientPv', title: '无线官网PV', align: 'center', width: '15%' },
|
||||
{ field: 'iosDownloadPv', title: '无线 iOS下载点击次数', align: 'center', width: '15%' },
|
||||
{ field: 'androidDownloadPv', title: '无线 安卓下载点击次数', align: 'center', width: '15%' },
|
||||
{ field: 'pcUv', title: 'PC官网UV', align: 'center', width: '15%' },
|
||||
{ field: 'pcPv', title: 'PC官网PV', align: 'center', width: '15%' },
|
||||
{ field: 'pcIosDownloadPv', title: 'PC iOS下载点击次数', align: 'center', width: '15%' },
|
||||
{ field: 'pcAndroidDownloadPv', title: 'PC 安卓下载点击次数', align: 'center', width: '15%' },
|
||||
],
|
||||
officialConfig: {
|
||||
id: 0,
|
||||
iosVersion: '',
|
||||
iosSkipType: 0,
|
||||
iosSkipUrl: '',
|
||||
androidVersion: '',
|
||||
androidSkipType: 0,
|
||||
androidSkipUrl: '',
|
||||
androidNormalUrl: '',
|
||||
androidReserveUrl: '',
|
||||
contact0: '',
|
||||
contact1: '',
|
||||
contact2: '',
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
this.getBrowse();
|
||||
},
|
||||
methods: {
|
||||
changeFile(event) {
|
||||
console.log(event);
|
||||
let target = event.target;
|
||||
let id = target.id;
|
||||
this.files[id] = target.files[0];
|
||||
},
|
||||
uploadNormal() {
|
||||
let $this = this;
|
||||
uploadQiNiuFile($this.files['normalFile']).then(res => {
|
||||
let data = res.data;
|
||||
console.log(data);
|
||||
if (data && data.length > 0) {
|
||||
let path = data[0];
|
||||
$this.officialConfig.androidNormalUrl = path;
|
||||
$('#normalUploadInfo').html(path);
|
||||
}
|
||||
hideLoading();
|
||||
}).catch(e => {
|
||||
console.error(e);
|
||||
hideLoading();
|
||||
});
|
||||
},
|
||||
uploadReserve() {
|
||||
let $this = this;
|
||||
let file = $('#reserveFile').val();
|
||||
if (file && file.length > 0) {
|
||||
showLoading();
|
||||
uploadTencentFile('reserveFile').then(res => {
|
||||
let path = res.data;
|
||||
if (path) {
|
||||
$this.officialConfig.androidReserveUrl = path;
|
||||
$('#reserveUploadInfo').html(path);
|
||||
}
|
||||
}).finally(() => {
|
||||
hideLoading();
|
||||
});
|
||||
}
|
||||
},
|
||||
init() {
|
||||
this.$nextTick(function () {
|
||||
let $this = this;
|
||||
$this.initTable();
|
||||
$('#addBtn').click(function () {
|
||||
$this.add();
|
||||
});
|
||||
$('#configTable').on('click', '.opt-edit', function () {
|
||||
$this.edit(this);
|
||||
});
|
||||
$('#save').click(function () {
|
||||
$this.save();
|
||||
});
|
||||
$('#normalDelBtn').click(function () {
|
||||
$this.androidNormalUrl = '';
|
||||
});
|
||||
$('#reserveDelBtn').click(function () {
|
||||
$this.androidReserveUrl = '';
|
||||
});
|
||||
$('#normalUploadBtn').click(function () {
|
||||
$this.uploadNormal();
|
||||
});
|
||||
$('#reserveUploadBtn').click(function () {
|
||||
$this.uploadReserve();
|
||||
});
|
||||
});
|
||||
},
|
||||
initTable() {
|
||||
let $this = this;
|
||||
TableHelper.destroy('#configTable');
|
||||
$('#configTable').bootstrapTable({
|
||||
columns: $this.configColumns,
|
||||
cache: false,
|
||||
striped: true,
|
||||
showRefresh: false,
|
||||
pageSize: 10,
|
||||
pagination: true,
|
||||
pageList: [1, 10, 20, 30, 50],
|
||||
search: false,
|
||||
sidePagination: 'server',
|
||||
queryParamsType: 'undefined',
|
||||
queryParams: function queryParams(params) {
|
||||
var param = {
|
||||
pageNum: params.pageNumber,
|
||||
pageSize: params.pageSize,
|
||||
};
|
||||
return param;
|
||||
},
|
||||
ajax:function(request){
|
||||
getOfficialConfigList(request.data).then(res => {
|
||||
let data = res.data;
|
||||
request.success({
|
||||
'rows': data.records,
|
||||
'total': data.total
|
||||
});
|
||||
});
|
||||
},
|
||||
toolbar: '#toolbar',
|
||||
});
|
||||
TableHelper.destroy('#browseTable');
|
||||
$('#browseTable').bootstrapTable({
|
||||
columns: $this.browseColumns,
|
||||
cache: false,
|
||||
striped: true,
|
||||
showRefresh: false,
|
||||
search: false,
|
||||
pageSize: 10,
|
||||
pagination: true,
|
||||
pageList: [1, 10, 20, 30, 50],
|
||||
sidePagination: "client",
|
||||
queryParamsType: "undefined",
|
||||
ajax:function(request){
|
||||
|
||||
},
|
||||
});
|
||||
},
|
||||
getBrowse() {
|
||||
browseFor30Days().then(res => {
|
||||
let data = res.data;
|
||||
TableHelper.load('#browseTable', data);
|
||||
});
|
||||
},
|
||||
add() {
|
||||
this.officialConfig.id = 0;
|
||||
this.officialConfig.iosVersion = '';
|
||||
this.officialConfig.iosSkipType = 0;
|
||||
this.officialConfig.iosSkipUrl = '';
|
||||
this.officialConfig.androidVersion = '';
|
||||
this.officialConfig.androidSkipType = 0;
|
||||
this.officialConfig.androidSkipUrl = '';
|
||||
this.officialConfig.androidNormalUrl = '';
|
||||
this.officialConfig.androidReserveUrl = '';
|
||||
this.officialConfig.contact0 = '';
|
||||
this.officialConfig.contact1 = '';
|
||||
this.officialConfig.contact2 = '';
|
||||
this.show();
|
||||
},
|
||||
edit(obj) {
|
||||
const index = $(obj).data('index');
|
||||
const record = TableHelper.getData('#configTable')[index];
|
||||
this.officialConfig.id = record.id;
|
||||
this.officialConfig.iosVersion = record.iosVersion;
|
||||
this.officialConfig.iosSkipType = record.iosSkipType;
|
||||
this.officialConfig.iosSkipUrl = record.iosSkipUrl;
|
||||
this.officialConfig.androidVersion = record.androidVersion;
|
||||
this.officialConfig.androidSkipType = record.androidSkipType;
|
||||
this.officialConfig.androidSkipUrl = record.androidSkipUrl;
|
||||
this.officialConfig.androidNormalUrl = record.androidNormalUrl;
|
||||
this.officialConfig.androidReserveUrl = record.androidReserveUrl;
|
||||
this.officialConfig.contact0 = record.contact0;
|
||||
this.officialConfig.contact1 = record.contact1;
|
||||
this.officialConfig.contact2 = record.contact2;
|
||||
this.show();
|
||||
},
|
||||
show() {
|
||||
$('#editModal').modal('show');
|
||||
},
|
||||
save() {
|
||||
let data = {
|
||||
id: new Number(this.officialConfig.id),
|
||||
iosVersion: this.officialConfig.iosVersion,
|
||||
iosSkipType: new Number(this.officialConfig.iosSkipType),
|
||||
iosSkipUrl: this.officialConfig.iosSkipUrl,
|
||||
androidVersion: this.officialConfig.androidVersion,
|
||||
androidSkipType: new Number(this.officialConfig.androidSkipType),
|
||||
androidSkipUrl: this.officialConfig.androidSkipUrl,
|
||||
androidNormalUrl: this.officialConfig.androidNormalUrl,
|
||||
androidReserveUrl: this.officialConfig.androidReserveUrl,
|
||||
contact0: this.officialConfig.contact0,
|
||||
contact1: this.officialConfig.contact1,
|
||||
contact2: this.officialConfig.contact2,
|
||||
};
|
||||
if (data.id == 0) {
|
||||
data.id = null;
|
||||
}
|
||||
saveOfficialConfig(data).then(res => {
|
||||
console.log(res);
|
||||
apiResult(res);
|
||||
TableHelper.doRefresh('#configTable');
|
||||
TableHelper.doRefresh('#browseTable');
|
||||
$('#editModal').modal('hide');
|
||||
});
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
Reference in New Issue
Block a user