|
@@ -61,6 +61,35 @@
|
|
|
cursor: pointer;
|
|
|
margin: 0 2px;
|
|
|
}
|
|
|
+ #form .ivu-card-head{
|
|
|
+ padding: 0px;
|
|
|
+ width: 100%;
|
|
|
+ height: 120px;
|
|
|
+ }
|
|
|
+ #form .ivu-card-head div{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ #form .ivu-card-head div img{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ .ivu-btn-primary:hover {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #B3000F;
|
|
|
+ border-color: #B3000F;
|
|
|
+ }
|
|
|
+ .ivu-btn-primary {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #E60012;
|
|
|
+ border-color: #E60012;
|
|
|
+ }
|
|
|
+ .red{
|
|
|
+ color: #E60012;
|
|
|
+ }
|
|
|
+ .ivu-upload-drag:hover {
|
|
|
+ border: 1px dashed #E60012;
|
|
|
+ }
|
|
|
</style>
|
|
|
</head>
|
|
|
|
|
@@ -70,7 +99,9 @@
|
|
|
<h1>水猫工匠-用户名片</h1>
|
|
|
</div>-->
|
|
|
<Card :bordered="false" id="form">
|
|
|
- <p slot="title">水猫工匠-用户名片信息</p>
|
|
|
+ <div slot="title">
|
|
|
+ <img src="/static/image/workercard/banner.png">
|
|
|
+ </div>
|
|
|
<i-form :model="formdata" :label-width="80">
|
|
|
<Form-item label="手机号">
|
|
|
<i-input v-model="formdata.telno" placeholder="请输入手机号"></i-input>
|
|
@@ -104,42 +135,33 @@
|
|
|
</Form-item>
|
|
|
<Form-item label="图片上传">
|
|
|
<div id="images">
|
|
|
- <div v-if="imglist">
|
|
|
- <div class="img_list">
|
|
|
- <div class="demo-upload-list" v-for="(item,index) in imglist" :key="index">
|
|
|
- <img :src="item">
|
|
|
- <div class="demo-upload-list-cover">
|
|
|
- <Icon type="ios-eye-outline" @click.native="handleView(index)"></Icon>
|
|
|
- <!--<Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>-->
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
<div class="img_list">
|
|
|
<div class="demo-upload-list" v-for="(url,index) in uploadList" :key="index">
|
|
|
<img :src="url">
|
|
|
<div class="demo-upload-list-cover">
|
|
|
- <Icon type="ios-eye-outline" @click.native="handleView2(index)"></Icon>
|
|
|
- <Icon type="ios-trash-outline" @click.native="handleRemove2(index)"></Icon>
|
|
|
+ <Icon type="ios-eye-outline" @click.native="handleView2(index)" class="red"></Icon>
|
|
|
+ <Icon type="ios-trash-outline" @click.native="handleRemove2(index)" class="red"></Icon>
|
|
|
</div>
|
|
|
<i-button type="primary" long>提交</i-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <!--:max-size="204800"-->
|
|
|
+ <!--:on-exceeded-size="handleMaxSize" //action="https://app.tjzhxx.cn:5443/api/Cos/savephoto" http://app.tjzhxx.local.cn/api/Cos/savephoto-->
|
|
|
<Upload
|
|
|
ref="upload"
|
|
|
:show-upload-list="false"
|
|
|
:on-success="handleSuccess"
|
|
|
:format="['jpg','jpeg','png']"
|
|
|
- :max-size="2048"
|
|
|
:on-format-error="handleFormatError"
|
|
|
- :on-exceeded-size="handleMaxSize"
|
|
|
:before-upload="handleBeforeUpload"
|
|
|
+ :on-exceeded-size="handleMaxSize"
|
|
|
+ :max-size="20480"
|
|
|
name="file"
|
|
|
type="drag"
|
|
|
action="https://app.tjzhxx.cn:5443/api/Cos/savephoto"
|
|
|
style="display: inline-block;width:58px;">
|
|
|
<div style="width: 58px;height:58px;line-height: 58px;">
|
|
|
- <Icon type="md-camera" size="20"></Icon>
|
|
|
+ <Icon type="md-camera" size="20" class="red"></Icon>
|
|
|
</div>
|
|
|
</Upload>
|
|
|
<Modal title="查看图片" v-model="visible">
|
|
@@ -148,7 +170,20 @@
|
|
|
</div>
|
|
|
</Form-item>
|
|
|
<Form-item>
|
|
|
- <i-button type="primary" long>提交</i-button>
|
|
|
+ <i-button type="primary" long @click="saveinfo" :loading="issavingloading">提交</i-button>
|
|
|
+ </Form-item>
|
|
|
+ <Form-item label="用户照片">
|
|
|
+ <div v-if="imglist">
|
|
|
+ <div class="img_list">
|
|
|
+ <div class="demo-upload-list" v-for="(item,index) in imglist" :key="index">
|
|
|
+ <img :src="item">
|
|
|
+ <div class="demo-upload-list-cover">
|
|
|
+ <Icon type="ios-eye-outline" @click.native="handleView(index)" class="red"></Icon>
|
|
|
+ <!--<Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>-->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</Form-item>
|
|
|
</div>
|
|
|
</i-form>
|
|
@@ -197,6 +232,7 @@
|
|
|
el: '#app',
|
|
|
vuetify: new Vuetify(),
|
|
|
data: {
|
|
|
+ issavingloading:false,
|
|
|
formdata:{
|
|
|
name:"",
|
|
|
age:17,
|
|
@@ -215,12 +251,12 @@
|
|
|
visible:false,
|
|
|
url_host:"http://newwatercatserver.com/index.php/index",
|
|
|
worktypeonelabel:[],
|
|
|
+ userid:0
|
|
|
},
|
|
|
watch: {
|
|
|
'formdata.telno' (newValue, old) {
|
|
|
//获取用户信息
|
|
|
this.getinfobytelno(newValue)
|
|
|
-
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
@@ -265,7 +301,7 @@
|
|
|
//file.name = '7eb99afb9d5f317c912f08b5212fd69a';
|
|
|
},
|
|
|
handleFormatError (file) {
|
|
|
- this.$Notice.warning({
|
|
|
+ this.$Notice.error({
|
|
|
title: '文件格式不正确',
|
|
|
desc: '文件 ' + file.name + ' 格式不正确,请上传 jpg 或 png 格式的图片。'
|
|
|
});
|
|
@@ -273,7 +309,7 @@
|
|
|
handleMaxSize (file) {
|
|
|
this.$Notice.warning({
|
|
|
title: '超出文件大小限制',
|
|
|
- desc: '文件 ' + file.name + ' 太大,不能超过 2M。'
|
|
|
+ desc: '文件 ' + file.name + ' 太大,不能超过 20M。'
|
|
|
});
|
|
|
},
|
|
|
handleBeforeUpload () {
|
|
@@ -306,16 +342,18 @@
|
|
|
}
|
|
|
}else{
|
|
|
that.formdata=res.data
|
|
|
- var userid = that.formdata.user_id
|
|
|
+ that.userid = that.formdata.user_id;
|
|
|
//查询素材图片
|
|
|
- if(userid>0){
|
|
|
- that.getimglist(userid)
|
|
|
- }
|
|
|
+ that.getimglist();
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- getimglist(userid){
|
|
|
+ getimglist(){
|
|
|
+ userid = this.userid;
|
|
|
+ if(!userid||userid==''){
|
|
|
+ return false;
|
|
|
+ }
|
|
|
//获取用户素材图片列表
|
|
|
var that = this;
|
|
|
var url= this.url_host+"/workercardv1/getwcimgdatalistbyuserid";
|
|
@@ -337,16 +375,85 @@
|
|
|
var resultData = res.resultData
|
|
|
that.imglist = resultData.urls;
|
|
|
}
|
|
|
+ },
|
|
|
+ error:function(XMLHttpRequest, textStatus, errorThrown){
|
|
|
+ that.$Notice.error({
|
|
|
+ title: textStatus
|
|
|
+ });
|
|
|
+ that.issavingloading = false;
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
saveinfo(){
|
|
|
+ this.issavingloading = true;
|
|
|
//保存用户信息
|
|
|
- var url= this.url_host+"/workercardv1/getdatabytelnoforweb";
|
|
|
+ var that = this;
|
|
|
+ var url= this.url_host+"/workercardv1/savewcidinfoforweb";
|
|
|
+ var data =this.formdata;
|
|
|
+ $.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: url,
|
|
|
+ data:data,
|
|
|
+ dataType: "json",
|
|
|
+ success: function(res){
|
|
|
+ console.log(res);
|
|
|
+ if(200!=res.code){
|
|
|
+ if(res.code<0){
|
|
|
+ }else{
|
|
|
+ that.$Notice.error({
|
|
|
+ title: res.msg
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ that.$Notice.success({
|
|
|
+ title: "用户信息保存成功"
|
|
|
+ });
|
|
|
+ var data = res.data
|
|
|
+ that.userid = data['uid'];
|
|
|
+ that.editimg();
|
|
|
+ }
|
|
|
+ that.issavingloading = false;
|
|
|
+ },
|
|
|
+ error:function(XMLHttpRequest, textStatus, errorThrown){
|
|
|
+ that.$Notice.error({
|
|
|
+ title: textStatus
|
|
|
+ });
|
|
|
+ that.issavingloading = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
editimg(){
|
|
|
//编辑素材图片
|
|
|
+ var that = this;
|
|
|
var url= this.url_host+"/workercardv1/editwcdataphotoimgforweb";
|
|
|
+ if(this.uploadList.length>0){
|
|
|
+ var data={userid:this.userid,url:this.uploadList}
|
|
|
+ $.ajax({
|
|
|
+ type: 'POST',
|
|
|
+ url: url,
|
|
|
+ data:data,
|
|
|
+ dataType: "json",
|
|
|
+ success: function(res){
|
|
|
+ console.log(res);
|
|
|
+ if(200!=res.code){
|
|
|
+ if(res.code<0){
|
|
|
+ }else{
|
|
|
+ that.$Notice.error({
|
|
|
+ title: res.msg
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ that.$Notice.success({
|
|
|
+ title: "用户图片保存成功"
|
|
|
+ });
|
|
|
+ that.imglist=false
|
|
|
+ that.uploadList=[]
|
|
|
+ that.getimglist()
|
|
|
+ }
|
|
|
+ that.issavingloading = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
getworktypelabel(){
|
|
|
//获取一级标签
|