diff --git a/components/customerHeader/customerHeader.css b/components/customerHeader/customerHeader.css new file mode 100644 index 0000000..715bf68 --- /dev/null +++ b/components/customerHeader/customerHeader.css @@ -0,0 +1,61 @@ +.approve--container { + margin-bottom: 160px; +} +.approve-info-container { + position: fixed; + top: 0; + width: 100%; + z-index: 3; + background-color: #fff; + height: 155px; +} + +.approve-info-container .info-header { + padding: 10px 0; +} + +.approve-info-container .title { + font-size: 18px; + font-weight: bold; + color: #333333; + margin-bottom: 10px; + margin-left: 24px; +} + +.approve-info-container .contact-info, +.approve-info-container .id-info, +.approve-info-container .id-number { + font-size: 14px; + color: #666666; + margin-bottom: 10px; + margin-left: 24px; +} +.warp-tags { + margin-top: 26px; + overflow: auto; +} +.approve-info-container .tags { + width: 1000px; +} + +.approve-info-container .tag-item { + padding: 4px 10px; + background-color: #e6f3ff; + color: #0066cc; + border-radius: 4px; + font-size: 14px; + display: inline-block; + margin-left: 10px; +} +.approve-info-container .status-seal { + position: absolute; + top: 0; + right: 0; + z-index: 4; + width: 80px; + height: 80px; + padding: 16px 16px 0 0; +} +.approve-info-container .status-seal img { + width: 100%; +} \ No newline at end of file diff --git a/components/customerHeader/customerHeader.js b/components/customerHeader/customerHeader.js new file mode 100644 index 0000000..bed88c5 --- /dev/null +++ b/components/customerHeader/customerHeader.js @@ -0,0 +1,55 @@ +Vue.component('customer-header', { + template: ` +
+
+ +
+
{{ this.cusinfo.partyName }}
+
+ 联系电话： + {{ this.cusinfo.mobileNo }} +
+
+ 证件号码： + {{ this.cusinfo.certNo }} +
+ +
+
+
+ {{ tag }} +
+
+
+ +
+ + + + + +
+
+
+
+ `, + props: ['cusinfo', 'tags', 'statusText'], // html接收字段名都是小写，单向传递 + data() { + return { + imgUrl: '', + formRenderData: null, + // applicantName: '李壮壮', + // contactPhone: '15021216363', + // idType: '身份证', + // idNumber: '130123199212301123', + // tags: ['未婚男性', '农户', '国家公务员', '文盲或半文盲', '免税', '稻谷种植', '其他'], + activeTab: 'acceptance' + } + }, + created(){ + console.log('---cusinfo-', this.statusText) + }, + methods: { // 组件内方法 + + } +}) diff --git a/index.html b/index.html index 2bed8c3..22741a5 100644 --- a/index.html +++ b/index.html @@ -9,6 +9,7 @@ Document +