canyin-project/ybcy/views/admin/apply/platform_add.php

613 lines
34 KiB
PHP
Raw Normal View History

2024-11-01 16:07:54 +08:00
<!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>