From 27f3d53ca625c736c84c50d6a356ce0496e3df01 Mon Sep 17 00:00:00 2001
From: flisowna <ewa.agnieszka.flis@gmail.com>
Date: Wed, 21 Dec 2022 13:44:02 +0100
Subject: [PATCH] adjust to PR comments

---
 .../smartsheet/column/BarcodeOptions.vue      | 24 ++++++++++++-------
 .../virtual-cell/barcode/JsBarcodeWrapper.vue | 10 +++-----
 .../v2/nc_023_barcode_column_type.ts          |  1 -
 .../nocodb/src/lib/models/BarcodeColumn.ts    |  3 +--
 4 files changed, 20 insertions(+), 18 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet/column/BarcodeOptions.vue b/packages/nc-gui/components/smartsheet/column/BarcodeOptions.vue
index 79de2228de..95ea238db3 100644
--- a/packages/nc-gui/components/smartsheet/column/BarcodeOptions.vue
+++ b/packages/nc-gui/components/smartsheet/column/BarcodeOptions.vue
@@ -2,7 +2,7 @@
 import type { UITypes } from 'nocodb-sdk'
 import { AllowedColumnTypesForQrAndBarcodes } from 'nocodb-sdk'
 import type { SelectProps } from 'ant-design-vue'
-import { useVModel } from '#imports'
+import { onMounted, useVModel, watch } from '#imports'
 
 const props = defineProps<{
   modelValue: any
@@ -22,7 +22,7 @@ const vModel = useVModel(props, 'modelValue', emit)
 
 const { setAdditionalValidations, validateInfos, column } = useColumnCreateStoreOrThrow()
 
-const columnsAllowedAsQrValue = computed<SelectProps['options']>(() => {
+const columnsAllowedAsBarcodeValue = computed<SelectProps['options']>(() => {
   return fields.value
     ?.filter(
       (el) =>
@@ -52,7 +52,18 @@ const supportedBarcodeFormats = [
 
 onMounted(() => {
   // set default value
-  vModel.value.fk_barcode_value_column_id = (column?.value?.colOptions as Record<string, any>)?.fk_barcode_value_column_id || ''
+  vModel.value.meta = {
+    barcodeFormat: supportedBarcodeFormats[0].value,
+    ...vModel.value.meta,
+  }
+  vModel.value.fk_barcode_value_column_id =
+    (column?.value?.colOptions as Record<string, any>)?.fk_barcode_value_column_id || columnsAllowedAsBarcodeValue.value?.[0]
+})
+
+watch(columnsAllowedAsBarcodeValue, (newColumnsAllowedAsBarcodeValue) => {
+  if (vModel.value.fk_barcode_value_column_id == null) {
+    vModel.value.fk_barcode_value_column_id = newColumnsAllowedAsBarcodeValue?.[0].value
+  }
 })
 
 setAdditionalValidations({
@@ -61,10 +72,6 @@ setAdditionalValidations({
 })
 
 // set default meta value
-vModel.value.meta = {
-  barcodeFormat: supportedBarcodeFormats[0].value,
-  ...vModel.value.meta,
-}
 </script>
 
 <template>
@@ -77,8 +84,9 @@ vModel.value.meta = {
       >
         <a-select
           v-model:value="vModel.fk_barcode_value_column_id"
-          :options="columnsAllowedAsQrValue"
+          :options="columnsAllowedAsBarcodeValue"
           placeholder="Select a column for the Barcode value"
+          not-found-content="No valid Column Type can be found. The valid Column Types are: Number, Single Line Text, Long Text, Phone Number, URL, Email, Decimal. Please create one first."
           @click.stop
         />
       </a-form-item>
diff --git a/packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue b/packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue
index b1dd8924d2..f52df105e8 100644
--- a/packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue
+++ b/packages/nc-gui/components/virtual-cell/barcode/JsBarcodeWrapper.vue
@@ -5,9 +5,11 @@ const props = defineProps({
   barcodeValue: { type: String, required: true },
   barcodeFormat: { type: String, required: true },
 })
+
 const emit = defineEmits(['onClickBarcode'])
 const barcodeSvgRef = ref(null)
 const errorForCurrentInput = ref(false)
+
 const generate = () => {
   try {
     JsBarcode(barcodeSvgRef.value, String(props.barcodeValue), {
@@ -31,12 +33,6 @@ onMounted(generate)
 </script>
 
 <template>
-  <svg data-testid="barcode" v-show="!errorForCurrentInput" ref="barcodeSvgRef" @click="onBarcodeClick"></svg>
+  <svg class="w-full" data-testid="barcode" v-show="!errorForCurrentInput" ref="barcodeSvgRef" @click="onBarcodeClick"></svg>
   <slot v-if="errorForCurrentInput" name="barcodeRenderError" />
 </template>
-
-<style scoped>
-svg {
-  width: 100%;
-}
-</style>
diff --git a/packages/nocodb/src/lib/migrations/v2/nc_023_barcode_column_type.ts b/packages/nocodb/src/lib/migrations/v2/nc_023_barcode_column_type.ts
index f6c153ba8c..7f721bea5a 100644
--- a/packages/nocodb/src/lib/migrations/v2/nc_023_barcode_column_type.ts
+++ b/packages/nocodb/src/lib/migrations/v2/nc_023_barcode_column_type.ts
@@ -15,7 +15,6 @@ const up = async (knex: Knex) => {
 
     table.string('barcode_format', 15);
     table.boolean('deleted');
-    table.float('order');
     table.timestamps(true, true);
   });
 };
diff --git a/packages/nocodb/src/lib/models/BarcodeColumn.ts b/packages/nocodb/src/lib/models/BarcodeColumn.ts
index 60c4d6bd02..6f274f3f86 100644
--- a/packages/nocodb/src/lib/models/BarcodeColumn.ts
+++ b/packages/nocodb/src/lib/models/BarcodeColumn.ts
@@ -4,6 +4,7 @@ import NocoCache from '../cache/NocoCache';
 import { extractProps } from '../meta/helpers/extractProps';
 
 export default class BarcodeColumn {
+  id: string;
   fk_column_id: string;
   fk_barcode_value_column_id: string;
   barcode_format: string;
@@ -44,8 +45,6 @@ export default class BarcodeColumn {
     return column ? new BarcodeColumn(column) : null;
   }
 
-  id: string;
-
   static async update(
     id: string,
     barcode: Partial<BarcodeColumn>,