updata
This commit is contained in:
parent
47e4e9718a
commit
7d0d85e5dc
@ -445,17 +445,15 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// 处理响应结果
|
// 处理响应结果 - 修改后的方法
|
||||||
handleResponse(response) {
|
handleResponse(response) {
|
||||||
// 根据您的API响应结构调整
|
// 根据你的API响应结构，status为true表示成功
|
||||||
if (response && (response.code === 200 || response.success)) {
|
if (response && response.status === true) {
|
||||||
this.handleClose()
|
this.handleClose()
|
||||||
this.$emit('success', response)
|
|
||||||
this.$message.success(response.message || '提交成功')
|
this.$message.success(response.msg || response.message || '提交成功')
|
||||||
} else {
|
} else {
|
||||||
const errorMsg = response?.message || response?.msg || '提交失败，请稍后再试！'
|
this.$message.error('提交失败，请稍后再试！')
|
||||||
this.$message.error(errorMsg)
|
|
||||||
this.$emit('error', response)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -472,644 +470,5 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="less">
|
<style scoped lang="less">
|
||||||
// 基础样式
|
@import url(../../less/dialog/index.less);
|
||||||
* {
|
|
||||||
touch-action: manipulation;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 修复移动端输入框点击问题
|
|
||||||
::v-deep .el-dialog__wrapper {
|
|
||||||
.el-dialog {
|
|
||||||
.el-dialog__body {
|
|
||||||
.el-input,
|
|
||||||
.el-textarea {
|
|
||||||
.el-input__inner,
|
|
||||||
.el-textarea__inner {
|
|
||||||
// 确保移动端点击区域正常
|
|
||||||
touch-action: manipulation;
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 头部样式
|
|
||||||
.dialog-tit {
|
|
||||||
font-size: 0.4rem;
|
|
||||||
color: #333;
|
|
||||||
padding: 0.2rem 0 0.4rem;
|
|
||||||
border-bottom: 1px solid #f0f0f0;
|
|
||||||
margin-bottom: 0.4rem;
|
|
||||||
|
|
||||||
.pc-tip {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 0.3rem;
|
|
||||||
color: #ff6b35;
|
|
||||||
font-weight: 500;
|
|
||||||
|
|
||||||
i {
|
|
||||||
margin-right: 0.2rem;
|
|
||||||
font-size: 0.42rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
font-size: 0.36rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.url_box {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 0.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url-container {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
|
||||||
flex: 1;
|
|
||||||
|
|
||||||
.url {
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
color: #275aff;
|
|
||||||
text-decoration: none;
|
|
||||||
padding: 0.12rem 0.24rem;
|
|
||||||
border-radius: 0.24rem;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
cursor: pointer;
|
|
||||||
user-select: none;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
background: #f5f7ff;
|
|
||||||
margin-left: 0.2rem;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #e8edff;
|
|
||||||
border-color: #275aff;
|
|
||||||
transform: translateY(-0.04rem);
|
|
||||||
box-shadow: 0 0.08rem 0.32rem rgba(39, 90, 255, 0.15);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.copied {
|
|
||||||
background-color: #e1f3d8;
|
|
||||||
border-color: #67c23a;
|
|
||||||
color: #67c23a;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background-color: #d1edc4;
|
|
||||||
border-color: #5daf34;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tooltip {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 100%;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%) translateY(-0.16rem);
|
|
||||||
background-color: rgba(0, 0, 0, 0.85);
|
|
||||||
color: white;
|
|
||||||
font-size: 0.24rem;
|
|
||||||
padding: 0.08rem 0.16rem;
|
|
||||||
border-radius: 0.16rem;
|
|
||||||
white-space: nowrap;
|
|
||||||
z-index: 1000;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 0.2s, transform 0.2s;
|
|
||||||
pointer-events: none;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
top: 100%;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
border-width: 0.08rem;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: rgba(0, 0, 0, 0.85) transparent transparent transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.tooltip-visible {
|
|
||||||
opacity: 1;
|
|
||||||
transform: translateX(-50%) translateY(0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.url_btn {
|
|
||||||
margin-left: 0.4rem;
|
|
||||||
|
|
||||||
.copy-hint {
|
|
||||||
display: inline-block;
|
|
||||||
font-size: 0.26rem;
|
|
||||||
color: #000;
|
|
||||||
padding: 0.1rem 0.2rem;
|
|
||||||
border-radius: 0.12rem;
|
|
||||||
border: 1px solid #000;
|
|
||||||
transition: all 0.2s;
|
|
||||||
cursor: pointer;
|
|
||||||
user-select: none;
|
|
||||||
min-width: 1.2rem;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: #275aff;
|
|
||||||
border-color: #275aff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.url.copied & .copy-hint {
|
|
||||||
color: #67c23a;
|
|
||||||
border-color: #67c23a;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.check-tit {
|
|
||||||
font-size: 0.16rem;
|
|
||||||
color: #666;
|
|
||||||
line-height: 1;
|
|
||||||
margin: 0.08rem 0;
|
|
||||||
font-weight: normal;
|
|
||||||
|
|
||||||
span {
|
|
||||||
color: #275aff;
|
|
||||||
font-weight: 500;
|
|
||||||
margin: 0 0.04rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 表单样式优化
|
|
||||||
::v-deep .product-consult-dialog {
|
|
||||||
&.el-dialog {
|
|
||||||
border-radius: 0.32rem;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: 0 0.4rem 1.6rem rgba(0, 0, 0, 0.15);
|
|
||||||
|
|
||||||
.el-dialog__header {
|
|
||||||
padding: 0.4rem 0.6rem 0.3rem;
|
|
||||||
border-bottom: 1px solid #f0f0f0;
|
|
||||||
background: linear-gradient(135deg, #f8f9ff 0%, #ffffff 100%);
|
|
||||||
margin-bottom: 0;
|
|
||||||
|
|
||||||
.el-dialog__title {
|
|
||||||
font-size: 0.4rem;
|
|
||||||
font-weight: 600;
|
|
||||||
color: #1a1a1a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-dialog__headerbtn {
|
|
||||||
top: 0.4rem;
|
|
||||||
right: 0.4rem;
|
|
||||||
|
|
||||||
.el-dialog__close {
|
|
||||||
font-size: 0.36rem;
|
|
||||||
color: #999;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: #275aff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-dialog__body {
|
|
||||||
padding: 0.2rem .6rem;
|
|
||||||
max-height: 70vh;
|
|
||||||
overflow-y: auto;
|
|
||||||
|
|
||||||
// 移动端滚动优化
|
|
||||||
-webkit-overflow-scrolling: touch;
|
|
||||||
|
|
||||||
// 防止弹窗内部滚动穿透
|
|
||||||
&.is-mobile-scroll {
|
|
||||||
touch-action: pan-y;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-dialog__footer {
|
|
||||||
padding: 0.4rem 0.6rem;
|
|
||||||
border-top: 1px solid #f0f0f0;
|
|
||||||
background: #fafbfc;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 表单项样式
|
|
||||||
::v-deep .el-form {
|
|
||||||
.el-form-item {
|
|
||||||
margin-bottom: 0.4rem;
|
|
||||||
|
|
||||||
.el-form-item__label {
|
|
||||||
padding-bottom: 0.12rem;
|
|
||||||
font-size: 0.32rem;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #333;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-input,
|
|
||||||
.el-textarea {
|
|
||||||
.el-input__inner,
|
|
||||||
.el-textarea__inner {
|
|
||||||
font-size: 0.32rem;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
border-radius: 0.24rem;
|
|
||||||
transition: all 0.3s;
|
|
||||||
padding: 0.24rem 0.32rem;
|
|
||||||
color: #333;
|
|
||||||
// 修复移动端点击问题
|
|
||||||
touch-action: manipulation;
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
border-color: #c0c4cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:focus {
|
|
||||||
border-color: #275aff;
|
|
||||||
box-shadow: 0 0 0 0.04rem rgba(39, 90, 255, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
&::placeholder {
|
|
||||||
color: #999;
|
|
||||||
font-size: 0.28rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-textarea__inner {
|
|
||||||
min-height: 2.4rem;
|
|
||||||
line-height: 1.5;
|
|
||||||
resize: vertical;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-radio {
|
|
||||||
margin-right: 0.6rem;
|
|
||||||
|
|
||||||
.el-radio__label {
|
|
||||||
font-size: 0.32rem;
|
|
||||||
color: #666;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-radio__inner {
|
|
||||||
width: 0.36rem;
|
|
||||||
height: 0.36rem;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
width: 0.18rem;
|
|
||||||
height: 0.18rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 协议复选框样式 - 修改字体大小和防止横向滚动条
|
|
||||||
.agreement-checkbox {
|
|
||||||
margin: 0.4rem 0 0.6rem;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
color: #666;
|
|
||||||
width: 100%;
|
|
||||||
overflow: visible;
|
|
||||||
|
|
||||||
::v-deep .el-checkbox {
|
|
||||||
display: flex;
|
|
||||||
align-items: flex-start;
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.el-checkbox__label {
|
|
||||||
color: #666;
|
|
||||||
padding-left: 0.16rem;
|
|
||||||
white-space: normal;
|
|
||||||
word-wrap: break-word;
|
|
||||||
word-break: break-word;
|
|
||||||
overflow-wrap: break-word;
|
|
||||||
width: calc(100% - 0.48rem);
|
|
||||||
font-size: 0.16rem;
|
|
||||||
line-height: 1.5;
|
|
||||||
|
|
||||||
.agreement-text {
|
|
||||||
width: 100%;
|
|
||||||
font-size: 0.16rem;
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin: 0.08rem 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-checkbox__inner {
|
|
||||||
flex-shrink: 0;
|
|
||||||
width: 0.32rem;
|
|
||||||
height: 0.32rem;
|
|
||||||
border-radius: 0.08rem;
|
|
||||||
margin-top: 0.04rem;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
border-width: 0.04rem;
|
|
||||||
left: 0.1rem;
|
|
||||||
top: 0.04rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 二维码区域样式
|
|
||||||
.qrcode-section {
|
|
||||||
margin: 0.4rem 0 0.6rem;
|
|
||||||
padding: 0.4rem;
|
|
||||||
background: #f8f9ff;
|
|
||||||
border-radius: 0.32rem;
|
|
||||||
border: 1px solid #e8edff;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 3.2rem;
|
|
||||||
height: 3.2rem;
|
|
||||||
object-fit: contain;
|
|
||||||
margin-bottom: 0.4rem;
|
|
||||||
border-radius: 0.16rem;
|
|
||||||
box-shadow: 0 0.08rem 0.32rem rgba(0, 0, 0, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
font-size: 0.28rem;
|
|
||||||
color: #666;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 提交按钮样式
|
|
||||||
.dialog-footer {
|
|
||||||
::v-deep .el-button {
|
|
||||||
min-width: 2.4rem;
|
|
||||||
height: 0.88rem;
|
|
||||||
font-size: 0.32rem;
|
|
||||||
border-radius: 0.44rem;
|
|
||||||
padding: 0 0.8rem;
|
|
||||||
font-weight: 500;
|
|
||||||
border: none;
|
|
||||||
background: linear-gradient(135deg, #275aff 0%, #5a7dff 100%);
|
|
||||||
box-shadow: 0 0.08rem 0.32rem rgba(39, 90, 255, 0.3);
|
|
||||||
transition: all 0.3s;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
transform: translateY(-0.04rem);
|
|
||||||
box-shadow: 0 0.16rem 0.48rem rgba(39, 90, 255, 0.4);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-icon-loading {
|
|
||||||
font-size: 0.32rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 消息提示样式优化
|
|
||||||
:deep(.el-message) {
|
|
||||||
font-size: 0.32rem !important;
|
|
||||||
min-width: auto !important;
|
|
||||||
padding: 0.24rem 0.4rem !important;
|
|
||||||
border-radius: 0.32rem !important;
|
|
||||||
box-shadow: 0 0.16rem 0.48rem rgba(0, 0, 0, 0.15) !important;
|
|
||||||
border: none !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-message__content) {
|
|
||||||
font-size: 0.32rem !important;
|
|
||||||
line-height: 1.5 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 响应式适配
|
|
||||||
@media screen and (max-width: 750px) {
|
|
||||||
.dialog-tit {
|
|
||||||
font-size: 0.32rem;
|
|
||||||
padding: 0.15rem 0 0.3rem;
|
|
||||||
|
|
||||||
.pc-tip {
|
|
||||||
i {
|
|
||||||
font-size: 0.34rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
font-size: 0.3rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.url_box {
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: flex-start;
|
|
||||||
gap: 0.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url-container {
|
|
||||||
width: 100%;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: flex-start;
|
|
||||||
|
|
||||||
.url {
|
|
||||||
width: 100%;
|
|
||||||
padding: 0.1rem 0.2rem;
|
|
||||||
font-size: 0.28rem;
|
|
||||||
margin: 0.1rem 0 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.url_btn {
|
|
||||||
margin-left: 0;
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
.copy-hint {
|
|
||||||
width: 100%;
|
|
||||||
max-width: 3rem;
|
|
||||||
font-size: 0.24rem;
|
|
||||||
padding: 0.12rem 0.24rem;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.check-tit {
|
|
||||||
font-size: 0.16rem;
|
|
||||||
line-height: 1.6;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .product-consult-dialog {
|
|
||||||
&.el-dialog {
|
|
||||||
width: 90% !important;
|
|
||||||
margin-top: 10vh !important;
|
|
||||||
border-radius: 0.24rem;
|
|
||||||
|
|
||||||
.el-dialog__header {
|
|
||||||
padding: 0.25rem 0.3rem 0.2rem;
|
|
||||||
|
|
||||||
.el-dialog__title {
|
|
||||||
font-size: 0.34rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-dialog__body {
|
|
||||||
padding: 0.2rem .3rem;
|
|
||||||
// 移动端优化
|
|
||||||
-webkit-overflow-scrolling: touch;
|
|
||||||
max-height: 60vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-dialog__footer {
|
|
||||||
padding: 0.25rem 0.3rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-form {
|
|
||||||
.el-form-item {
|
|
||||||
margin-bottom: 0.3rem;
|
|
||||||
|
|
||||||
.el-form-item__label {
|
|
||||||
font-size: 0.28rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-input,
|
|
||||||
.el-textarea {
|
|
||||||
.el-input__inner,
|
|
||||||
.el-textarea__inner {
|
|
||||||
font-size: 0.28rem;
|
|
||||||
padding: 0.2rem 0.24rem;
|
|
||||||
// 修复iOS输入框点击问题
|
|
||||||
-webkit-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-radio {
|
|
||||||
.el-radio__label {
|
|
||||||
font-size: 0.28rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 移动端协议复选框字体调整
|
|
||||||
.agreement-checkbox {
|
|
||||||
margin: 0.3rem 0 0.4rem;
|
|
||||||
|
|
||||||
::v-deep .el-checkbox {
|
|
||||||
.el-checkbox__label {
|
|
||||||
font-size: 0.22rem !important;
|
|
||||||
padding-left: 0.12rem;
|
|
||||||
line-height: 1.6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-checkbox__inner {
|
|
||||||
width: 0.28rem;
|
|
||||||
height: 0.28rem;
|
|
||||||
margin-top: 0.02rem;
|
|
||||||
|
|
||||||
&::after {
|
|
||||||
left: 0.08rem;
|
|
||||||
top: 0.02rem;
|
|
||||||
border-width: 0.03rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.qrcode-section {
|
|
||||||
padding: 0.3rem;
|
|
||||||
margin: 0.3rem 0 0.4rem;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 2.4rem;
|
|
||||||
height: 2.4rem;
|
|
||||||
margin-bottom: 0.3rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
font-size: 0.24rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.dialog-footer {
|
|
||||||
::v-deep .el-button {
|
|
||||||
min-width: 100%;
|
|
||||||
height: 0.8rem;
|
|
||||||
font-size: 0.28rem;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 751px) and (max-width: 1200px) {
|
|
||||||
::v-deep .product-consult-dialog {
|
|
||||||
&.el-dialog {
|
|
||||||
width: 70% !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 平板端协议复选框字体
|
|
||||||
.agreement-checkbox {
|
|
||||||
::v-deep .el-checkbox {
|
|
||||||
.el-checkbox__label {
|
|
||||||
font-size: 0.26rem !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 移动端优化 - 修复点击问题
|
|
||||||
@media screen and (max-width: 750px) {
|
|
||||||
// 确保所有可点击元素都能正常响应
|
|
||||||
.url,
|
|
||||||
.url_btn .copy-hint,
|
|
||||||
.el-checkbox__inner,
|
|
||||||
.el-radio__inner,
|
|
||||||
.el-button {
|
|
||||||
cursor: pointer;
|
|
||||||
-webkit-tap-highlight-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 修复iOS输入框点击问题
|
|
||||||
.el-input__inner,
|
|
||||||
.el-textarea__inner {
|
|
||||||
font-size: 16px !important;
|
|
||||||
-webkit-appearance: none;
|
|
||||||
appearance: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 确保弹窗内容区域可点击
|
|
||||||
.product-consult-dialog {
|
|
||||||
pointer-events: auto !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 防止弹窗背景滚动
|
|
||||||
.el-dialog__wrapper {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
&.el-dialog__wrapper--fixed {
|
|
||||||
touch-action: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -129,7 +129,7 @@ export default {
|
|||||||
content = `我想咨询关于【${product.title || '产品'}】的详细信息`
|
content = `我想咨询关于【${product.title || '产品'}】的详细信息`
|
||||||
} else if (source === 'spec') {
|
} else if (source === 'spec') {
|
||||||
// 从规格列表咨询
|
// 从规格列表咨询
|
||||||
content = `我想咨询【${product.title || '产品规格'}】的价格和租赁详情，价格：${product.price}${product.price_unit || ''}`
|
content = `我想咨询【${product.title || '产品规格'}】的价格和租赁详情`
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置咨询表单的预填内容
|
// 设置咨询表单的预填内容
|
||||||
|
|||||||
@ -1,35 +1,14 @@
|
|||||||
.check-tit {
|
|
||||||
font-size: 0.16rem;
|
|
||||||
color: #333;
|
|
||||||
line-height: 0.1rem;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
.url_btn {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-left: 0.1rem;
|
|
||||||
}
|
|
||||||
.url_btn .copy-hint {
|
|
||||||
font-size: 0.26rem;
|
|
||||||
color: #000;
|
|
||||||
margin-top: 0.16rem;
|
|
||||||
padding: 0.04rem 0.12rem;
|
|
||||||
border-radius: 0.12rem;
|
|
||||||
border: 1px solid #000;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
.url:hover .url_btn {
|
|
||||||
color: #275aff;
|
|
||||||
border-color: #275aff;
|
|
||||||
}
|
|
||||||
.url.copied .url_btn {
|
|
||||||
color: #67c23a;
|
|
||||||
border-color: #67c23a;
|
|
||||||
}
|
|
||||||
* {
|
* {
|
||||||
touch-action: manipulation;
|
touch-action: manipulation;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
::v-deep .el-dialog__wrapper .el-dialog .el-dialog__body .el-input .el-input__inner,
|
||||||
|
::v-deep .el-dialog__wrapper .el-dialog .el-dialog__body .el-textarea .el-input__inner,
|
||||||
|
::v-deep .el-dialog__wrapper .el-dialog .el-dialog__body .el-input .el-textarea__inner,
|
||||||
|
::v-deep .el-dialog__wrapper .el-dialog .el-dialog__body .el-textarea .el-textarea__inner {
|
||||||
|
touch-action: manipulation;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
.dialog-tit {
|
.dialog-tit {
|
||||||
font-size: 0.4rem;
|
font-size: 0.4rem;
|
||||||
color: #333;
|
color: #333;
|
||||||
@ -52,13 +31,16 @@
|
|||||||
font-size: 0.36rem;
|
font-size: 0.36rem;
|
||||||
}
|
}
|
||||||
.url_box {
|
.url_box {
|
||||||
font-size: 0.32rem;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
margin-top: 0.2rem;
|
margin-top: 0.2rem;
|
||||||
}
|
}
|
||||||
.url-container {
|
.url-container {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
flex: 1;
|
||||||
}
|
}
|
||||||
.url-container .url {
|
.url-container .url {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
@ -72,6 +54,7 @@
|
|||||||
user-select: none;
|
user-select: none;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
background: #f5f7ff;
|
background: #f5f7ff;
|
||||||
|
margin-left: 0.2rem;
|
||||||
}
|
}
|
||||||
.url-container .url:hover {
|
.url-container .url:hover {
|
||||||
background-color: #e8edff;
|
background-color: #e8edff;
|
||||||
@ -118,6 +101,42 @@
|
|||||||
opacity: 1;
|
opacity: 1;
|
||||||
transform: translateX(-50%) translateY(0);
|
transform: translateX(-50%) translateY(0);
|
||||||
}
|
}
|
||||||
|
.url_btn {
|
||||||
|
margin-left: 0.4rem;
|
||||||
|
}
|
||||||
|
.url_btn .copy-hint {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 0.26rem;
|
||||||
|
color: #000;
|
||||||
|
padding: 0.1rem 0.2rem;
|
||||||
|
border-radius: 0.12rem;
|
||||||
|
border: 1px solid #000;
|
||||||
|
transition: all 0.2s;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
min-width: 1.2rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.url_btn .copy-hint:hover {
|
||||||
|
color: #275aff;
|
||||||
|
border-color: #275aff;
|
||||||
|
}
|
||||||
|
.url.copied .url_btn .copy-hint {
|
||||||
|
color: #67c23a;
|
||||||
|
border-color: #67c23a;
|
||||||
|
}
|
||||||
|
.check-tit {
|
||||||
|
font-size: 0.16rem;
|
||||||
|
color: #666;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0.08rem 0;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.check-tit span {
|
||||||
|
color: #275aff;
|
||||||
|
font-weight: 500;
|
||||||
|
margin: 0 0.04rem;
|
||||||
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog {
|
::v-deep .product-consult-dialog.el-dialog {
|
||||||
border-radius: 0.32rem;
|
border-radius: 0.32rem;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -149,6 +168,10 @@
|
|||||||
padding: 0.2rem 0.6rem;
|
padding: 0.2rem 0.6rem;
|
||||||
max-height: 70vh;
|
max-height: 70vh;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
}
|
||||||
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__body.is-mobile-scroll {
|
||||||
|
touch-action: pan-y;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog .el-dialog__footer {
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__footer {
|
||||||
padding: 0.4rem 0.6rem;
|
padding: 0.4rem 0.6rem;
|
||||||
@ -175,6 +198,8 @@
|
|||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
padding: 0.24rem 0.32rem;
|
padding: 0.24rem 0.32rem;
|
||||||
color: #333;
|
color: #333;
|
||||||
|
touch-action: manipulation;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
}
|
}
|
||||||
::v-deep .el-form .el-form-item .el-input .el-input__inner:hover,
|
::v-deep .el-form .el-form-item .el-input .el-input__inner:hover,
|
||||||
::v-deep .el-form .el-form-item .el-textarea .el-input__inner:hover,
|
::v-deep .el-form .el-form-item .el-textarea .el-input__inner:hover,
|
||||||
@ -237,12 +262,15 @@
|
|||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
width: calc(100% - 0.48rem);
|
width: calc(100% - 0.48rem);
|
||||||
|
font-size: 0.16rem;
|
||||||
|
line-height: 1.5;
|
||||||
}
|
}
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label .agreement-text span {
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label .agreement-text {
|
||||||
color: #275aff;
|
width: 100%;
|
||||||
font-weight: 500;
|
font-size: 0.16rem;
|
||||||
margin: 0 0.08rem;
|
}
|
||||||
white-space: normal;
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label .agreement-text p {
|
||||||
|
margin: 0.08rem 0;
|
||||||
}
|
}
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__inner {
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__inner {
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
@ -314,57 +342,51 @@
|
|||||||
font-size: 0.32rem !important;
|
font-size: 0.32rem !important;
|
||||||
line-height: 1.5 !important;
|
line-height: 1.5 !important;
|
||||||
}
|
}
|
||||||
:deep(.el-message--success) {
|
|
||||||
background: linear-gradient(135deg, #e1f3d8 0%, #f0f9eb 100%) !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message--success) .el-message__content {
|
|
||||||
color: #67c23a !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message--error) {
|
|
||||||
background: linear-gradient(135deg, #fde2e2 0%, #fef0f0 100%) !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message--error) .el-message__content {
|
|
||||||
color: #f56c6c !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message--warning) {
|
|
||||||
background: linear-gradient(135deg, #faecd8 0%, #fdf6ec 100%) !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message--warning) .el-message__content {
|
|
||||||
color: #e6a23c !important;
|
|
||||||
}
|
|
||||||
@media screen and (max-width: 750px) {
|
@media screen and (max-width: 750px) {
|
||||||
.dialog-tit {
|
.dialog-tit {
|
||||||
font-size: 0.36rem;
|
font-size: 0.32rem;
|
||||||
padding: 0.16rem 0 0.32rem;
|
padding: 0.15rem 0 0.3rem;
|
||||||
}
|
}
|
||||||
.dialog-tit .pc-tip i {
|
.dialog-tit .pc-tip i {
|
||||||
font-size: 0.38rem;
|
font-size: 0.34rem;
|
||||||
}
|
}
|
||||||
.dialog-tit .pc-tip span {
|
.dialog-tit .pc-tip span {
|
||||||
font-size: 0.32rem;
|
font-size: 0.3rem;
|
||||||
}
|
}
|
||||||
.url_box {
|
.url_box {
|
||||||
font-size: 0.28rem;
|
|
||||||
}
|
|
||||||
.url-container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
|
gap: 0.2rem;
|
||||||
|
}
|
||||||
|
.url-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
}
|
}
|
||||||
.url-container .url {
|
.url-container .url {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0.1rem 0.2rem;
|
padding: 0.1rem 0.2rem;
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
margin-top: 0.1rem;
|
margin: 0.1rem 0 0;
|
||||||
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
.url-container .url .copy-hint {
|
.url_btn {
|
||||||
font-size: 0.22rem;
|
margin-left: 0;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
.url-container .tooltip {
|
.url_btn .copy-hint {
|
||||||
font-size: 0.2rem;
|
width: 100%;
|
||||||
padding: 0.06rem 0.12rem;
|
max-width: 3rem;
|
||||||
transform: translateX(-50%) translateY(-0.12rem);
|
font-size: 0.24rem;
|
||||||
|
padding: 0.12rem 0.24rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.check-tit {
|
||||||
|
font-size: 0.16rem;
|
||||||
|
line-height: 1.6;
|
||||||
|
font-weight: 600;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog {
|
::v-deep .product-consult-dialog.el-dialog {
|
||||||
width: 90% !important;
|
width: 90% !important;
|
||||||
@ -372,19 +394,21 @@
|
|||||||
border-radius: 0.24rem;
|
border-radius: 0.24rem;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog .el-dialog__header {
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__header {
|
||||||
padding: 0.32rem 0.4rem 0.24rem;
|
padding: 0.25rem 0.3rem 0.2rem;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog .el-dialog__header .el-dialog__title {
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__header .el-dialog__title {
|
||||||
font-size: 0.36rem;
|
font-size: 0.34rem;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog .el-dialog__body {
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__body {
|
||||||
padding: 0.2rem 0.4rem;
|
padding: 0.2rem 0.3rem;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
max-height: 60vh;
|
||||||
}
|
}
|
||||||
::v-deep .product-consult-dialog.el-dialog .el-dialog__footer {
|
::v-deep .product-consult-dialog.el-dialog .el-dialog__footer {
|
||||||
padding: 0.32rem 0.4rem;
|
padding: 0.25rem 0.3rem;
|
||||||
}
|
}
|
||||||
::v-deep .el-form .el-form-item {
|
::v-deep .el-form .el-form-item {
|
||||||
margin-bottom: 0.32rem;
|
margin-bottom: 0.3rem;
|
||||||
}
|
}
|
||||||
::v-deep .el-form .el-form-item .el-form-item__label {
|
::v-deep .el-form .el-form-item .el-form-item__label {
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
@ -395,19 +419,18 @@
|
|||||||
::v-deep .el-form .el-form-item .el-textarea .el-textarea__inner {
|
::v-deep .el-form .el-form-item .el-textarea .el-textarea__inner {
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
padding: 0.2rem 0.24rem;
|
padding: 0.2rem 0.24rem;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
}
|
}
|
||||||
::v-deep .el-form .el-form-item .el-radio .el-radio__label {
|
::v-deep .el-form .el-form-item .el-radio .el-radio__label {
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
}
|
}
|
||||||
.agreement-checkbox {
|
.agreement-checkbox {
|
||||||
margin: 0.32rem 0 0.4rem;
|
margin: 0.3rem 0 0.4rem;
|
||||||
}
|
}
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label {
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label {
|
||||||
font-size: 0.24rem !important;
|
font-size: 0.22rem !important;
|
||||||
padding-left: 0.12rem;
|
padding-left: 0.12rem;
|
||||||
}
|
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label .agreement-text {
|
|
||||||
font-size: 0.24rem !important;
|
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__inner {
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__inner {
|
||||||
@ -421,29 +444,23 @@
|
|||||||
border-width: 0.03rem;
|
border-width: 0.03rem;
|
||||||
}
|
}
|
||||||
.qrcode-section {
|
.qrcode-section {
|
||||||
padding: 0.32rem;
|
padding: 0.3rem;
|
||||||
margin: 0.32rem 0 0.4rem;
|
margin: 0.3rem 0 0.4rem;
|
||||||
}
|
}
|
||||||
.qrcode-section img {
|
.qrcode-section img {
|
||||||
width: 2.4rem;
|
width: 2.4rem;
|
||||||
height: 2.4rem;
|
height: 2.4rem;
|
||||||
margin-bottom: 0.32rem;
|
margin-bottom: 0.3rem;
|
||||||
}
|
}
|
||||||
.qrcode-section span {
|
.qrcode-section span {
|
||||||
font-size: 0.24rem;
|
font-size: 0.24rem;
|
||||||
}
|
}
|
||||||
.dialog-footer ::v-deep .el-button {
|
.dialog-footer ::v-deep .el-button {
|
||||||
min-width: 2rem;
|
min-width: 100%;
|
||||||
height: 0.8rem;
|
height: 0.8rem;
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
padding: 0 0.6rem;
|
padding: 0;
|
||||||
}
|
margin: 0;
|
||||||
:deep(.el-message) {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
padding: 0.2rem 0.32rem !important;
|
|
||||||
}
|
|
||||||
:deep(.el-message__content) {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (min-width: 751px) and (max-width: 1200px) {
|
@media screen and (min-width: 751px) and (max-width: 1200px) {
|
||||||
@ -451,18 +468,14 @@
|
|||||||
width: 70% !important;
|
width: 70% !important;
|
||||||
}
|
}
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label {
|
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label {
|
||||||
font-size: 0.28rem !important;
|
font-size: 0.26rem !important;
|
||||||
}
|
|
||||||
.agreement-checkbox ::v-deep .el-checkbox .el-checkbox__label .agreement-text {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media screen and (max-width: 750px) {
|
@media screen and (max-width: 750px) {
|
||||||
.url,
|
.url,
|
||||||
.el-input__inner,
|
.url_btn .copy-hint,
|
||||||
.el-textarea__inner,
|
|
||||||
.el-radio__inner,
|
|
||||||
.el-checkbox__inner,
|
.el-checkbox__inner,
|
||||||
|
.el-radio__inner,
|
||||||
.el-button {
|
.el-button {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
-webkit-tap-highlight-color: transparent;
|
-webkit-tap-highlight-color: transparent;
|
||||||
@ -470,14 +483,21 @@
|
|||||||
.el-input__inner,
|
.el-input__inner,
|
||||||
.el-textarea__inner {
|
.el-textarea__inner {
|
||||||
font-size: 16px !important;
|
font-size: 16px !important;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
}
|
}
|
||||||
.product-consult-dialog {
|
.product-consult-dialog {
|
||||||
pointer-events: auto !important;
|
pointer-events: auto !important;
|
||||||
}
|
}
|
||||||
::v-deep .el-dialog__wrapper {
|
.el-dialog__wrapper {
|
||||||
-webkit-overflow-scrolling: touch;
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
::v-deep .el-form-item {
|
.el-dialog__wrapper.el-dialog__wrapper--fixed {
|
||||||
margin-bottom: 0.32rem !important;
|
touch-action: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,42 +1,26 @@
|
|||||||
.check-tit {
|
|
||||||
font-size: 0.16rem;
|
|
||||||
color: #333;
|
|
||||||
line-height: .1rem;
|
|
||||||
font-weight: 600;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url_btn {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-left: 0.1rem;
|
|
||||||
|
|
||||||
.copy-hint {
|
|
||||||
font-size: 0.26rem;
|
|
||||||
color: #000;
|
|
||||||
margin-top: .16rem;
|
|
||||||
padding: 0.04rem 0.12rem;
|
|
||||||
border-radius: 0.12rem;
|
|
||||||
border: 1px solid #000;
|
|
||||||
transition: all 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url:hover & {
|
|
||||||
color: #275aff;
|
|
||||||
border-color: #275aff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.url.copied & {
|
|
||||||
color: #67c23a;
|
|
||||||
border-color: #67c23a;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 基础样式
|
// 基础样式
|
||||||
* {
|
* {
|
||||||
touch-action: manipulation;
|
touch-action: manipulation;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 修复移动端输入框点击问题
|
||||||
|
::v-deep .el-dialog__wrapper {
|
||||||
|
.el-dialog {
|
||||||
|
.el-dialog__body {
|
||||||
|
.el-input,
|
||||||
|
.el-textarea {
|
||||||
|
.el-input__inner,
|
||||||
|
.el-textarea__inner {
|
||||||
|
// 确保移动端点击区域正常
|
||||||
|
touch-action: manipulation;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 头部样式
|
// 头部样式
|
||||||
.dialog-tit {
|
.dialog-tit {
|
||||||
font-size: 0.4rem;
|
font-size: 0.4rem;
|
||||||
@ -64,7 +48,9 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.url_box {
|
.url_box {
|
||||||
font-size: 0.32rem;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
margin-top: 0.2rem;
|
margin-top: 0.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -72,6 +58,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
.url {
|
.url {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
@ -85,6 +72,7 @@
|
|||||||
user-select: none;
|
user-select: none;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
background: #f5f7ff;
|
background: #f5f7ff;
|
||||||
|
margin-left: 0.2rem;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #e8edff;
|
background-color: #e8edff;
|
||||||
@ -103,8 +91,6 @@
|
|||||||
border-color: #5daf34;
|
border-color: #5daf34;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.tooltip {
|
.tooltip {
|
||||||
@ -141,6 +127,48 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.url_btn {
|
||||||
|
margin-left: 0.4rem;
|
||||||
|
|
||||||
|
.copy-hint {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 0.26rem;
|
||||||
|
color: #000;
|
||||||
|
padding: 0.1rem 0.2rem;
|
||||||
|
border-radius: 0.12rem;
|
||||||
|
border: 1px solid #000;
|
||||||
|
transition: all 0.2s;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
min-width: 1.2rem;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #275aff;
|
||||||
|
border-color: #275aff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.url.copied & .copy-hint {
|
||||||
|
color: #67c23a;
|
||||||
|
border-color: #67c23a;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.check-tit {
|
||||||
|
font-size: 0.16rem;
|
||||||
|
color: #666;
|
||||||
|
line-height: 1;
|
||||||
|
margin: 0.08rem 0;
|
||||||
|
font-weight: normal;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #275aff;
|
||||||
|
font-weight: 500;
|
||||||
|
margin: 0 0.04rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 表单样式优化
|
// 表单样式优化
|
||||||
::v-deep .product-consult-dialog {
|
::v-deep .product-consult-dialog {
|
||||||
&.el-dialog {
|
&.el-dialog {
|
||||||
@ -179,6 +207,14 @@
|
|||||||
padding: 0.2rem .6rem;
|
padding: 0.2rem .6rem;
|
||||||
max-height: 70vh;
|
max-height: 70vh;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
|
// 移动端滚动优化
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
// 防止弹窗内部滚动穿透
|
||||||
|
&.is-mobile-scroll {
|
||||||
|
touch-action: pan-y;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-dialog__footer {
|
.el-dialog__footer {
|
||||||
@ -204,7 +240,6 @@
|
|||||||
|
|
||||||
.el-input,
|
.el-input,
|
||||||
.el-textarea {
|
.el-textarea {
|
||||||
|
|
||||||
.el-input__inner,
|
.el-input__inner,
|
||||||
.el-textarea__inner {
|
.el-textarea__inner {
|
||||||
font-size: 0.32rem;
|
font-size: 0.32rem;
|
||||||
@ -213,6 +248,9 @@
|
|||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
padding: 0.24rem 0.32rem;
|
padding: 0.24rem 0.32rem;
|
||||||
color: #333;
|
color: #333;
|
||||||
|
// 修复移动端点击问题
|
||||||
|
touch-action: manipulation;
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
border-color: #c0c4cc;
|
border-color: #c0c4cc;
|
||||||
@ -279,13 +317,15 @@
|
|||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
overflow-wrap: break-word;
|
overflow-wrap: break-word;
|
||||||
width: calc(100% - 0.48rem);
|
width: calc(100% - 0.48rem);
|
||||||
|
font-size: 0.16rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
|
||||||
.agreement-text {
|
.agreement-text {
|
||||||
span {
|
width: 100%;
|
||||||
color: #275aff;
|
font-size: 0.16rem;
|
||||||
font-weight: 500;
|
|
||||||
margin: 0 0.08rem;
|
p {
|
||||||
white-space: normal;
|
margin: 0.08rem 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -334,7 +374,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 提交按钮样式 - 移除禁用状态
|
// 提交按钮样式
|
||||||
.dialog-footer {
|
.dialog-footer {
|
||||||
::v-deep .el-button {
|
::v-deep .el-button {
|
||||||
min-width: 2.4rem;
|
min-width: 2.4rem;
|
||||||
@ -378,74 +418,62 @@
|
|||||||
line-height: 1.5 !important;
|
line-height: 1.5 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.el-message--success) {
|
|
||||||
background: linear-gradient(135deg, #e1f3d8 0%, #f0f9eb 100%) !important;
|
|
||||||
|
|
||||||
.el-message__content {
|
|
||||||
color: #67c23a !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-message--error) {
|
|
||||||
background: linear-gradient(135deg, #fde2e2 0%, #fef0f0 100%) !important;
|
|
||||||
|
|
||||||
.el-message__content {
|
|
||||||
color: #f56c6c !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-message--warning) {
|
|
||||||
background: linear-gradient(135deg, #faecd8 0%, #fdf6ec 100%) !important;
|
|
||||||
|
|
||||||
.el-message__content {
|
|
||||||
color: #e6a23c !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 响应式适配
|
// 响应式适配
|
||||||
@media screen and (max-width: 750px) {
|
@media screen and (max-width: 750px) {
|
||||||
.dialog-tit {
|
.dialog-tit {
|
||||||
font-size: 0.36rem;
|
font-size: 0.32rem;
|
||||||
padding: 0.16rem 0 0.32rem;
|
padding: 0.15rem 0 0.3rem;
|
||||||
|
|
||||||
.pc-tip {
|
.pc-tip {
|
||||||
i {
|
i {
|
||||||
font-size: 0.38rem;
|
font-size: 0.34rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
font-size: 0.32rem;
|
font-size: 0.3rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.url_box {
|
.url_box {
|
||||||
font-size: 0.28rem;
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: 0.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.url-container {
|
.url-container {
|
||||||
display: flex;
|
width: 100%;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.url {
|
.url {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0.1rem 0.2rem;
|
padding: 0.1rem 0.2rem;
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
margin-top: .1rem;
|
margin: 0.1rem 0 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.url_btn {
|
||||||
|
margin-left: 0;
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
.copy-hint {
|
.copy-hint {
|
||||||
font-size: 0.22rem;
|
width: 100%;
|
||||||
// padding: 0.03rem 0.08rem;
|
max-width: 3rem;
|
||||||
|
font-size: 0.24rem;
|
||||||
|
padding: 0.12rem 0.24rem;
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.tooltip {
|
.check-tit {
|
||||||
font-size: 0.2rem;
|
font-size: 0.16rem;
|
||||||
padding: 0.06rem 0.12rem;
|
line-height: 1.6;
|
||||||
transform: translateX(-50%) translateY(-0.12rem);
|
font-weight: 600;
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .product-consult-dialog {
|
::v-deep .product-consult-dialog {
|
||||||
@ -455,26 +483,29 @@
|
|||||||
border-radius: 0.24rem;
|
border-radius: 0.24rem;
|
||||||
|
|
||||||
.el-dialog__header {
|
.el-dialog__header {
|
||||||
padding: 0.32rem 0.4rem 0.24rem;
|
padding: 0.25rem 0.3rem 0.2rem;
|
||||||
|
|
||||||
.el-dialog__title {
|
.el-dialog__title {
|
||||||
font-size: 0.36rem;
|
font-size: 0.34rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-dialog__body {
|
.el-dialog__body {
|
||||||
padding: 0.2rem .4rem;
|
padding: 0.2rem .3rem;
|
||||||
|
// 移动端优化
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
max-height: 60vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-dialog__footer {
|
.el-dialog__footer {
|
||||||
padding: 0.32rem 0.4rem;
|
padding: 0.25rem 0.3rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .el-form {
|
::v-deep .el-form {
|
||||||
.el-form-item {
|
.el-form-item {
|
||||||
margin-bottom: 0.32rem;
|
margin-bottom: 0.3rem;
|
||||||
|
|
||||||
.el-form-item__label {
|
.el-form-item__label {
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
@ -482,11 +513,13 @@
|
|||||||
|
|
||||||
.el-input,
|
.el-input,
|
||||||
.el-textarea {
|
.el-textarea {
|
||||||
|
|
||||||
.el-input__inner,
|
.el-input__inner,
|
||||||
.el-textarea__inner {
|
.el-textarea__inner {
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
padding: 0.2rem 0.24rem;
|
padding: 0.2rem 0.24rem;
|
||||||
|
// 修复iOS输入框点击问题
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -500,18 +533,14 @@
|
|||||||
|
|
||||||
// 移动端协议复选框字体调整
|
// 移动端协议复选框字体调整
|
||||||
.agreement-checkbox {
|
.agreement-checkbox {
|
||||||
margin: 0.32rem 0 0.4rem;
|
margin: 0.3rem 0 0.4rem;
|
||||||
|
|
||||||
::v-deep .el-checkbox {
|
::v-deep .el-checkbox {
|
||||||
.el-checkbox__label {
|
.el-checkbox__label {
|
||||||
font-size: 0.24rem !important;
|
font-size: 0.22rem !important;
|
||||||
padding-left: 0.12rem;
|
padding-left: 0.12rem;
|
||||||
|
|
||||||
.agreement-text {
|
|
||||||
font-size: 0.24rem !important;
|
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.el-checkbox__inner {
|
.el-checkbox__inner {
|
||||||
width: 0.28rem;
|
width: 0.28rem;
|
||||||
@ -528,13 +557,13 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.qrcode-section {
|
.qrcode-section {
|
||||||
padding: 0.32rem;
|
padding: 0.3rem;
|
||||||
margin: 0.32rem 0 0.4rem;
|
margin: 0.3rem 0 0.4rem;
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 2.4rem;
|
width: 2.4rem;
|
||||||
height: 2.4rem;
|
height: 2.4rem;
|
||||||
margin-bottom: 0.32rem;
|
margin-bottom: 0.3rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
@ -544,21 +573,13 @@
|
|||||||
|
|
||||||
.dialog-footer {
|
.dialog-footer {
|
||||||
::v-deep .el-button {
|
::v-deep .el-button {
|
||||||
min-width: 2rem;
|
min-width: 100%;
|
||||||
height: 0.8rem;
|
height: 0.8rem;
|
||||||
font-size: 0.28rem;
|
font-size: 0.28rem;
|
||||||
padding: 0 0.6rem;
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.el-message) {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
padding: 0.2rem 0.32rem !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-message__content) {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 751px) and (max-width: 1200px) {
|
@media screen and (min-width: 751px) and (max-width: 1200px) {
|
||||||
@ -572,43 +593,48 @@
|
|||||||
.agreement-checkbox {
|
.agreement-checkbox {
|
||||||
::v-deep .el-checkbox {
|
::v-deep .el-checkbox {
|
||||||
.el-checkbox__label {
|
.el-checkbox__label {
|
||||||
font-size: 0.28rem !important;
|
font-size: 0.26rem !important;
|
||||||
|
|
||||||
.agreement-text {
|
|
||||||
font-size: 0.28rem !important;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 移动端优化
|
// 移动端优化 - 修复点击问题
|
||||||
@media screen and (max-width: 750px) {
|
@media screen and (max-width: 750px) {
|
||||||
|
// 确保所有可点击元素都能正常响应
|
||||||
.url,
|
.url,
|
||||||
.el-input__inner,
|
.url_btn .copy-hint,
|
||||||
.el-textarea__inner,
|
|
||||||
.el-radio__inner,
|
|
||||||
.el-checkbox__inner,
|
.el-checkbox__inner,
|
||||||
|
.el-radio__inner,
|
||||||
.el-button {
|
.el-button {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
-webkit-tap-highlight-color: transparent;
|
-webkit-tap-highlight-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 修复iOS输入框点击问题
|
||||||
.el-input__inner,
|
.el-input__inner,
|
||||||
.el-textarea__inner {
|
.el-textarea__inner {
|
||||||
font-size: 16px !important;
|
font-size: 16px !important;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
appearance: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 确保弹窗内容区域可点击
|
||||||
.product-consult-dialog {
|
.product-consult-dialog {
|
||||||
pointer-events: auto !important;
|
pointer-events: auto !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .el-dialog__wrapper {
|
// 防止弹窗背景滚动
|
||||||
-webkit-overflow-scrolling: touch;
|
.el-dialog__wrapper {
|
||||||
}
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
::v-deep .el-form-item {
|
&.el-dialog__wrapper--fixed {
|
||||||
margin-bottom: 0.32rem !important;
|
touch-action: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -218,18 +218,6 @@ export default {
|
|||||||
// 准备咨询内容
|
// 准备咨询内容
|
||||||
let content = `我想咨询关于【${this.productList.title || '产品'}】的详细信息`
|
let content = `我想咨询关于【${this.productList.title || '产品'}】的详细信息`
|
||||||
|
|
||||||
// 如果有当前场景，添加到咨询内容中
|
|
||||||
if (this.currentScene) {
|
|
||||||
content += `\n\n当前查看的应用场景：${this.currentScene.memuName}`
|
|
||||||
if (this.currentScene.title_r) {
|
|
||||||
content += `\n场景标题：${this.currentScene.title_r}`
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 如果有产品描述，添加到咨询内容中
|
|
||||||
if (this.productList.description) {
|
|
||||||
content += `\n\n产品描述：${this.productList.description}`
|
|
||||||
}
|
|
||||||
|
|
||||||
// 设置咨询表单的预填内容
|
// 设置咨询表单的预填内容
|
||||||
this.consultFormData = {
|
this.consultFormData = {
|
||||||
|
|||||||
@ -306,7 +306,7 @@ export default {
|
|||||||
// 设置咨询表单的预填内容
|
// 设置咨询表单的预填内容
|
||||||
this.consultFormData = {
|
this.consultFormData = {
|
||||||
...this.consultFormData,
|
...this.consultFormData,
|
||||||
content: `我想咨询关于【${item.title}】（${category}）的产品信息\n产品描述：${item.description}\n${advantageText ? '产品优势：\n' + advantageText : ''}${tagText ? '\n产品标签：' + tagText : ''}${item.price ? '\n参考价格：' + item.price + (item.price_unit || '') : ''}`
|
content: `我想咨询关于【${item.title}】（${category}）的产品信息`
|
||||||
}
|
}
|
||||||
|
|
||||||
this.showConsultDialog = true
|
this.showConsultDialog = true
|
||||||
|
|||||||
@ -225,21 +225,11 @@ export default {
|
|||||||
} else if (source === 'solution_tab') {
|
} else if (source === 'solution_tab') {
|
||||||
// 从解决方案标签咨询
|
// 从解决方案标签咨询
|
||||||
content = `我想咨询关于【${title}】的解决方案`
|
content = `我想咨询关于【${title}】的解决方案`
|
||||||
if (data && data.description) {
|
|
||||||
extraInfo = `方案描述：${data.description.substring(0, 100)}${data.description.length > 100 ? '...' : ''}`
|
|
||||||
}
|
|
||||||
if (data && data.features) {
|
|
||||||
extraInfo += `\n核心功能：${data.features.join('、')}`
|
|
||||||
}
|
|
||||||
} else if (source === 'agent_item') {
|
} else if (source === 'agent_item') {
|
||||||
// 从智能体项目咨询
|
// 从智能体项目咨询
|
||||||
content = `我想咨询关于【${title}】的智能体功能`
|
content = `我想咨询关于【${title}】的智能体功能`
|
||||||
if (data && data.description) {
|
|
||||||
extraInfo = `功能描述：${data.description}`
|
|
||||||
}
|
|
||||||
if (data && data.tag) {
|
|
||||||
extraInfo += `\n功能标签：${data.tag}`
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置咨询表单的预填内容
|
// 设置咨询表单的预填内容
|
||||||
|
|||||||
@ -205,19 +205,9 @@ export default {
|
|||||||
if (source === 'banner') {
|
if (source === 'banner') {
|
||||||
// 从banner咨询
|
// 从banner咨询
|
||||||
content = `我想咨询关于【${title}】的详细信息`
|
content = `我想咨询关于【${title}】的详细信息`
|
||||||
extraInfo = '产品介绍：智能整合全域沟通路径，精准响应用户需求，实现全旅程服务效能提升。'
|
|
||||||
extraInfo += '\n产品优势：自助解决率93%、首字时延1.1s、7*24小时时刻在线'
|
|
||||||
} else if (source.startsWith('service_')) {
|
} else if (source.startsWith('service_')) {
|
||||||
// 从服务项目咨询
|
// 从服务项目咨询
|
||||||
content = `我想咨询关于【${title}】的功能详情`
|
content = `我想咨询关于【${title}】的功能详情`
|
||||||
// 根据具体的服务类型设置额外信息
|
|
||||||
const serviceInfo = {
|
|
||||||
'service_robot': '在线机器人：任务对话、多模态问答、知识问答等功能',
|
|
||||||
'service_online': '在线客服：多渠道集成、会话智能分配、服务监控等功能',
|
|
||||||
'service_contact': '联络中心：智能路由排队、呼叫服务数据实时管理、稳定安全等功能',
|
|
||||||
'service_assist': '坐席辅助：上下游集成、实时智能提示等功能'
|
|
||||||
}
|
|
||||||
extraInfo = serviceInfo[source] || ''
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 设置咨询表单的预填内容
|
// 设置咨询表单的预填内容
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user