canyin-project/ybcy/views/admin/apply/platform_add.php
2024-11-01 16:07:54 +08:00

613 lines
34 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<?php if($this->params['site_image']):?>
<link rel="shortcut icon" type="image/x-icon" href="<?$this->params['site_image']?>" />
<?php else:?>
<link rel="shortcut icon" type="image/x-icon" href="<?=Yii::$app->request->baseUrl?>/web/favicon.ico" />
<?php endif;?>
<title>
<?php if($this->params['site_title']):?>
<?php echo $this->params['site_title']; ?>
<?php else:?>
应用管理后台
<?php endif;?>-添加平台
</title>
<link rel="stylesheet" type="text/css" href="<?=Yii::$app->request->baseUrl?>/web/static/css/globle.css" />
<script src="<?=Yii::$app->request->baseUrl?>/web/static/js/config.js" type="text/javascript" charset="utf-8"></script>
</head>
<style>
.imgbox {
width: 100px;
height: 100px;
}
.checkbox .el-checkbox {
border: 1px solid #F3F6FB;
position: relative;
width: 100px;
height: 100px;
}
.checklabel-zjtd {
left: 0px;
}
.checkbox .el-checkbox .el-checkbox__input {
position: absolute;
bottom: 5px;
left: 42px;
}
.channel-icon img {
width: 32px;
height: 32px;
}
.namelogo {
width: 54px;
height: 54px;
border-radius: 50%;
}
.hed-right .el-button {
height: 38px;
}
.hed-right .btn-jrpt {
width: 130px;
}
.hed-right .btn-ty {
width: 104px;
}
.mar_t3 {
margin-top: 3px;
}
.avatar-uploader .el-upload {
width: 100px;
height: 100px;
line-height: 100px;
}
.el-icon-plus:before {
font-size: 20px;
}
</style>
<body>
<div class="pHead">
<div class="publicHeader">
<?php echo $this->render('@app/views/admin/public/publicHeader.html'); ?>
</div>
</div>
<div class="pLeft">
<div class="publicAside hei">
<?php echo $this->render('@app/views/admin/public/publicAside.html'); ?>
</div>
</div>
<!--<div class="upimg">-->
<!-- <div class="attachment hei">-->
<?php //echo $this->render('@app/views/admin/public/attachment-img.html'); ?>
<!--</div>-->
<!--</div>-->
<div class="yb_body">
<div class="layout" id="platformList" v-cloak v-loading="cardLoading">
<el-container>
<el-container>
<el-main>
<div class="main" style="min-width: 800px">
<div class="ba_f">
<div class="main-tab ba_f bor_rad5 pad_tb_30">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="平台信息" name="msg">平台信息</el-tab-pane>
<!--<el-tab-pane label="用户管理" name="user">用户管理</el-tab-pane>-->
<!--<el-tab-pane label="远程附件" name="enclosure">远程附件</el-tab-pane>-->
</el-tabs>
<div class="tips mar_t20 t_l flex flex-y-center">
<span class="iconfont icontishi maincolor fon_16 mar_r10 mar_t3"></span>
<p class="fon_12 maincolor">提示:请真实填写以下相关信息,保存后请勿随意修改。</p>
</div>
</div>
<div class="main-con pad_tb_30">
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">排序</div>
<div class="flex-grow-1 t_l right-width">
<el-input v-model="formInline.sort" placeholder="排序" class="elinput"></el-input>
</div>
</div>
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>平台名称</div>
<div class="flex-grow-1 t_l right-width">
<el-input v-model="formInline.apply_name" placeholder="请输入平台名称" class="elinput"></el-input>
</div>
</div>
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">平台logo</div>
<div class="flex-grow-1 t_l right-width">
<div class="imgbox bor_rad5 ba_f5">
<el-upload class="avatar-uploader" :action="upload_url" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</div>
<!-- <div class="uploadSource bor_de rel flex curs" v-if="imageUrl">-->
<!-- <label class="statusLabel curs" @mouseenter="enter(1)" @mouseleave="leave(1)">-->
<!-- <i class="el-icon-check" ref="imgicon1"></i>-->
<!-- <i class="el-icon-close" @click="deleteMultiImage(imageUrl,1)"></i>-->
<!-- </label>-->
<!-- <img :src="imageUrl" @click='test(1)' class="wid"/>-->
<!-- </div>-->
<!-- <div class="uploadSource flex-center curs" v-else @click='test(1)'>-->
<!-- <i class="el-icon-plus fon_40 color_d9"></i>-->
<!-- </div>-->
<!-- <attachment-img ref="img1" type="img" @attachment='imgadd1'></attachment-img>-->
</div>
</div>
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">二维码</div>
<div class="flex-grow-1 t_l right-width">
<div class="imgbox bor_rad5 ba_f5">
<el-upload class="avatar-uploader" :action="upload_url2" :show-file-list="false" :on-success="handleAvatarSuccess2" :before-upload="beforeAvatarUpload">
<img v-if="imageUrl2" :src="imageUrl2" class="avatar">
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</div>
<!-- <div class="uploadSource bor_de rel flex curs" v-if="imageUrl2">-->
<!-- <label class="statusLabel curs" @mouseenter="enter(2)" @mouseleave="leave(2)">-->
<!-- <i class="el-icon-check" ref="imgicon1"></i>-->
<!-- <i class="el-icon-close" @click="deleteMultiImage(imageUrl2,2)"></i>-->
<!-- </label>-->
<!-- <img :src="imageUrl2" @click='test(2)' class="wid"/>-->
<!-- </div>-->
<!-- <div class="uploadSource flex-center curs" v-else @click='test(2)'>-->
<!-- <i class="el-icon-plus fon_40 color_d9"></i>-->
<!-- </div>-->
<!-- <attachment-img ref="img2" type="img" @attachment='imgadd2'></attachment-img>-->
</div>
</div>
<!-- <div class="flex-bet wid pad_tb_20">-->
<!-- <div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>版本</div>-->
<!-- <div class="flex-grow-1 t_l right-width">-->
<!-- <el-radio-group v-model="formInline.apply_type">-->
<!-- <el-radio-->
<!-- v-for="item in radioOptions"-->
<!-- :key="item.id"-->
<!-- :value="item.id"-->
<!-- :label="item.id"-->
<!-- @change="radioChange"-->
<!-- >{{item.use_name}}-->
<!-- </el-radio>-->
<!-- </el-radio-group>-->
<!-- </div>-->
<!-- </div>-->
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>门店模式</div>
<div class="flex-grow-1 t_l right-width">
<el-radio-group v-model="formInline.shopModel" @change="storeType">
<el-radio label="1" value='1'>单门店
</el-radio>
<el-radio label="2" value='2'>多门店
</el-radio>
</el-radio-group>
</div>
</div>
<div class="flex wid pad_tb_20" v-if="formInline.shopModel=='2'">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>可创建门店数量</div>
<div class=" t_l ">
<div class=" t_l mar_t10 " v-if="!storeFlag">
<el-input v-model="formInline.shopNum" placeholder="请输入门店数量" class="elinput"></el-input>
</div>
</div>
<el-checkbox v-model="storeFlag" class="mar_l20" v-if="formInline.shopModel=='2'">无限</el-checkbox>
</div>
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>应用渠道</div>
<div class="flex-grow-1 t_l right-width">
<div class="checkbox">
<el-checkbox-group v-model="formInline.channel_str">
<el-checkbox v-for="item in channelOptions" :label="item.name" :key="item.id" @change="handleCheckedCitiesChange1">
<div class="checklabel ab mar_b20">
<div class="channel-icon flex-center"><img :src="item.channel_image" class="wid" /></div>
<div class="mar_t5"> {{item.use_name}}</div>
</div>
</el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
<div class="flex-bet wid pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">商家端</div>
<div class="flex-grow-1 t_l right-width">
<el-checkbox-group v-model="formInline.service">
<el-checkbox v-for="item in operation3" :label="item.name" :key="item.id" disabled size="medium">
{{item.use_name}}
</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="flex-bet wi d pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">应用插件</div>
<div class="flex-grow-1 t_l right-width flex">
<div>
<el-checkbox-group v-model="formInline.use_str">
<el-checkbox v-for="item in operation2" :label="item.name" :key="item.id" border size="medium">
{{item.use_name}}
</el-checkbox>
</el-checkbox-group>
</div>
<div class="mar_l20">
<el-checkbox-group v-model="formInline.instore">
<el-checkbox true-label="1" false-label="2" border size="medium">店内功能</el-checkbox>
</el-checkbox-group>
</div>
<div class="mar_l20">
<el-checkbox-group v-model="formInline.takeout">
<el-checkbox true-label="1" false-label="2" border size="medium">外卖功能</el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
<div class="flex-bet wi d pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left">增值插件</div>
<div class="flex-grow-1 t_l right-width">
<el-checkbox-group v-model="formInline.plug_str">
<el-checkbox v-for="item in operation" :label="item.name" :key="item.id" @change="handleCheckedCitiesChange" border size="medium">
{{item.use_name}}
</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="flex-bet wi d pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>配送支持</div>
<div class="flex-grow-1 t_l right-width">
<el-checkbox-group v-model="formInline.deliveryMode">
<el-checkbox v-for="item in distList" :label="item.value" :key="item.value" size="medium">{{ item.name}}</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="flex-bet wi d pad_tb_20">
<div class="flex-grow-0 t_r pad_r_25 right-left"><span class="color_red">*</span>到期时间</div>
<div class="flex-grow-1 t_l right-width">
<!-- <el-input v-model="formInline.end_time" placeholder="" class="elinput mar_r20"
disabled></el-input> -->
<!-- <el-date-picker v-model="formInline.timeData" v-if="!times" type="daterange"
range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期">
</el-date-picker> -->
<el-date-picker v-model="formInline.timeData" type="datetime" v-if="!times" placeholder="选择到期时间">
</el-date-picker>
<el-checkbox v-model="times" class="mar_l20">永久</el-checkbox>
</div>
</div>
</div>
</div>
<div class="ba_f mar_t20 pad_30 main-button">
<el-button type="primary" class="tijiao" @click="onSubmit">下一步</el-button>
</div>
</div>
</el-main>
</el-container>
</el-container>
</div>
</div>
<script>
$(document).ready(function () {
$(".slimScrollDiv ul .main-nav-li a").eq(1).addClass("menu_active");
$(".main-nav .main-nav-li .submenu").eq(1).addClass("block");
$(".main-nav .main-nav-li .submenu").children().children().eq(1).addClass("menu_active2")
});
</script>
<script>
new Vue({
el: '#platformList',
created() {
_this = this;
this.init();
},
data: function () {
return {
cardLoading: true,
activeName: 'msg',
id: '',
formInline: {
sort: '1',
apply_name: '',
apply_type: 1,
create_shop_count: '',
time_type: '',
end_time: '',
timeData: '',
plug_str: ['cashier'],
channel_str: ['mini'],
use_str: ['balanceRecharge', 'signIndex', 'integralShop'],
apply_image: {},
apply_qr_code: {},
shopModel: '2',
shopNum: 50,
numType: '',
service: '',
instore: '1',
takeout: '1',
deliveryMode: ['1', '2', '3', '4', '5', '6', '7', '8', '9']
},
times: true,
storeFlag: false,
channelOptions: [
{
value: '1',
label: '微信公众号',
icon: './web/static/images/platform/icon_wx.png'
},
{
value: '2',
label: '微信小程序',
icon: './web/static/images/platform/icon_xcx.png'
},
{
value: '3',
label: '支付宝小程序',
icon: './web/static/images/platform/icon_zfb.png'
},
{
value: '4',
label: '百度小程序',
icon: './web/static/images/platform/icon_bd.png'
},
{
value: '5',
label: '字节跳动小程序',
icon: './web/static/images/platform/icon_zjtd.png'
}
],
distList:[],
radioOptions: [],
operation: [],
operation2: [],
operation3: [],
edition: '1',
img: '',
imageUrl: '',
upload_url: "<?= Yii::$app->urlManager->createUrl(['admin/common/upload']);?>",
imageUrl2: '',
upload_url2: "<?= Yii::$app->urlManager->createUrl(['admin/common/upload']);?>",
}
},
methods: {
storeType(val) {
console.log(111, val)
},
enter(i = 0) {
this.$refs['imgicon' + i].style.display = 'none'
},
leave(i = 0) {
this.$refs['imgicon' + i].style.display = 'inline-block'
},
test(i = 0) {
// console.log(this.$refs, i)
this.$refs['img' + i].dialogVisible = true
},
imgadd1(url) {
this.imageUrl = url.str
},
imgadd2(url) {
this.imageUrl2 = url.str
},
deleteMultiImage(item, index, type) {
//typem没传是单图multigraph多图index上传图片组件排序
Array.prototype.remove = function (val) {
var index = this.indexOf(val);
if (index > -1) {
this.splice(index, 1);
}
};
if (type == 'multigraph') {
} else {
switch (index) {
case 1:
this.imageUrl = '';
break
case 2:
this.imageUrl2 = '';
break
}
}
},
async init() {
this.getapplylist()
// this.getpluglist()
// this.getPassYearFormatDate ()
},
//获取平台列表
async getapplylist() {
res = await utils.requestPost({ data: { 'name': 'channel' }, url: "admin/apply/get-app-info" }, this)
if (res.code == 1) {
console.log(res.data)
this.cardLoading = false
this.radioOptions = res.data.app //可用版本
this.channelOptions = res.data ? res.data.channel_list : '' //版本对应可用渠道
this.operation = res.data ? res.data.plug_list : [] //版本可用插件
this.operation2 = res.data ? res.data.use_list : [] //应用插件
this.operation3 = res.data ? res.data.service_list : [] //商家端
this.formInline.service = res.data.service
this.distList=res.data.deliveryMode
}
},
//获取插件列表
// async getpluglist() {
// res = await utils.requestGet({
// data: '',
// url: "admin/plug/getpluglist"
// }, this)
// if (res.code == 1) {
// this.operation = res.data
// }
// },
async radioChange(value) {
console.log(value, this.radioOptions[value - 1].model_name)
res = await utils.requestPost({ data: { 'app_id': value, 'model_name': this.radioOptions[value - 1].model_name }, url: "admin/app/change-channel" }, this)
if (res.code == 1) {
this.channelOptions = res.data ? res.data.channel_list : '' //版本对应可用渠道
this.operation = res.data ? res.data.plug_list : '' //版本可用插件
}
},
//渠道选择
handleCheckedCitiesChange1(value) {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.formInline.channel_str.length;
},
//可用插件选择
handleCheckedCitiesChange(value) {
// let checkedCount = value.length;
// this.checkAll = checkedCount === this.formInline.plug_str.length;
// this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
},
handleClick(tab, event) {
if (tab.name == 'msg') {
location.href = "<?= Yii::$app->urlManager->createUrl('admin/apply/platform_add');?>";
}
},
getPassYearFormatDate() {
var nowDate = new Date()
var date = new Date(nowDate)
date.setDate(date.getDate() + 365)
var seperator1 = '-'
var year = date.getFullYear()
var month = date.getMonth() + 1
var strDate = date.getDate()
if (month >= 1 && month <= 9) {
month = '0' + month
}
if (strDate >= 0 && strDate <= 9) {
strDate = '0' + strDate
}
var formatDate = year + seperator1 + month + seperator1 + strDate
this.getNowFormatDate(formatDate)
},
getNowFormatDate(formatDate) {
var date = new Date()
var seperator1 = '-'
var year = date.getFullYear()
var month = date.getMonth() + 1
var strDate = date.getDate()
if (month >= 1 && month <= 9) {
month = '0' + month
}
if (strDate >= 0 && strDate <= 9) {
strDate = '0' + strDate
}
var nowData = year + seperator1 + month + seperator1 + strDate
this.formInline.timeData = [nowData, formatDate]
},
//提交数据
async onSubmit() {
const formdata = new FormData()
let start_time = '';
let end_time = '';
if (this.formInline.timeData && !this.times) {
// start_time = utils.changeDate(this.formInline.timeData[0])
end_time = utils.changeDate(this.formInline.timeData)
// formdata.append('start_time', start_time)
// formdata.append('end_time', end_time)
// this.formInline.start_time = start_time
this.formInline.end_time = end_time
}
this.formInline.time_type = this.times ? 2 : 1
// this.formInline.apply_image = this.imageUrl
// this.formInline.apply_qr_code = this.imageUrl2
if (this.formInline.shopModel == '2') {
this.formInline.shopNum = this.formInline.shopNum
}
if (this.storeFlag) {
this.formInline.shopNum = 0;
}
// formdata.append('apply_image', this.imageUrl)
// formdata.append('apply_qr_code', this.imageUrl2)
// formdata.append('apply_type', this.formInline.apply_type)
// formdata.append('plug_str', this.formInline.plug_str)
// formdata.append('channel_str', this.formInline.channel_str)
// formdata.append('apply_name', this.formInline.apply_name)
// formdata.append('create_shop_count', this.formInline.create_shop_count)
// formdata.append('time_type', this.formInline.time_type)
// // formdata.append('end_time', this.formInline.end_time)
// formdata.append('sort', this.formInline.sort)
// console.log('formInline', this.formInline,formdata)
// return
// Object.assign(this.formInline, formdata);
if (this.formInline.apply_name == '') {
this.$message.error('请输入平台名称')
return
} else if (this.formInline.channel_str.length <= 0) {
this.$message.error('请选择应用渠道')
return
} else if (this.formInline.time_type == 1 && this.formInline.end_time == '') {
this.$message.error('请选择到期时间')
return
}
res = await utils.requestPost({
data: this.formInline,
url: "admin/apply/applyadd"
}, this)
if (res.code == 1) {
localStorage.setItem('apply_add', res.data);
this.$message({
type: 'success',
message: '操作成功!',
duration: 1000,
onClose: () => {
location.href = "<?= Yii::$app->urlManager->createUrl('admin/apply/platform_userm');?>" + "?id=" + res.data;
},
});
}
},
handleAvatarSuccess(res, file) {
this.imageUrl = URL.createObjectURL(file.raw);
this.formInline.apply_image = res.data
// console.log(file.raw)
},
handleAvatarSuccess2(res, file) {
this.imageUrl2 = URL.createObjectURL(file.raw);
this.formInline.apply_qr_code = res.data
// console.log(file.raw)
},
beforeAvatarUpload(file) {
const isJPG = file.type ===
file.type === 'image/jpg' ||
file.type === 'image/jpeg' ||
file.type === 'image/png' ||
file.type === 'image/gif'
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG) {
this.$message.error('请上传图片文件!');
}
if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!');
}
return isJPG && isLt2M;
}
}
})
</script>
</body>
</html>