hdk / hdk-web-query-service

Download as
Browse Code »

Commit ef2eeb98929c5fa7ba3bc0e5962db89ade377f70

Authored by 郭伟龙
1 parent da785871
Exists in develop

fix: logo图更换高清 

响应式按钮大小过渡调整
产品信息隐藏生产人和生成时间字段
扫码增加声音和震动
切换tab调整
正则表达式更换，ios低版本不支持零宽度正向断言
Showing 11 changed files with 217 additions and 58 deletions   Show diff stats
pages/component/InformationModule.vue
  Diff comments   View file @ef2eeb9
... ... @@ -21,14 +21,15 @@
21 21 <text class="leftT">{{$t('hdk.Model')}}</text>
22 22 <text class="rightT">{{informationData.type || ""}}</text>
23 23 </view>
24   - <view class="flex-between">
  24 + <!-- 不展示 -->
  25 + <!-- <view class="flex-between">
25 26 <text class="leftT">{{$t('hdk.DateOfProduction')}}</text>
26 27 <text class="rightT">{{$u.timeFormat(informationData.productionTime, 'yyyy-mm-dd') || ""}}</text>
27 28 </view>
28 29 <view class="flex-between">
29 30 <text class="leftT">{{$t('hdk.ProductionPersonnel')}}</text>
30 31 <text class="rightT">{{informationData.productionUserName || ""}}</text>
31   - </view>
  32 + </view> -->
