Commit 2e407db6 by 吕海涛

合作商

parent 6188c695
<template>
<div class="accountcontent">
<el-card>
<div>
<div class="title">支付宝账号</div>
<div class="AlipayList">
<el-row :gutter="20">
<el-col :span="8" v-for="o in 5" :key="o"
><div class="grid-content">
<el-card>
<div class="text_item">
<div class="block">
<el-avatar
shape="square"
:size="50"
src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
></el-avatar>
</div>
<div class="AlipayListdescribe">
<div>支付宝商户主体名称</div>
<div>AH95684256</div>
</div>
</div>
</el-card>
</div></el-col
>
</el-row>
</div>
</div>
<div>
<div class="title">银行卡管理</div>
<div class="backlist">
<el-row :gutter="20">
<el-col :span="6" v-for="o in 5" :key="o"
><div class="grid-content bg-purple">
<el-card>
<div slot="header" class="clearfix">
<div class="block">
<el-avatar
:size="30"
src="http://banklogo.xoado.com/banklogo/ABC.png"
></el-avatar
><span class="backname">中国光大银行</span>
</div>
<div class="triangle-top-right" v-if="o==1">
<span>默认</span>
</div>
</div>
<div class="box-card-content">
<div>5685 2365 5896 2624</div>
<div>中国光大银行股份有限公司西中国光大银行股份有限公司西....</div>
</div>
</el-card>
</div></el-col
>
</el-row>
</div>
</div>
</el-card>
</div>
</template>
<script>
export default {
name: "account",
data() {
return {};
},
components: {},
created() {},
filters: {},
watch: {},
methods: {},
};
</script>
<style lang="scss" scoped>
.accountcontent .el-card {
border: none;
}
.title {
border-left: 3px solid #5692ff;
text-align: left;
color: #51a5f9;
padding-left: 10px;
font-size: 14px;
background-color: #fff;
margin-bottom: 20px;
font-weight: bolder;
}
.backlist .el-card {
border: 1px solid rgba(204, 204, 204, 1);
margin-bottom: 10px;
}
.clearfix span {
background: none;
}
.backname {
margin-left: 10px;
}
.box-card-content{
padding: 10px;
padding-bottom: 20px;
}
.box-card-content>div:nth-child(1){
font-weight: 700;
margin-bottom: 10px;
font-size: 18px;
}
.box-card-content>div:nth-child(2){
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.clearfix .block {
display: flex;
align-items: center;
}
::v-deep {
.backlist .el-card .el-card__header {
padding: 0px;
}
}
.backlist .clearfix {
display: flex;
justify-content: space-between;
position: relative;
}
.backlist .clearfix .block {
padding: 5px;
}
.backlist .clearfix .triangle-top-right {
width: 0;
height: 0;
border-top: 40px solid #0099ff;
border-left: 100px solid transparent;
text-align: center;
}
.backlist .clearfix .triangle-top-right span{
position: absolute;
color: #fff;
top: 0px;
right: 0px;
width: 100px;
padding: 10px;
text-align: right;
}
::v-deep {
.el-card__body {
padding: 0;
}
.AlipayList .el-card {
border: 1px solid rgba(204, 204, 204, 1);
margin-bottom: 10px;
padding: 15px;
display: flex;
}
.text_item {
display: flex;
justify-content: center;
}
.text_item > div:nth-child(2) {
margin-left: 10px;
}
.AlipayListdescribe > div:nth-child(1) {
font-size: 18px;
font-weight: 600;
}
.AlipayListdescribe > div:nth-child(2) {
font-size: 14px;
font-weight: 600;
}
}
</style>
<template>
<div class="areabox">
<el-card>
<div style="text-align: end">
<el-button type="primary" @click="onSubmit">嵌入应用</el-button>
</div>
<div style="margin-top: 10px">
<el-table
:data="tableData"
border
style="width: 100%"
:header-cell-style="getRowClass"
:row-class-name="tableRowClassName"
@row-click="openinfo"
>
<el-table-column label="序号" width="80" align="center" type="index">
</el-table-column>
<el-table-column
prop="name"
label="应用类型"
align="center"
width="100"
>
</el-table-column>
<el-table-column prop="name" label="应用名称" align="center">
</el-table-column>
<el-table-column prop="name" label="应用包名/OpenID" align="center">
</el-table-column>
<el-table-column
prop="name"
label="应用秘钥"
align="center"
width="400"
>
<template >
{{ 11111111111111111
}}<i
class="el-icon-document-copy"
style="
color: rgb(26, 156, 252);
margin: 0 10px;
font-size: 18px;
"
></i>
</template>
</el-table-column>
<el-table-column
label="操作"
fixed="right"
align="center"
width="200"
>
<template slot-scope="{ row }">
<el-button
type="text"
size="small"
style="color: #fc4650"
@click.stop="termination(row)"
>编辑
</el-button>
<el-button type="text" size="small" @click.stop="subshow(row)"
>删除
</el-button>
</template>
</el-table-column>
</el-table>
<div
style="
margin-top: 10px;
display: flex;
align-items: center;
justify-content: end;
"
>
<el-pagination
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="400"
>
</el-pagination>
</div>
</div>
<el-dialog :title="title" :visible.sync="centerDialogVisible" width="30%">
<el-form ref="form" :model="form" label-width="140px">
<el-form-item label="应用类型:">
<el-radio-group v-model="form.resource">
<el-radio label="1">微信小程序</el-radio>
<el-radio label="2">APP</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="应用名称:">
<el-input v-model="form.applyName"></el-input>
</el-form-item>
<el-form-item label="应用包名/OpenId:">
<el-input v-model="form.applyOpenId"></el-input>
</el-form-item>
<el-form-item label="应用密钥:" v-if="form.key">
<span>******</span>
<span class="el-input__icon el-icon-view el-input__clear"></span>
<span class="el-icon-document-copy"></span>
<span
style="padding:0 5px"><el-link type="primary" :underline="false"
>重置</el-link
></span
>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="centerDialogVisible = false"
>确 定</el-button
>
</span>
</el-dialog>
</el-card>
</div>
</template>
<script>
export default {
name: "areapage",
data() {
return {
centerDialogVisible: false,
title: "嵌入应用",
form: {
resource:"1",
applyName:"",
applyOpenId:'',
key:'1',
},
tableData: [
{
id: 1,
name: "撒可见度发挥",
province:
"其实稍微深入的想一想就知道了。这梁山伯吧,本来挺喜欢男的祝英台,",
Location:
"其实稍微深入的想一想就知道了。这梁山伯吧,本来挺喜欢男的祝英台,结果呢!",
regionstr: "其实稍微深入的想一想就gay!",
coverage:
"其实稍微深入的想一,我的结论也很简单。 其实梁山伯是被残酷现实强行掰直却又被自己难以纾解的扭曲情感折磨致死的gay!",
num: "1",
},
],
};
},
components: {},
created() {
this.init();
},
filters: {},
watch: {},
methods: {
onSubmit() {
this.centerDialogVisible = true;
},
termination(){
this.centerDialogVisible = true;
},
init() {},
tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 !== 0) {
return "warning-row";
}
return "";
},
/**
* 设置表头背景颜色
* **/
getRowClass({ row, column, rowIndex, columnIndex }) {
return "background:#1a9cfc;border:none;color: #FFFFFF;";
},
subshow() {
this.$confirm("删除后不可撤回,该应用查不到报价,确定删除", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$message({
type: "success",
message: "删除成功!",
});
this.show = !this.show;
this.init();
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
},
};
</script>
<style lang="scss" scoped>
.areabox .el-card {
border: none;
}
.title {
border-left: 3px solid #5692ff;
text-align: left;
color: #51a5f9;
padding-left: 10px;
font-size: 16px;
background-color: #fff;
margin-bottom: 20px;
font-weight: bolder;
}
.itemlistinfo {
display: flex;
font-size: 13px;
line-height: 30px;
}
.itemlistinfo > span:nth-child(1) {
margin-right: 20px;
min-width: 100px;
text-align: right;
}
.itemlistinfo > span:nth-child(2) {
margin-right: 10px;
}
.iteminput {
display: flex;
}
.iteminput > div {
max-width: 150px;
margin: 5px 10px;
align-items: center;
display: flex;
min-width: 150px;
}
.iteminput > div > span {
text-align: right;
width: 100%;
}
</style>
<template>
<el-dialog
title="运营区域管理"
:visible.sync="dialogVisible"
center
width="60%"
:modal-append-to-body="false"
:before-close="handleClose"
>
<div style="padding: 0 10px; box-sizing: border-box">
<div class="tipContent">
说明:<span></span>为开通<span></span>为不开通
</div>
<div class="listContent">
<el-row :gutter="20">
<el-col :span="6" v-for="(item, index) in regiondata" :key="index">
<div class="grid-content" @click.stop="changeregiondata(item)">
<div class="btn" :class="item.status * 1 == 1 ? 'active' : ''">
<span>{{ item.status * 1 == 1 ? "✓" : "" }} </span>
</div>
<div>
<h1 style="font-size: 18px; line-height: 1.7; font-weight: 600">
{{ item.city }}
</h1>
</div>
<div>
<span class="el-icon-location-outline"></span>
{{ item.province }}
</div>
</div>
</el-col>
</el-row>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="sendEmit">取 消</el-button>
<el-button type="primary" @click="AddData()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name: "region",
props: ["dialogVisible"],
computed: {},
data() {
return {
regiondata: [
{
city: "西安市",
province: "陕西省",
status: 0,
},
{
city: "宝鸡市",
province: "陕西省",
status: 1,
},
{
city: "咸阳市",
province: "陕西省",
status: 1,
},
{
city: "渭南市",
province: "陕西省",
status: 0,
},
],
};
},
watch: {},
created() {},
methods: {
handleClose(done) {
// done()
this.sendEmit();
},
sendEmit() {
this.$emit("changeDialog", false);
},
changeregiondata(item) {
var t = item.status * 1 == 1 ? 0 : 1;
item.status = t;
},
AddData() {
this.$confirm("此操作将开通运营区域, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$emit("changeDialog", false);
this.$message({
type: "success",
message: "开通成功!",
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消开通",
});
});
},
},
};
</script>
<style scoped lang="scss">
.tipContent {
display: flex;
align-items: center;
span {
width: 15px;
height: 15px;
border-radius: 50%;
display: inline-block;
margin: 5px;
border: 1px solid #dfdfdf;
}
}
.tipContent > span:nth-child(1) {
background: #10b74c;
line-height: 15px;
text-align: center;
color: #fff;
}
.tipContent > span:nth-child(2) {
background: #f2f2f2;
}
.listContent {
margin-top: 10px;
}
.listContent .el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
.listContent .el-col {
border-radius: 4px;
margin-bottom: 10px;
}
.listContent .grid-content {
border-radius: 4px;
min-height: 36px;
border: 1px solid #ccc;
padding: 10px;
text-align: center;
padding-bottom: 30px;
}
.listContent .row-bg {
padding: 10px 0;
background-color: #f9fafc;
}
.grid-content .btn {
display: flex;
align-items: center;
justify-content: end;
}
.grid-content .btn span {
width: 28px;
height: 28px;
border: 1px solid #dfdfdf;
border-radius: 50%;
background: #f2f2f2;
display: inline-block;
line-height: 28px;
color: #fff;
}
.listContent .grid-content .active span {
background: #10b74c;
}
</style>
<template>
<div>
<el-card class="box-card">
<div style="display: flex; justify-content: space-between">
<div class="block">
<el-avatar
shape="square"
:size="50"
src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
></el-avatar>
</div>
<div style="width: calc(100% - 70px)" class="companyinfolist">
<div class="companyinfo">
<div class="companyinfo designation">
<div>西安远翔运力企业服务有限公司</div>
<div>管理员:张三(15296598956)</div>
</div>
<div>
<el-link type="primary" :underline="false">编辑</el-link>
</div>
</div>
<div>开通业务:同城打车、跨城出行</div>
<div>ID:568952f622v895223d622d95d155d5d5</div>
<div>
<div>
<span>秘钥:***********</span>
<i class="el-icon-view"></i>
<i class="el-icon-document-copy"></i>
<el-link type="primary" :underline="false">重置</el-link>
</div>
<div>
<div><i class="el-icon-phone"></i>176 5895 6895</div>
<div><i class="el-icon-s-order"></i>xoado1111@163.com</div>
</div>
</div>
</div>
</div>
</el-card>
<el-card style="margin-top: 10px">
<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
<el-tab-pane label="基本信息" name="first">
<div>
<div class="title">基本信息</div>
<div style="display: flex">
<el-avatar
:size="80"
src="https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png"
></el-avatar>
<div style="margin-left: 20px" class="firstList">
<div>广丰人力资源有限公司</div>
<div>企业简称:广丰人力</div>
<div>信用代码:512362532689546</div>
<div>办公地址:西安市未央区国际财富中心</div>
</div>
</div>
</div>
<div style="margin-top: 20px">
<div class="title">简介</div>
<div style="display: flex">
<div class="firstList">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean
euismod bibendum laoreet. Proin gravida dolor sit amet lacus
accumsan et viverra justo commodo. Proin sodales pulvinar
tempor. Cum sociis natoque
</div>
</div>
</div>
<div style="margin-top: 20px">
<div class="title">管理员</div>
<div style="display: flex">
<div class="firstList">管理员:刘洋(151****5689)</div>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="嵌入应用" name="second">
<contact :activeName ="activeName"></contact>
</el-tab-pane>
<el-tab-pane label="结算配置" name="third">
<settlement></settlement>
</el-tab-pane>
<el-tab-pane label="账户管理" name="five">
<account></account>
</el-tab-pane>
</el-tabs>
</el-card>
</div>
</template>
<script>
import contact from "./components/contact.vue";
import account from "./components/account.vue";
import settlement from "./components/settlement.vue";
export default {
name: "supplierinfo",
data() {
return {
activeName: "first",
};
},
components: {
contact,
account,
settlement
},
created() {},
filters: {},
watch: {},
methods: {
handleClick(tab, event) {
},
},
};
</script>
<style lang="scss" scoped>
::v-deep {
.el-table .warning-row {
background: #e6f4ff;
}
#app .pageMain > div {
background: #fff;
}
.el-upload-dragger {
width: 240px;
}
.el-upload__tip {
text-align: center;
}
}
.title {
border-left: 3px solid #5692ff;
text-align: left;
color: #51a5f9;
padding-left: 10px;
font-size: 16px;
background-color: #fff;
margin-bottom: 20px;
font-weight: bolder;
}
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
.el-col {
border-radius: 4px;
}
.bg-purple-dark {
background: #99a9bf;
}
.bg-purple {
background: #d3dce6;
}
.bg-purple-light {
background: #e5e9f2;
}
.grid-content {
border-radius: 4px;
min-height: 36px;
}
.row-bg {
padding: 10px 0;
background-color: #f9fafc;
}
.companyinfo {
display: flex;
justify-content: space-between;
}
.designation > div:nth-child(1) {
font-size: 18px;
font-weight: 600;
}
.designation > div:nth-child(2) {
font-size: 16px;
font-weight: 100;
margin-left: 20px;
}
.companyinfolist > div:nth-child(2) {
font-size: 16px;
}
.companyinfolist > div:nth-child(3) {
font-size: 14px;
}
.companyinfolist > div:nth-child(4) {
display: flex;
justify-content: space-between;
}
.companyinfolist > div:nth-child(4) > div:nth-child(2) {
display: flex;
}
.companyinfolist > div:nth-child(4) i {
font-size: 16px;
color: #1989fa;
margin: 0 5px;
}
.firstList > div {
font-size: 14px;
}
.firstList > div:nth-child(1) {
font-size: 18px;
font-weight: 600;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment