parent
f81c8b459c
commit
1eaab450b3
@ -0,0 +1,139 @@ |
||||
<template> |
||||
<el-dialog :visible="open" @close="$emit('close')" width="1000px"> |
||||
<el-tabs :activeName="activeName" type="card"> |
||||
<el-tab-pane label="基本信息" name="base"> |
||||
<div class="sub-title">锁定</div> |
||||
<div class="h1">基本信息</div> |
||||
<el-form :inline="true" label-width="100px" label-position="left"> |
||||
<el-row> |
||||
<el-col :span="18"> |
||||
<div class="w240"> |
||||
<el-form-item label="厂商名称"> |
||||
<el-input v-model="form.name"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="厂商ID" class="ml"> |
||||
<el-input v-model="form.id"></el-input> |
||||
</el-form-item> |
||||
<br /> |
||||
<el-form-item label="负责人姓名"> |
||||
<el-input v-model="form.userName"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="负责人电话" class="ml"> |
||||
<el-input v-model="form.phone"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="厂商类型"> |
||||
<el-select v-model="form.type"></el-select> |
||||
</el-form-item> |
||||
<el-form-item label="技术支持时间" class="ml"> |
||||
<el-date-picker v-model="form.dateRange" value-format="yyyy-MM-dd" type="daterange" |
||||
range-separator="-" start-placeholder="开始日期" |
||||
end-placeholder="结束日期"></el-date-picker> |
||||
</el-form-item> |
||||
<br /> |
||||
<el-form-item label="存储到期时间"> |
||||
<el-date-picker v-model="form.saveDateRange" value-format="yyyy-MM-dd" |
||||
type="daterange" range-separator="-" start-placeholder="开始日期" |
||||
end-placeholder="结束日期"></el-date-picker> |
||||
</el-form-item> |
||||
</div> |
||||
<el-form-item label="收货地址"> |
||||
<el-select v-model="form.address.province" placeholder="请选择"> |
||||
|
||||
</el-select> |
||||
<el-select v-model="form.address.city" placeholder="请选择"> |
||||
|
||||
</el-select> |
||||
<el-select v-model="form.address.area" placeholder="请选择"> |
||||
|
||||
</el-select> |
||||
<br /> |
||||
<el-input v-model="form.address.address" style="margin-top:10px"></el-input> |
||||
</el-form-item> |
||||
<el-form-item label="营业执照"> |
||||
<img src="http://www.dummyimage.com/100x100" /> |
||||
</el-form-item> |
||||
<br /> |
||||
<el-form-item label="状态"> |
||||
<el-radio v-model="form.status" :key="item.value" |
||||
v-for="item in dict.type.manufacturer_type_1" :label="item.value">{{ |
||||
item.label |
||||
}}</el-radio> |
||||
</el-form-item> |
||||
</el-col> |
||||
<el-col :span="5" :offset="1"> |
||||
<user-avatar :circle="false" show-bottom-label /> |
||||
</el-col> |
||||
</el-row> |
||||
</el-form> |
||||
</el-tab-pane> |
||||
<el-tab-pane label="经销商(5)" name="dealer"></el-tab-pane> |
||||
<el-tab-pane label="直营门店(12)" name="direct_store"></el-tab-pane> |
||||
</el-tabs> |
||||
</el-dialog> |
||||
</template> |
||||
<script> |
||||
|
||||
import userAvatar from "@/views/system/user/profile/userAvatar"; |
||||
export default { |
||||
name: 'Detail', |
||||
components: { userAvatar }, |
||||
dicts: ['manufacturer_type_1'], |
||||
props: { |
||||
open: false |
||||
}, |
||||
data() { |
||||
return { |
||||
activeName: 'base', |
||||
form: { |
||||
dateRange: '', |
||||
saveDateRange: '', |
||||
name: '厂商名称', |
||||
id: '145454', |
||||
userName: '账单', |
||||
phone: '18888888888', |
||||
type: '电子产品', |
||||
address: { |
||||
province: '河南省', |
||||
city: '郑州市', |
||||
area: '金水区', |
||||
address: '光明路128号' |
||||
}, |
||||
status: '0' |
||||
} |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
<style scoped lang="scss"> |
||||
.w240 { |
||||
|
||||
.el-input, |
||||
.el-select, |
||||
.el-date-editor { |
||||
width: 200px; |
||||
} |
||||
|
||||
} |
||||
|
||||
.h1 { |
||||
font-size: 16px; |
||||
text-align: left; |
||||
font-family: SourceHanSansSC-regular; |
||||
margin: 15px 0; |
||||
} |
||||
|
||||
.ml { |
||||
margin-left: 5%; |
||||
} |
||||
|
||||
.sub-title { |
||||
padding: 15px 20px; |
||||
background-color: #e1efff; |
||||
|
||||
&>span { |
||||
font-size: 14px; |
||||
text-align: left; |
||||
font-family: SourceHanSansSC-regular; |
||||
} |
||||
} |
||||
</style> |
Loading…
Reference in new issue