Skip to content

Z
zhichan
Commit 42584e1c by 尹亚亭
Options

selftreg

parent 61b8bb81
Showing with 104 additions and 78 deletions
channel-access/src/views/pages/selftmreg/ConfirmOrder.vue
...@@ -11,6 +11,7 @@ ...@@ -11,6 +11,7 @@
</span> </span>
</h4> </h4>
</div> </div>
<!-- 商标信息 -->
<div class="brand-info"> <div class="brand-info">
<p> <p>
<strong>商标类型：</strong> <strong>商标类型：</strong>
...@@ -35,17 +36,7 @@ ...@@ -35,17 +36,7 @@
</p> </p>
<p> <p>
<strong>商标图样：</strong> <strong>商标图样：</strong>
<!-- <img
:src="
this.$parent.$parent.confirmStepsParams.stepOneThreeParams.type ==
1 &&
this.$parent.$parent.confirmStepsParams.stepOneThreeParams
.brandauto == true
? brandIconAuto
: brandIconManual
"
alt
/> -->
<img :src="brandIcon" alt /> <img :src="brandIcon" alt />
</p> </p>
<p> <p>
...@@ -75,6 +66,7 @@ ...@@ -75,6 +66,7 @@
</span> </span>
</h4> </h4>
</div> </div>
<!-- 申请人及联系人信息 -->
<div class="user-info"> <div class="user-info">
<ul> <ul>
<li> <li>
...@@ -203,6 +195,34 @@ ...@@ -203,6 +195,34 @@
</ul> </ul>
</div> </div>
<!-- 材料信息 -->
<div>
<div class="info-title">
<i class="selftmreg_shuxian"></i>
<h4>
材料信息&nbsp;&nbsp;&nbsp;<strong
>(可跳过进行下一步，支付完成后，在订单中上传即可)</strong
>
</h4>
</div>
<div class="show-imgs">
<ul>
<li>
<img
src="http://via.placeholder.com/100X120/f60/fff?text=hello"
alt=""
/><span>营业执照</span>
</li>
<li>
<img
src="http://via.placeholder.com/100X120/f60/fff?text=hello"
alt=""
/><span>营业执照</span>
</li>
</ul>
</div>
</div>
<div class="info-title"> <div class="info-title">
<i class="selftmreg_shuxian"></i> <i class="selftmreg_shuxian"></i>
<h4>订单备注</h4> <h4>订单备注</h4>
...@@ -219,18 +239,12 @@ ...@@ -219,18 +239,12 @@
<script> <script>
export default { export default {
props: ["msgFromParent"],
data() { data() {
return { return {
textarea: "", textarea: "",
// 商标展示 // 商标展示
brandIcon: "", brandIcon: ""
// 手动上传 或 上传 的商标
brandIconManual: "",
// 自动上传的商标
brandIconAuto: ""
}; };
}, },
methods: { methods: {
...@@ -248,11 +262,6 @@ export default { ...@@ -248,11 +262,6 @@ export default {
}, },
created() { created() {
// 获取缓存里面的商标图片地址 // 获取缓存里面的商标图片地址
let brandIconManual = localStorage.getItem("manualImgToConfirm");
this.brandIconManual = brandIconManual;
let brandIconAuto = localStorage.getItem("autoImgToConfirm");
this.brandIconAuto = brandIconAuto;
let brandIcon = localStorage.getItem("icon"); let brandIcon = localStorage.getItem("icon");
this.brandIcon = brandIcon; this.brandIcon = brandIcon;
} }
...@@ -276,6 +285,13 @@ export default { ...@@ -276,6 +285,13 @@ export default {
font-weight: 400; font-weight: 400;
color: rgba(83, 83, 83, 1); color: rgba(83, 83, 83, 1);
margin-bottom: 15px; margin-bottom: 15px;
strong {
margin-left: 35px;
font-size: 14px;
font-family: PingFangSC;
font-weight: 400;
color: rgba(99, 101, 105, 1);
}
} }
} }
// 编辑图文 // 编辑图文
...@@ -348,6 +364,28 @@ export default { ...@@ -348,6 +364,28 @@ export default {
} }
} }
// 材料信息
.show-imgs {
padding-left: 44px;
ul {
display: flex;
li {
display: inline-block;
margin-left: 15px;
width: 100px;
height: 140px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
span {
color: #636569;
font-size: 14px;
line-height: 20px;
}
}
}
}
// 订单备注 样式没加上！！ // 订单备注 样式没加上！！
.confirm div.el-textarea textarea.el-textarea__inner { .confirm div.el-textarea textarea.el-textarea__inner {
border-radius: 0; border-radius: 0;
......
channel-access/src/views/pages/selftmreg/Selftmreg.vue
...@@ -20,20 +20,17 @@ ...@@ -20,20 +20,17 @@
<el-form class="demo-ruleForm" label-width="120px"> <el-form class="demo-ruleForm" label-width="120px">
<div class="selftmreg_main"> <div class="selftmreg_main">
<div class="selftmreg_shu"></div> <div class="selftmreg_shu"></div>
<!-- 缓存第一步 填写基本信息 组件的内容 -->
<keep-alive> <keep-alive>
<!-- 缓存第一步 填写基本信息 组件的内容 --> <ModifyTrademark v-if="index == 0" />
<ModifyTrademark
v-if="index == 0"
:stepsParams="confirmStepsParams"
/>
</keep-alive> </keep-alive>
<!-- 缓存第二步 填写申请人信息 组件的内容 -->
<keep-alive> <keep-alive>
<!-- 缓存第二步 填写申请人信息 组件的内容 --> <ApplicationInfo v-if="index == 1" />
<ApplicationInfo
v-if="index == 1"
:stepsParams="confirmStepsParams"
/>
</keep-alive> </keep-alive>
<!-- 第三步 确认订单 --> <!-- 第三步 确认订单 -->
<ConfirmOrder v-if="index == 2" @getIndex="getindex" /> <ConfirmOrder v-if="index == 2" @getIndex="getindex" />
</div> </div>
...@@ -111,30 +108,21 @@ export default { ...@@ -111,30 +108,21 @@ export default {
return { return {
//初始为0，对应第一步填写基本信息 //初始为0，对应第一步填写基本信息
index: 0, index: 0,
// 是否已经勾选同意协议 // 商品/服务项目不足10项时 对话框 的显示和隐藏
dialogVisible: false,
// 是否已经勾选同意协议 勾选过才能去支付
checked: false, checked: false,
// 验证参数:步骤一二的必填项参数验证 // 验证参数:步骤一二的必填项参数验证
confirmStepsParams: { confirmStepsParams: {
stepOneThreeParams: { stepOneThreeParams: {
// 商标选择 // 商标选择
// 商标类型 type: 1, // 商标类型
type: 1, tname: "", // 商标名称
// 商标名称 icon: "", // 商标图样
tname: "",
// 商标图样
icon: "",
// 商标类型是文字时，对应的 手动上传 和 自动生成 按钮的点击状态
// 手动上传或是上传图片 是否点击
brandmanual: false,
// 自动生成图片 是否点击
brandauto: false,
// 分类选择 // 分类选择
// 选中的类别 xx xxxxx 对应 大类编号 大类名称 bigKind: "", // 选中的类别 xx xxxxx 对应 大类编号 大类名称
bigKind: "", smallKinds: [] // 已经选中的商品/服务项
// 已经选中的商品/服务项
smallKinds: []
}, },
stepTwoNineParams: { stepTwoNineParams: {
// 申请人类别 // 申请人类别
...@@ -154,15 +142,28 @@ export default { ...@@ -154,15 +142,28 @@ export default {
// 联系人类别 // 联系人类别
customer: "", customer: "",
telNum: "", telNum: "",
email: "" email: "",
}
},
// 商品/服务项目不足10项时 对话框 的显示和隐藏 // 材料信息
dialogVisible: false company: [
{ Icon: "", Text: "营业执照" },
{ Icon: "", Text: "代理委托书" },
{ Icon: "", Text: "优先权证明" }
],
user: [
{ Icon: "", Text: "营业执照" },
{ Icon: "", Text: "代理委托书" },
{ Icon: "", Text: "身份证明" },
{ Icon: "", Text: "优先权证明" }
]
}
}
}; };
}, },
created() {}, created() {
// 页面数据初始加载成功之后先清除之前的缓存的图片信息
localStorage.removeItem("icon");
},
methods: { methods: {
// 去支付页面 // 去支付页面
goCashier() { goCashier() {
...@@ -202,10 +203,11 @@ export default { ...@@ -202,10 +203,11 @@ export default {
// 获取a标签和i标签以给其加入高亮的样式 // 获取a标签和i标签以给其加入高亮的样式
let as = document.getElementsByTagName("a"); let as = document.getElementsByTagName("a");
let is = document.getElementsByTagName("i"); let is = document.getElementsByTagName("i");
// 有选择的非空的 自动上传图标 或 手动上传图标 的localStorage缓存数据
this.confirmStepsParams.stepOneThreeParams.icon = // 图标 的localStorage缓存数据是否为非空
localStorage.getItem("autoImgToConfirm") || this.confirmStepsParams.stepOneThreeParams.icon = localStorage.getItem(
localStorage.getItem("manualImgToConfirm"); "icon"
);
// 第二步 填写申请人信息 // 第二步 填写申请人信息
if (this.index == 1) { if (this.index == 1) {
...@@ -281,7 +283,7 @@ export default { ...@@ -281,7 +283,7 @@ export default {
// 如果商标名字 或 商标图样 为空 // 如果商标名字 或 商标图样 为空
if ( if (
this.confirmStepsParams.stepOneThreeParams.tname == "" || this.confirmStepsParams.stepOneThreeParams.tname == "" ||
this.confirmStepsParams.stepOneThreeParams.icon == null this.confirmStepsParams.stepOneThreeParams.icon == ""
) { ) {
// 提示完善信息 // 提示完善信息
this.$message({ this.$message({
...@@ -313,8 +315,8 @@ export default { ...@@ -313,8 +315,8 @@ export default {
} }
// 如果商标类型是 图形 // 如果商标类型是 图形
else if (this.confirmStepsParams.stepOneThreeParams.type == 2) { else if (this.confirmStepsParams.stepOneThreeParams.type == 2) {
// 如果商标图样为空 // 如果商标图样为空 null
if (this.confirmStepsParams.stepOneThreeParams.icon == null) { if (this.confirmStepsParams.stepOneThreeParams.icon == "") {
// 提示完善信息 // 提示完善信息
this.$message({ this.$message({
type: "warning", type: "warning",
...@@ -356,21 +358,7 @@ export default { ...@@ -356,21 +358,7 @@ export default {
this.index--; this.index--;
} }
}, },
mounted() { mounted() {}
localStorage.removeItem("icon");
// 页面初始挂载成功之后先清除之前的缓存的图片信息
localStorage.removeItem("manualImgToConfirm");
localStorage.removeItem("autoImgToConfirm");
// 手动上传或上传 按钮点击 参数更新
this.$bus.on("on-click-brandmanual", msg => {
this.confirmStepsParams.stepOneThreeParams.brandmanual = msg;
});
// 自动生成 按钮点击 参数更新
this.$bus.on("on-click-brandauto", msg => {
this.confirmStepsParams.stepOneThreeParams.brandauto = msg;
});
}
}; };
</script> </script>
......
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