feat: 境外条码信息查询【100%】

src/views/Search/external.vue

@@ -43,63 +43,20 @@
           <div class="result-box-title">查询 {{ searchCodeShow }} 结果</div>
           <div class="result-box-body">
             <template v-if="result">
-              <div class="title">商品信息</div>
-              <div v-if="result.product" class="product-info row">
-                <div class="left col-lg-8">
-                  <div
-                    class="row_"
-                    :key="item.key"
-                    v-for="item in productFields"
-                  >
-                    <div class="cell">
-                      {{ item.label }}
-                    </div>
-                    <div class="value">
-                      {{ result.product[item.key] }}
-                    </div>
-                  </div>
-                </div>
-                <div class="right col-lg-4"></div>
-              </div>
-              <div v-else class="product-info row">
-                <div class="left col-lg-8">
-                  <div class="row_">
-                    <div class="cell">商品条码</div>
-                    <div class="value">
-                      {{ searchCodeShow }}
-                    </div>
-                  </div>
-                </div>
-                <p
-                  style="
-                    font-size: 14px;
-                    font-weight: 400;
-                    color: #f26335;
-                    line-height: 22px;
-                    text-align: center;
-                    margin-bottom: 29px;
-                    margin-top: 14px;
-                  "
-                >
-                  该进口商品的中文信息尚未通报，进口商品经营企业可查看《进口商品数据通报操作指南》
-                  （http://import.gds.org.cn/Content/staticpage/operateGuide.html）进行通报。
-                </p>
-              </div>
-              <div class="title">企业信息</div>
               <div class="company-info">
                 <el-table
-                  :data="result.companyInfo"
+                  :data="result"
                   header-cell-class-name="search-table-hc"
                   style="width: 100%"
                 >
-                  <el-table-column prop="brand" label="国际品牌商">
-                  </el-table-column>
-                  <el-table-column prop="address" label="国际品牌商地址">
-                  </el-table-column>
+                  <el-table-column prop="address.name" label="企业名称"></el-table-column>
+                  <el-table-column prop="gepirRequestedKey.requestedKeyValue" label="GTIN"></el-table-column>
+                  <el-table-column prop="address.streetAddressOne" label="地址"></el-table-column>
+                  <el-table-column prop="address.city" label="城市"></el-table-column>
                 </el-table>
               </div>
             </template>
-            <span v-else>您输入的商品条码格式不正确，请确认后重试。</span>
+            <span style="color: rgb(255, 59, 48)" v-else>{{ errorMsg }}</span>
           </div>
         </div>
       </div>
@@ -119,94 +76,40 @@
 </template>
 
 <script>
-import { getUUID } from "@/utils/utils";
+import validation from "@/views/Search/validation";
 
 export default {
+  mixins: [validation],
   data() {
     return {
-      captchaPath: "",
-      search: { code: "", captcha: "", uuid: "" },
+      search: { code: "" },
       searchCodeShow: "",
       showResult: false,
       result: null,
-      productFields: [
-        {
-          key: "id",
-          label: "商品条码：",
-        },
-        {
-          key: "name",
-          label: "产品名称：",
-        },
-        {
-          key: "brand",
-          label: "品牌：",
-        },
-        {
-          key: "classify",
-          label: "产品分类：",
-        },
-        {
-          key: "standard",
-          label: "规格：",
-        },
-        {
-          key: "netContent",
-          label: "净含量：",
-        },
-        {
-          key: "origin",
-          label: "产地：",
-        },
-      ],
     };
   },
-  created() {
-    this.getCaptcha();
-  },
   methods: {
-    // 获取验证码
-    getCaptcha() {
-      this.search.uuid = getUUID();
-      const query = {
-        uuid: this.search.uuid,
-      };
-      this.$api.getCaptcha(query).then((res) => {
-        console.log(res, 'res');
-        this.captchaPath = window.URL.createObjectURL(res.body);
-      });
-    },
-    handleSearch() {
+   async handleSearch() {
       this.searchCodeShow = this.search.code;
       this.showResult = true;
-      if (this.search.code === "1") {
-        this.result = {
-          product: {
-            id: "1",
-            name: "法国梦巴黎圣萨蒂黑歌海娜红",
-            brand: "法国梦巴黎",
-            classify: "利口酒",
-            standard: "750ML",
-            netContent: "750毫升",
-            origin: "法国",
-          },
-          companyInfo: [
-            { brand: "CAVES LANGUEDOC ROUSILLON", address: "ZAC MILLENAIRE" },
-          ],
-        };
-      } else if (this.search.code === "2") {
-        this.result = {
-          companyInfo: [
-            { brand: "CAVES LANGUEDOC ROUSILLON", address: "ZAC MILLENAIRE" },
-          ],
+      const params = {
+        "code": this.search.code,
+        "type": "GTIN",
+        "requestedLanguage":"en",
+        "captcha":this.captcha,
+        "uuid":this.uuid
       };
+      const searchGlnRes = await this.$api.search.searchGln(params);
+      const { returnCode, data } = searchGlnRes;
+      if (returnCode === "0") {
+        this.result = [data];
       } else {
+        this.errorMsg =
+            searchGlnRes.returnMsg ||
+            "您输入的商品条码格式不正确，请确认后重试。";
         this.result = null;
       }
     },
-    openUrl(url) {
-      window.open(url)
-    }
   },
 };
 </script>