32 33 </view>
33 34 <view class="fileViewingModule">
34 35 <view class="title">
... ... @@ -102,7 +103,9 @@
102 103 }
103 104  
104 105 .swiperCss {
  106 + margin-top: 20px;
105 107 width: 95%;
  108 + height: 200px !important;
106 109 }
107 110  
108 111 .flex-between {
... ... @@ -147,6 +150,8 @@
147 150  
148 151 .swiperCss {
149 152 width: 80%;
  153 + margin-top: 20px;
  154 + height: 600px !important;
150 155 }
151 156  
152 157 .flex-between {
... ...
pages/component/InspectionModule.vue
  Diff comments   View file @ef2eeb9
... ... @@ -17,7 +17,7 @@
17 17 </view>
18 18 <view class="flex-between">
19 19 <text class="leftT">{{$t('hdk.TestDate')}}</text>
20   - <text class="rightT">{{$u.timeFormat(inspectionData.checkTime, 'yyyy年mm月dd日') || ''}}</text>
  20 + <text class="rightT">{{$u.timeFormat(inspectionData.checkTime, 'yyyy-mm-dd') || ''}}</text>
21 21 </view>
22 22 </view>
23 23  
... ...
pages/component/QrScan.vue
  Diff comments   View file @ef2eeb9
... ... @@ -9,8 +9,11 @@
9 9 import {
10 10 Html5Qrcode
11 11 } from 'html5-qrcode';
  12 + const innerAudioContext = uni.createInnerAudioContext();
  13 + innerAudioContext.autoplay = true;
  14 + innerAudioContext.src = '/static/audio/scanSound.mp3';
12 15 export default {
13   - created() {
  16 + mounted() {
14 17 this.getCameras();
15 18 navigator.mediaDevices.getUserMedia({
16 19 video: true
... ... @@ -43,6 +46,7 @@
43 46 });
44 47 },
45 48 start() {
  49 + let that = this;
46 50 //environment后置 user前置
47 51 this.html5QrCode
48 52 .start({
... ... @@ -57,13 +61,24 @@
57 61 halfSample: true, //缩小二维码提高识别精度吧
58 62 },
59 63 (decodedText) => {
60   - this.$emit('ok', decodedText);
  64 + this.playAudio();
  65 + navigator.vibrate(500);
  66 + setTimeout(()=>{
  67 + that.$emit('ok', decodedText);
  68 + this.stop();
  69 + },500)
61 70 },
62 71 )
63 72 .catch((err) => {
64 73 this.$emit('err', err);
65 74 });
66 75 },
  76 + playAudio() {
  77 + innerAudioContext.play();
  78 + innerAudioContext.onPlay(() => {
  79 + console.log('音频开始播放');
  80 + });
  81 + },
67 82 stop() {
68 83 this.html5QrCode
69 84 .stop()
... ... @@ -88,7 +103,7 @@
88 103 height: 100%;
89 104 width: 100%;
90 105 // background: rgba($color: #000000, $alpha: 0.48);
91   - background:rgba(0, 0, 0, 1.48);
  106 + background: rgba(0, 0, 0, 1.48);
92 107 }
93 108  
94 109  
... ...
pages/component/goback.vue
  Diff comments   View file @ef2eeb9
1 1 <template>
2 2 <view class="back" @click="goback" v-if="!$isMobile">
3   - <u-image src="/static/images/icon/back.png" mode="witFix" width="100px" height="100px"></u-image>
  3 + <u-image src="/static/images/icon/back.png" mode="witFix" class="ImageCss"></u-image>
4 4 </view>
5 5 </template>
6 6  
... ... @@ -34,6 +34,18 @@
34 34 </script>
35 35  
36 36 <style lang="scss" scoped>
  37 + /deep/.u-image__image{
  38 + width: 50px !important;
  39 + height: 50px !important;
  40 + }
  41 + /deep/.u-image{
  42 + width: 0 !important;
  43 + height: 0 !important;
  44 + }
  45 + .ImageCss{
  46 + width: 50px !important;
  47 + height: 50px !important;
  48 + }
37 49 .back {
38 50 width: 50px;
39 51 height: 50px;
... ... @@ -43,7 +55,7 @@
43 55 flex-direction: column;
44 56 justify-content: center;
45 57 align-items: center;
46   - left:1%;
  58 + left:10px;
47 59 top: 10%;
48 60 bottom: 0;
49 61 }
... ...
pages/component/topWindow.vue
  Diff comments   View file @ef2eeb9
... ... @@ -7,16 +7,16 @@
7 7 <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
8 8 <b-collapse id="nav-collapse" is-nav class="collapseR">
9 9 <b-navbar-nav>
10   - <b-nav-item v-show="!isHome" @click="handleClick('productInformation')"
11   - :class="{ 'activeCSS': selectedNavItem === 'productInformation' }">
  10 + <b-nav-item v-show="!isHome && !$isMobile" @click="handleClick(0)"
  11 + :class="{ 'activeCSS': selectedNavItem === 0 }">
12 12 {{$t('hdk.productInformation')}}
13 13 </b-nav-item>
14   - <b-nav-item v-show="!isHome" @click="handleClick('inspectionInformation')"
15   - :class="{ 'activeCSS': selectedNavItem === 'inspectionInformation' }">
  14 + <b-nav-item v-show="!isHome && !$isMobile" @click="handleClick(1)"
  15 + :class="{ 'activeCSS': selectedNavItem === 1 }">
16 16 {{$t('hdk.inspectionInformation')}}
17 17 </b-nav-item>
18   - <b-nav-item v-show="!isHome" @click="handleClick('attachmentInformation')"
19   - :class="{ 'activeCSS': selectedNavItem === 'attachmentInformation' }">
  18 + <b-nav-item v-show="!isHome && !$isMobile" @click="handleClick(2)"
  19 + :class="{ 'activeCSS': selectedNavItem === 2 }">
20 20 {{$t('hdk.attachmentInformation')}}
21 21 </b-nav-item>
22 22 <b-nav-item-dropdown :text="selectedLanguage" right>
... ... @@ -41,7 +41,7 @@
41 41 data() {
42 42 return {
43 43 selectedLanguage: this.$t('index.language'),
44   - selectedNavItem: 'productInformation'
  44 + selectedNavItem: 0
45 45 }
46 46 },
47 47 props: {
... ...
pages/homePage/index.vue
  Diff comments   View file @ef2eeb9
... ... @@ -110,12 +110,12 @@
110 110 },
111 111 methods: {
112 112 getFirstSnFromUrl(url) {
113   - // const regex = /sn=([^&]+)/;
114   - const regex = /((?<=\?sn=)|(?<=HDKSN:))\w+/;
  113 + // const regex = /((?<=\?sn=)|(?<=HDKSN:))\w+/;「零宽度正向断言」ios低版本不支持
  114 + const regex = /(?:\?sn=|HDKSN:)(\w+)/;
115 115 const match = url.match(regex);
116 116 console.log(match)
117 117 if (match && match.length > 1) {
118   - const sn = match[0];
  118 + const sn = match[1];
119 119 return sn;
120 120 }
121 121 return url;
... ...
pages/product/index.vue
  Diff comments   View file @ef2eeb9
1 1 <template>
2 2 <view class="containers">
3   - <topWindow :isHome="false" @item-click="handleItemClick"></topWindow>
  3 + <topWindow :isHome="false" @item-click="handleItemClick" @lanChange="changeLan"></topWindow>
4 4 <goback></goback>
  5 + <u-tabs :list="list" :current="current" lineColor="#00aeaa"
  6 + :itemStyle="{width:'200px',height:'40px',backgraound:'#000'}" @click="tabChange" v-show="$isMobile"
  7 + :activeStyle="activeStyle" :inactiveStyle="inactiveStyle"></u-tabs>
5 8 <view class="ComponentsBody">
6   - <view class="productInformation" v-if="current == 'productInformation'">
  9 + <view class="productInformation" v-if="current == 0">
7 10 <InformationModule v-if="informationData != null" :informationData="informationData">
8 11 </InformationModule>
9 12 </view>
10   - <view class="inspectionInformation" v-else-if="current == 'inspectionInformation'">
  13 + <view class="inspectionInformation" v-else-if="current == 1">
11 14 <InspectionModule v-if="inspectionData != null" :inspectionData="inspectionData"></InspectionModule>
12 15 </view>
13   - <view class="attachmentInformation" v-else-if="current == 'attachmentInformation'">
  16 + <view class="attachmentInformation" v-else-if="current == 2">
14 17 <AuxiliaryModule v-if="auxiliaryData != null" :auxiliaryData="auxiliaryData"></AuxiliaryModule>
15 18 </view>
16 19 <view class="repairReportBtnCss" @click="jumpService">
17   - <u-image src="/static/images/icon/repair.png" mode="witFix" :width="$isMobile?'100px':'200px'"
18   - :height="$isMobile?'100px':'200px'"></u-image>
  20 + <image src="/static/images/icon/repair.png" class="repairReportImageCss" mode="witFix" ></u-image>
19 21 <text class="repairReportTextCss">{{$t("hdk.Repair")}}</text>
20 22 </view>
21 23 </view>
... ... @@ -49,7 +51,37 @@
49 51 inspectionData: null,
50 52 auxiliaryData: null,
51 53 repairInformation: null,
52   - current: "productInformation"
  54 + // current: "productInformation",
  55 + current: 0,
  56 + list: [{
  57 + name: this.$t('hdk.productInformation'),
  58 + }, {
  59 + name: this.$t('hdk.inspectionInformation'),
  60 + }, {
  61 + name: this.$t('hdk.attachmentInformation')
  62 + }],
  63 + inactiveStyle: {
  64 + width: '120rpx',
  65 + height: '38rpx',
  66 + backgroundColor: 'rgba(255, 255, 255, 0)',
  67 + boxSizing: 'border-box',
  68 + fontFamily: "苹方 中等, 苹方, sans-serif",
  69 + color: '#555555',
  70 + textAlign: 'left',
  71 + lineHeight: 'normal',
  72 + fontSize: '28rpx'
  73 + },
  74 + activeStyle: {
  75 + width: '128rpx',
  76 + height: '43rpx',
  77 + backgroundColor: 'rgba(255, 255, 255, 0)',
  78 + boxSizing: 'border-box',
  79 + fontFamily: "苹方 中等, 苹方, sans-serif",
  80 + color: '#00aeaa',
  81 + textAlign: 'left',
  82 + lineHeight: 'normal',
  83 + fontSize: '32rpx'
  84 + },
53 85 }
54 86 },
55 87 computed: {
... ... @@ -63,6 +95,18 @@
63 95 this.initData()
64 96 },
65 97 methods: {
  98 + changeLan(lang) {
  99 + console.log("改变语言", lang);
  100 + this.list = [];
  101 + // 重新构建新的 list 数组
  102 + this.list = [{
  103 + name: this.$t('hdk.productInformation'),
  104 + }, {
  105 + name: this.$t('hdk.inspectionInformation'),
  106 + }, {
  107 + name: this.$t('hdk.attachmentInformation')
  108 + }];
  109 + },
66 110 initData() {
67 111 // uni.showLoading({title: '查询中...'})
68 112 getProductFind(this.sn).then(res => {
... ... @@ -246,6 +290,16 @@
246 290 const pictureRegex = /\.(jpg|jpeg|png|gif)$/i;
247 291 return pictureRegex.test(str);
248 292 },
  293 + tabChange(item) {
  294 + this.current = item.index
  295 + if (this.current == 0) {
  296 + // console.log(this.informationData);
  297 + } else if (this.current == 1) {
  298 + // console.log(this.inspectionData);
  299 + } else {
  300 + // console.log(this.auxiliaryData);
  301 + }
  302 + },
249 303 handleItemClick(item) {
250 304 this.current = item;
251 305 console.log('点击的菜单项:', item);
... ... @@ -263,6 +317,7 @@
263 317 }
264 318  
265 319 .ComponentsBody {
  320 + margin-top: 5px;
266 321 // width:100%;
267 322 // display: flex;
268 323 // justify-content: center;
... ... @@ -280,7 +335,8 @@
280 335 // .attachmentInformation{
281 336 // width: 100%;
282 337 // }
283   -
  338 +
  339 + //移动端样式
284 340 @media screen and (max-width: 767px) {
285 341 .repairReportBtnCss {
286 342 width: 100px;
... ... @@ -295,6 +351,18 @@
295 351 bottom: 100px;
296 352 // background-color: #00aeaa;
297 353 }
  354 +
  355 +
  356 +
  357 + // .u-image__image{
  358 + // width: 100px !important;
  359 + // height: 100px !important;
  360 + // }
  361 +
  362 + .repairReportImageCss{
  363 + width: 100px !important;
  364 + height: 100px !important;
  365 + }
298 366  
299 367 .repairReportTextCss {
300 368 position: absolute;
... ... @@ -309,9 +377,8 @@
309 377 // //PC端样式
310 378 @media screen and (min-width: 768px) {
311 379 .repairReportBtnCss {
312   - width: 100px;
313   - height: 100px;
314   - border-radius: 100px;
  380 + width: 200px;
  381 + height: 200px;
315 382 position: fixed;
316 383 display: flex;
317 384 flex-direction: column;
... ... @@ -322,9 +389,19 @@
322 389 // background-color: #00aeaa;
323 390 }
324 391  
  392 + // .u-image__image{
  393 + // width: 200px !important;
  394 + // }
  395 +
  396 +
  397 + .repairReportImageCss{
  398 + width: 200px !important;
  399 + height: 200px !important;
  400 + }
  401 +
325 402 .repairReportTextCss {
326 403 position: absolute;
327   - bottom: 15px;
  404 + bottom: 60px;
328 405 color: #fff;
329 406 }
330 407  
... ...
pages/product/repairReport.vue
  Diff comments   View file @ef2eeb9
... ... @@ -2,7 +2,7 @@
2 2 <view class="containers">
3 3 <topWindow @lanChange="changeLan"></topWindow>
4 4 <goback></goback>
5   - <view class="content">
  5 + <view class="contents">
6 6 <u-form labelPosition="top" labelAlign="left" :model="modal" :rules="rules" ref="uForm"
7 7 :labelStyle="{fonSize:'26px',color:'#8B91A4',paddingLeft:'10px'}">
8 8 <view class="basicInformation">
... ... @@ -169,16 +169,52 @@
169 169 }
170 170 },
171 171 methods: {
  172 + setRules() {
  173 + this.rules = {
  174 + 'formInfo.sn': {
  175 + type: 'string',
  176 + required: true,
  177 + message: this.$t('hdk.FillSNCode'),
  178 + trigger: ['blur', 'change']
  179 + },
  180 + 'formInfo.productName': {
  181 + type: 'string',
  182 + required: true,
  183 + message: this.$t('hdk.FillProductName'),
  184 + trigger: ['blur', 'change']
  185 + },
  186 + 'formInfo.contactPersonName': {
  187 + type: 'string',
  188 + required: true,
  189 + message: this.$t('hdk.FillName'),
  190 + trigger: ['blur', 'change']
  191 + },
  192 + 'formInfo.email': {
  193 + type: 'email',
  194 + required: true,
  195 + message: this.$t('hdk.FillEmail'),
  196 + trigger: ['blur', 'change']
  197 + },
  198 + 'formInfo.repairDescribe': {
  199 + type: 'string',
  200 + required: true,
  201 + message: this.$t('hdk.FillDescription'),
  202 + trigger: ['blur', 'change']
  203 + },
  204 + 'formInfo.airportName': {
  205 + type: 'string',
  206 + required: true,
  207 + message: this.$t('hdk.FillAirportName'),
  208 + trigger: ['blur', 'change']
  209 + },
  210 + }
  211 + },
172 212 changeLan(locale) {
173 213 console.log("切换语言,重新触发提示语", locale);
174 214 // 清除校验状态
175 215 this.$refs.uForm.clearValidate();
176 216 // 重新校验
177   - this.$forceUpdate()
178   - this.$nextTick(() => {
179   - this.$refs.uForm.validate();
180   - });
181   -
  217 + this.setRules();
182 218 },
183 219 deletePic(event) {
184 220 this.fileList.splice(event.index, 1)
... ... @@ -350,7 +386,7 @@
350 386 text-align: left;
351 387 }
352 388  
353   - .content {
  389 + .contents {
354 390 width: 100%;
355 391 }
356 392  
... ... @@ -374,20 +410,19 @@
374 410 }
375 411  
376 412 .submitBtn {
377   - width: 350px;
  413 + width: 90%;
378 414 height: 40px;
379   - padding: 2px;
380   - margin: 24px;
  415 + margin: 20px 24px;
381 416 position: fixed;
382   - bottom: 0px;
  417 + bottom: 0;
383 418 display: flex;
384 419 justify-content: center;
385 420 align-items: center;
386 421 border-radius: 8px;
387 422 background-color: #00aeaa;
388 423 box-sizing: border-box;
389   - font-family: '苹方 中等', '苹方', sans-serif;
390   - color: #ffffff;
  424 + font-family: 苹方 中等, 苹方, sans-serif;
  425 + color: #fff;
391 426 text-align: center;
392 427 line-height: normal;
393 428 z-index: 999;
... ... @@ -417,7 +452,7 @@
417 452 color: #999999;
418 453 }
419 454  
420   - .content {
  455 + .contents {
421 456 width: 80%;
422 457 position: relative;
423 458 }
... ... @@ -463,22 +498,19 @@
463 498 }
464 499  
465 500 .submitBtn {
466   - width: 500px;
467   - height: 39px;
468   - padding: 2px;
  501 + width: 80%;
  502 + height: 40px;
  503 + margin: 20px 24px;
469 504 position: fixed;
470   - left: 0;
471   - right: 0;
472   - bottom: 30px;
473   - margin: 0 auto;
  505 + bottom: 0;
474 506 display: flex;
475 507 justify-content: center;
476 508 align-items: center;
477   - border-radius: 4px;
  509 + border-radius: 8px;
478 510 background-color: #00aeaa;
479 511 box-sizing: border-box;
480   - font-family: '苹方 中等', '苹方', sans-serif;
481   - color: #ffffff;
  512 + font-family: 苹方 中等, 苹方, sans-serif;
  513 + color: #fff;
482 514 text-align: center;
483 515 line-height: normal;
484 516 z-index: 999;
... ...
pages/product/scan.vue
  Diff comments   View file @ef2eeb9
... ... @@ -40,6 +40,9 @@
40 40 computed: {
41 41  
42 42 },
  43 + onShow() {
  44 + this.open = true
  45 + },
43 46 mounted() {
44 47 if (browser.versions.webKit || browser.versions.weixin || browser.versions.gecko) {
45 48 this.open = true;
... ... @@ -51,25 +54,40 @@
51 54  
52 55 },
53 56 methods: {
  57 + playAudio() {
  58 + const innerAudioContext = uni.createInnerAudioContext();
  59 + innerAudioContext.autoplay = true;
  60 + innerAudioContext.src = '/static/audio/scanSound.mp3';
  61 + innerAudioContext.play();
  62 + innerAudioContext.onPlay(() => {
  63 + alert('音频开始播放')
  64 + console.log('音频开始播放');
  65 + });
  66 + },
54 67 getResult(sn) {
55 68 console.log(sn);
  69 + // this.playAudio()
56 70 this.open = false;
57   - const regex = /((?<=\?sn=)|(?<=HDKSN:))\w+/;
  71 + // const regex = /((?<=\?sn=)|(?<=HDKSN:))\w+/;「零宽度正向断言」ios低版本不支持
  72 + const regex = /(?:\?sn=|HDKSN:)(\w+)/;
58 73 const match = regex.exec(sn);
59   - const sncode = match ? match[0] : sn;
  74 + const sncode = match ? match[1] : sn;
60 75 // let sncode = sn.substring(sn.lastIndexOf(":") + 1);
61 76 getProductFind(sncode).then(res => {
62 77 console.log(res);
63 78 if (res.code === 1400001001) {
64 79 uni.navigateTo({
65   - url: '/pages/product/invalidCode?snCode='+sncode,
  80 + url: '/pages/product/invalidCode?snCode=' + sncode,
66 81 success() {
67 82 this.open = true
68 83 }
69 84 });
70 85 } else {
71 86 uni.navigateTo({
72   - url: "/pages/product/index?sn=" + sncode
  87 + url: "/pages/product/index?sn=" + sncode,
  88 + success() {
  89 + this.open = true
  90 + }
73 91 })
74 92 }
75 93 })
... ...
static/hdk-top-logo.png
View file @ef2eeb9

1.29 KB | W: | H:

3.75 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
static/logo.png
View file @ef2eeb9

1.83 KB | W: | H:

4.31 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin