panqihua
/
ttsbg-java-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

完善厂商/经销商管理-详情-基本信息

Browse Source 
待审核
master
panqihua 2 years ago
parent 445e3d8386
commit ca1ade1b2e
3 changed files with 205 additions and 135 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 180
      src/views/platform/manufacturer/base.vue
  2. 158
      src/views/platform/manufacturer/detail.vue
  3. 2
      src/views/platform/manufacturer/detail_table.vue

180
src/views/platform/manufacturer/base.vue
Unescape View File

@ -0,0 +1,180 @@
<template>
<div>
<div class="sub-title">锁定</div>
<div class="h1">基本信息</div>
<el-form :inline="true" :label-width="width + 'px'" 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>
<br />
<template v-if="type === '2'">
<el-form-item label="审核">
<el-radio v-model="form.audit" :key="item.value" v-for="item in dict.type.audit_status"
:label="item.value">{{
item.label
}}</el-radio>
</el-form-item>
<br />
<el-form-item :style="{
marginLeft: `${width}px`
}">
<el-input :autosize="{ minRows: 5 }" type="textarea" placeholder="拒绝原因"
:minRow="5"></el-input>
</el-form-item>
<template v-if="manufacturerType === 2">
<div class="h1">授权厂商</div>
<el-form-item label="厂商名称">
<el-input v-model="authorized.name"></el-input>
</el-form-item>
<br />
<el-form-item label="选择品牌">
<el-checkbox-group v-model="authorized.brands">
<el-checkbox v-for="item in 4" :label="item" :key="item">品牌{{ item }}</el-checkbox>
</el-checkbox-group>
</el-form-item>
<br />
<el-form-item label="授权书">
<img src="http://www.dummyimage.com/100x100" />
</el-form-item>
</template>
</template>
</el-col>
<el-col :span="5" :offset="1">
<user-avatar :circle="false" show-bottom-label />
</el-col>
</el-row>
<div v-if="type === '2'" style="text-align:center">
<el-button type="primary" @click="$modal.msgSuccess('保存成功'); $emit('close')">保存</el-button>
<el-button @click="$emit('close')">关闭</el-button>
</div>
</el-form>
</div>
</template>
<script>
import userAvatar from "@/views/system/user/profile/userAvatar";
export default {
name: 'Base',
components: { userAvatar },
dicts: ['manufacturer_type_1', 'audit_status'],
data() {
return {
width: 100,
form: {
dateRange: '',
saveDateRange: '',
name: '厂商名称',
id: '145454',
userName: '账单',
phone: '18888888888',
type: '电子产品',
address: {
province: '河南省',
city: '郑州市',
area: '金水区',
address: '光明路128号'
},
status: '0',
audit: undefined
},
authorized: {
name: '厂商名称',
brands: []
}
}
},
computed: {
// 1：列表，2：审核
type() {
return this.$route.fullPath.split('/').at(-1)
},
// 1:厂商，2：经销商
manufacturerType() {
return this.$route.fullPath.includes('manufacturer') ? 1 : 2
}
}
}
</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>

158
src/views/platform/manufacturer/detail.vue
Unescape View File

@ -1,153 +1,43 @@
<template> <template>
<el-dialog :visible="open" @close="$emit('close')" width="1000px"> <el-dialog :visible="open" @close="$emit('close')" width="1000px">
<el-tabs :activeName="activeName" type="card"> <template v-if="type === '1'">
<el-tab-pane label="基本信息" name="base"> <el-tabs :activeName="activeName" type="card">
<div class="sub-title">锁定</div> <el-tab-pane label="基本信息" name="base">
<div class="h1">基本信息</div> <base-info @close="$emit('close')" />
<el-form :inline="true" :label-width="width + 'px'" label-position="left"> </el-tab-pane>
<el-row> <el-tab-pane label="经销商（5）" name="dealer">
<el-col :span="18"> <detail-table :type="1" />
<div class="w240"> </el-tab-pane>
<el-form-item label="厂商名称"> <el-tab-pane label="直营门店（12）" name="direct_store">
<el-input v-model="form.name"></el-input> <detail-table :type="2" />
</el-form-item> </el-tab-pane>
<el-form-item label="厂商ID" class="ml"> </el-tabs>
<el-input v-model="form.id"></el-input> </template>
</el-form-item> <base-info @close="$emit('close')" v-else />
<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>
<br />
<el-form-item :style="{
marginLeft: `${width}px`
}" v-if="type === '2'">
<el-input :autosize="{ minRows: 5 }" type="textarea" placeholder="拒绝原因"
:minRow="5"></el-input>
</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">
<detail-table :type="1" />
</el-tab-pane>
<el-tab-pane label="直营门店（12）" name="direct_store">
<detail-table :type="2" />
</el-tab-pane>
</el-tabs>
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import BaseInfo from "./base"
import userAvatar from "@/views/system/user/profile/userAvatar";
import DetailTable from "./detail_table" import DetailTable from "./detail_table"
export default { export default {
name: 'Detail', name: 'Detail',
components: { userAvatar, DetailTable }, components: { DetailTable, BaseInfo },
dicts: ['manufacturer_type_1'],
props: { props: {
open: false, open: false
type: String
}, },
data() { data() {
return { return {
width: 100, activeName: 'base'
activeName: 'base', }
form: { },
dateRange: '', computed: {
saveDateRange: '', // 1：列表，2：审核
name: '厂商名称', type() {
id: '145454', return this.$route.fullPath.split('/').at(-1)
userName: '账单',
phone: '18888888888',
type: '电子产品',
address: {
province: '河南省',
city: '郑州市',
area: '金水区',
address: '光明路128号'
},
status: '0'
}
} }
} }
} }
</script> </script>
<style scoped lang="scss"> <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> </style>

2
src/views/platform/manufacturer/detail_table.vue
Unescape View File

@ -28,7 +28,7 @@
export default { export default {
name: 'DetailTable', name: 'DetailTable',
props: { props: {
type: String type: Number
}, },
data() { data() {
return { return {

Write Preview
Loading…
Cancel
Save