vuedev

来源:互联网 发布:基金从业考试题型 知乎 编辑:程序博客网 时间:2024/05/16 13:50
<template>
<div class="home">
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<span>加我为朋友时需要验证</span>
</div>
</el-col>
<el-col :span="1">
<div class="grid-content bg-purple-light">
<el-switchv-model="notemes"on-color="#13ce66" @change="change"off-color="#ff4949"off-value="N"on-value="Y"></el-switch>
</div>
</el-col>
<el-col :span="12">
<div></div>
</el-col>
</el-row>
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<hr class="hr" />
</div>
</el-col>
</el-row>
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<span>需要验证</span>
</div>
</el-col>
<el-col :span="1">
<div class="grid-content bg-purple-light">
<el-switchv-model="notemes"on-color="#13ce66" @change="change"off-color="#ff4949"off-value="N"on-value="Y"></el-switch>
</div>
</el-col>
<el-col :span="13">
<div></div>
</el-col>
</el-row>
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<span>验证</span>
</div>
</el-col>
<el-col :span="1">
<div class="grid-content bg-purple-light">
<el-switchv-model="notemes"on-color="#13ce66" @change="change"off-color="#ff4949"off-value="N"on-value="Y"></el-switch>
</div>
</el-col>
<el-col :span="13">
<div></div>
</el-col>
</el-row>
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<span>加我为朋友时需要验证</span>
</div>
</el-col>
<el-col :span="1">
<div class="grid-content bg-purple-light">
<el-switchv-model="notemes"on-color="#13ce66" @change="change"off-color="#ff4949"off-value="N"on-value="Y"></el-switch>
</div>
</el-col>
<el-col :span="13">
<div></div>
</el-col>
</el-row>
<el-rowtype="flex" :gutter="20">
<el-col :span="10">
<div class="grid-content bg-purple">
<span>加我为朋友时需要验证</span>
</div>
</el-col>
<el-col :span="1">
<div class="grid-content bg-purple-light">
<el-switchv-model="notemes"on-color="#13ce66" @change="change"off-color="#ff4949"off-value="N"on-value="Y"></el-switch>
</div>
</el-col>
<el-col :span="13">
<div></div>
</el-col>
</el-row>
</div>
</template>
<script>
import axiosfrom 'axios'
export default {
data() {
return {
useID: '16100175',
notemes: ""
}
},
methods: {
change(a) {
console.log(a)
var _this =this
_this.notemes =a
axios.put('http://192.168.24.82:2001/v1/usersetting/' +_this.useID +'/addfriendvaid/' + a)
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
}
},
//页面初始化
created: function () {
var _this =this
axios.get('http://192.168.24.82:2001/v1/usersetting/' +_this.useID)
.then(function (res) {
console.log(JSON.stringify(res.data.data))
_this.notemes =res.data.data
})
.catch(function (error) {
console.log("请求验证时发生错误:" +error);
});
}
}
</script>

<stylescoped>
.hr {
width: 730px;
float: left;
border-bottom:1pxdashed #000000;
}

.home {
border-left-width: 1px;
margin-top: 0px;
}

.el-row {
margin-bottom: 20px;
}

.el-col {
border-radius: 4px;
}

.grid-content {
border-radius: 4px;
min-height: 5px;
}

.row-bg {
padding: 10px0;
background-color: #f9fafc;
}

.tipClass {
color: lightgrey;
}
</style>