Commit ced437c2 authored by zhanglw's avatar zhanglw

咨询窗口

parent 1c9fa023
<template>
<!-- 表单渲染 -->
<el-dialog center append-to-body destroy-on-close :close-on-click-modal="false" :show-close="false" :visible="visible" :title="title" top="25vh" width="440px">
<el-form ref="formViewRef" :model="formData" :rules="rules" :status-icon="true" label-width="80px">
<el-form-item label="姓名:" class="form-cell" prop="name">
<div class="cell-box">
<el-input v-model="formData.name" placeholder="您怎么称呼?" class="cell-input" />
</div>
</el-form-item>
<el-form-item label="电话:" class="form-cell" prop="phone">
<div class="cell-box">
<el-input v-model="formData.phone" placeholder="请输入联系电话" class="cell-input" />
</div>
</el-form-item>
<el-form-item label="留言:" class="form-cell" prop="content">
<div class="cell-box">
<el-input v-model="formData.content" type="textarea" placeholder="请输入咨询内容(300字以内)" maxlength="300" :autosize="{ minRows: 6, maxRows: 6}" show-word-limit resize="none" class="cell-input" />
</div>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button style="width: 120px;margin: 0 10px" @click="cancelView">取消</el-button>
<el-button type="primary" style="width: 120px;margin: 0 10px;" @click="submitForm()">提交</el-button>
</div>
</el-dialog>
</template>
<script>
import { getToken } from '@/utils/auth'
import { HttpReq } from '@/api/common'
export default {
data() {
return {
typeDict: {
'product': '询 价',
'project': '方案咨询',
'system': '软件咨询',
'course': '课程定制'
},
visible: false,
title: '询 价',
formData: {
name: '',
phone: '',
content: '',
id: null
},
rules: {
name: { required: true, message: '请填写姓名', trigger: 'blur' },
phone: { required: true, message: '请填写联系电话', trigger: 'blur' },
content: { required: true, message: '请填写咨询内容', trigger: 'blur' }
}
}
},
mounted() {
},
methods: {
addDataRow() {
this.formData.dataList.push({ id: '', index: '' })
},
showView() {
this.visible = true
},
hideView() {
this.$refs.formViewRef.resetFields()
this.visible = false
},
cancelView() {
this.hideView()
},
submitForm() {
this.$refs.formViewRef.validate((valid, obj) => {
if (valid) {
this.hideView()
// HttpReq.backstageApi.updateCustomerDetail(this.formData).then((res) => {
// this.$notify({
// title: res.msg,
// type: 'success',
// duration: 2500
// })
// if (res.code === 200) {
// this.cancelView()
// this.$parent.loadData()
// }
// })
// } else {
// this.$message({
// message: '表单信息有误,请核对无误后提交!',
// type: 'error'
// })
}
})
},
initView(id, type) {
if (type) {
this.title = this.typeDict[type]
}
this.showView()
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
>>>.el-dialog__title {
font-family: Source Han Sans CN;
font-size: 20px;
font-weight: bolder;
}
>>>.el-dialog--center .el-dialog__body {
padding: 10px 25px;
}
.cell-box {
min-width: 120px;
.cell-input {
width: 280px;
}
.cell-select {
width: 220px;
}
>>>.el-input__inner {
border: 1px solid rgba(100, 100, 100, 0.1);
border-bottom: 1px solid rgba(100, 100, 100, 0.2);
border-radius: 5px;
}
>>>.el-input.is-disabled .el-input__inner {
border-radius: 0;
border: 0;
border-bottom: 1px solid rgba(100, 100, 100, 0.4);
background: white;
cursor: text;
}
>>>.el-input.is-disabled .el-input__icon {
cursor: text;
}
>>>.el-icon-circle-check {
color: #13ce66;
}
>>>.el-icon-arrow-up:before {
content: '';
}
}
</style>
...@@ -101,9 +101,6 @@ ...@@ -101,9 +101,6 @@
<div class="date">{{ item.date }}</div> <div class="date">{{ item.date }}</div>
</el-col> </el-col>
</el-row> </el-row>
<div class="line-btn" style="margin-top: 4px;display: none">
<div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'supplier')">咨 询</div>
</div>
</div> </div>
<div style="padding: 15px 50px;text-align: right"><span class="more touch" title="点击查看更多..." @click="moreTo('supplier')">更多供应商>></span></div> <div style="padding: 15px 50px;text-align: right"><span class="more touch" title="点击查看更多..." @click="moreTo('supplier')">更多供应商>></span></div>
</div> </div>
...@@ -150,6 +147,7 @@ ...@@ -150,6 +147,7 @@
</div> </div>
<home-footer ref="homeFooter" /> <home-footer ref="homeFooter" />
<float-btn ref="floatBtn" /> <float-btn ref="floatBtn" />
<inquiry-view ref="inquiryView" />
</div> </div>
</template> </template>
<script> <script>
...@@ -161,9 +159,10 @@ import userLogin from './components/userLogin' ...@@ -161,9 +159,10 @@ import userLogin from './components/userLogin'
import languageSetting from './components/languageSetting' import languageSetting from './components/languageSetting'
import searchPanel from './components/searchPanel' import searchPanel from './components/searchPanel'
import homeFooter from './components/homeFooter' import homeFooter from './components/homeFooter'
import inquiryView from './components/inquiryView'
export default { export default {
components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter }, components: { floatBtn, titleMenus, userLogin, languageSetting, searchPanel, homeFooter, inquiryView },
dicts: ['product_type', 'area_province'], dicts: ['product_type', 'area_province'],
data() { data() {
return { return {
...@@ -412,6 +411,7 @@ export default { ...@@ -412,6 +411,7 @@ export default {
// 点击询价 // 点击询价
inquiry(item, type) { inquiry(item, type) {
console.log(item, type) console.log(item, type)
this.$refs.inquiryView.initView(item.id, type)
}, },
// 点击收藏 // 点击收藏
storeShowcase(item, type) { storeShowcase(item, type) {
......
...@@ -166,7 +166,7 @@ ...@@ -166,7 +166,7 @@
<div class="line-text touch">{{ item.title }}</div> <div class="line-text touch">{{ item.title }}</div>
<div style="width: 100%;text-align: center;padding: 2px;color: #333">{{ item.subTitle }}</div> <div style="width: 100%;text-align: center;padding: 2px;color: #333">{{ item.subTitle }}</div>
<div class="line-btn" style="margin-top: 14px"> <div class="line-btn" style="margin-top: 14px">
<div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'system')">课程定制</div> <div class="btn-o" style="width: 150px;border-radius: 10px;box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);font-size:20px;" @click="inquiry(item, 'course')">课程定制</div>
</div> </div>
</div> </div>
<div style="margin-bottom: 20px;padding: 15px 50px;text-align: right"><span class="more touch" title="点击查看更多..." @click="moreTo('system')">更多详情>></span></div> <div style="margin-bottom: 20px;padding: 15px 50px;text-align: right"><span class="more touch" title="点击查看更多..." @click="moreTo('system')">更多详情>></span></div>
...@@ -174,6 +174,7 @@ ...@@ -174,6 +174,7 @@
</div> </div>
</div> </div>
<home-footer ref="homeFooter" /> <home-footer ref="homeFooter" />
<inquiry-view ref="inquiryView" />
</div> </div>
</template> </template>
<script> <script>
...@@ -185,9 +186,10 @@ import userLogin from '../components/userLoginV2' ...@@ -185,9 +186,10 @@ import userLogin from '../components/userLoginV2'
import languageSetting from '../components/languageSettingV2' import languageSetting from '../components/languageSettingV2'
import breadcrumb from '../components/breadcrumb' import breadcrumb from '../components/breadcrumb'
import homeFooter from '../components/homeFooter' import homeFooter from '../components/homeFooter'
import inquiryView from '../components/inquiryView'
export default { export default {
components: { titleMenus, userLogin, languageSetting, breadcrumb, homeFooter }, components: { titleMenus, userLogin, languageSetting, breadcrumb, homeFooter, inquiryView },
dicts: ['product_type', 'area_province'], dicts: ['product_type', 'area_province'],
data() { data() {
return { return {
...@@ -361,6 +363,7 @@ export default { ...@@ -361,6 +363,7 @@ export default {
// 点击询价 // 点击询价
inquiry(item, type) { inquiry(item, type) {
console.log(item, type) console.log(item, type)
this.$refs.inquiryView.initView(item.id, type)
}, },
// 点击收藏 // 点击收藏
storeShowcase(item, type) { storeShowcase(item, type) {
......
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