fix(nc-gui): grayed out shared form field if prefilled fields are locked

packages/nc-gui/components/cell/MultiSelect.vue

@@ -394,7 +394,7 @@ const onFocus = () => {
     @click="toggleMenu"
   >
     <div v-if="!isEditColumn && isForm && parseProp(column.meta)?.isList" class="w-full max-w-full">
-      <a-checkbox-group v-model:value="vModel" class="nc-field-layout-list">
+      <a-checkbox-group v-model:value="vModel" :disabled="readOnly || !editAllowed" class="nc-field-layout-list">
         <a-checkbox
           v-for="op of options"
           :key="op.title"

packages/nc-gui/components/cell/SingleSelect.vue

@@ -315,7 +315,7 @@ const onFocus = () => {
     @keydown.enter.stop.prevent="toggleMenu"
   >
     <div v-if="!isEditColumn && isForm && parseProp(column.meta)?.isList" class="w-full max-w-full">
-      <a-radio-group v-model:value="vModel" class="nc-field-layout-list">
+      <a-radio-group v-model:value="vModel" :disabled="readOnly || !editAllowed" class="nc-field-layout-list">
         <a-radio
           v-for="op of options"
           :key="op.title"

packages/nc-gui/components/cell/User.vue

@@ -323,6 +323,7 @@ const filterOption = (input: string, option: any) => {
       <component
         :is="isMultiple ? CheckboxGroup : RadioGroup"
         v-model:value="vModelListLayout"
+        :disabled="readOnly || !editAllowed"
         class="nc-field-layout-list"
         @update:value="
           (value) => {

packages/nc-gui/components/dlg/share-and-collaborate/SharePage.vue

@@ -191,7 +191,7 @@ function sharedViewUrl() {
     dashboardUrl1 = `${baseUrl}${appInfo.value?.dashboardPath}`
   }
 
-  return encodeURI(`${dashboardUrl1}#/nc/${viewType}/${activeView.value.uuid}`)
+  return encodeURI(`${dashboardUrl1}#/nc/${viewType}/${activeView.value.uuid}${surveyMode.value ? '/survey' : ''}`)
 }
 
 const toggleViewShare = async () => {

packages/nc-gui/composables/useSharedFormViewStore.ts

@@ -264,15 +264,14 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
   }
 
   function handlePreFillForm() {
-    // http://localhost:3000/#/nc/form/070dbc84-f3ca-43a3-808a-3547a873933f?Multiselect=a,b
     if (Object.keys(route.query).length && sharedViewMeta.value.preFilledMode !== PreFilledMode.Disabled) {
-      console.log('router', route.query)
       columns.value = columns.value?.map((c) => {
         if (
           !c.title ||
           !route.query?.[c.title] ||
           isSystemColumn(c) ||
-          (isVirtualCol(c) && !isLinksOrLTAR(c)) ||
+          isVirtualCol(c) ||
+          // (isVirtualCol(c) && !isLinksOrLTAR(c)) || // Todo: Enable this after linksOrLTAR prefill supported
           isAttachment(c)
         ) {
           return c
@@ -298,8 +297,6 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
 
         return c
       })
-      console.log('form state', formState.value)
-      console.log('column', columns.value)
     }
   }
 
@@ -308,7 +305,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
   }
 
   function getPreFillValue(c: ColumnType, value: string) {
-    let preFillValue: any = ''
+    let preFillValue: any
     switch (c.uidt) {
       case UITypes.SingleSelect:
       case UITypes.MultiSelect:
@@ -381,7 +378,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
       }
       case UITypes.Rating: {
         if (!isNaN(Number(value))) {
-          preFillValue = Number(value) > parseProp(c.meta).max ? parseProp(c.meta).max : Number(preFillValue)
+          preFillValue = Number(value) > parseProp(c.meta).max ? parseProp(c.meta).max : Number(value)
         }
         break
       }
@@ -396,7 +393,7 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
         break
       }
       case UITypes.Year: {
-        if (/^\d+$/.test(preFillValue)) {
+        if (/^\d+$/.test(value)) {
           preFillValue = Number(value)
         }
         break
@@ -431,22 +428,12 @@ const [useProvideSharedFormStore, useSharedFormStore] = useInjectionState((share
         }
         break
       }
-      case UITypes.LinkToAnotherRecord: {
+      case UITypes.LinkToAnotherRecord:
-        if (isBt(c)) {
-          const queryOptions = value.split(',')
-
-          // console.log('column bt', queryOptions, c)
-        }
-        break
-      }
       case UITypes.Links: {
-        if (isMm(c)) {
+        // Todo: create an api which will fetch query params records and then autofill records
-          const queryOptions = value.split(',')
-
-          // console.log('column mm', queryOptions, c)
-        }
         break
       }
+
       default: {
         if (isNumericFieldType(c, getColAbstractType(c))) {
           if (!isNaN(Number(value))) {

packages/nc-gui/lang/en.json

@@ -932,7 +932,8 @@
       "default": "Allow pre-filling fields",
       "disabled": "Disable pre-filling fields",
       "locked": "Lock pre-filled fields as read-only",
-      "hidden": "Hide pre-filled fields"
+      "hidden": "Hide pre-filled fields",
+      "lockedFieldTooltip": "Pre-filled value"
     }
   },
   "tooltip": {

packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index.vue

@@ -87,6 +87,10 @@ p {
         &:not(.layout-list) {
           @apply rounded-lg border-solid border-1 border-gray-200 focus-within:border-brand-500 overflow-hidden;
 
+          &.readonly {
+            @apply bg-gray-50 cursor-not-allowed;
+          }
+
           & > div {
             @apply !bg-transparent;
           }
@@ -110,7 +114,7 @@ p {
         input,
         textarea,
         &.nc-virtual-cell {
-          @apply bg-white dark:(bg-slate-500 text-white);
+          @apply bg-white dark:(bg-slate-500 text-white) disabled:bg-transparent;
 
           .ant-btn {
             @apply dark:(bg-slate-300);
@@ -120,9 +124,7 @@ p {
             @apply dark:(bg-slate-700 text-white);
           }
         }
-        &:not(.layout-list) > div {
+
-          @apply bg-white dark:(bg-slate-500 text-white);
-        }
         &.layout-list > div {
           .ant-btn {
             @apply dark:(bg-slate-300);

packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/index.vue

@@ -180,6 +180,9 @@ const onDecode = async (scannedCodeValue: string) => {
                   </div>
 
                   <div>
+                    <NcTooltip :disabled="!field?.read_only">
+                      <template #title> {{ $t('activity.preFilledFields.lockedFieldTooltip') }} </template>
+
                       <LazySmartsheetDivDataCell class="flex relative">
                         <LazySmartsheetVirtualCell
                           v-if="isVirtualCol(field)"
@@ -188,6 +191,7 @@ const onDecode = async (scannedCodeValue: string) => {
                           :data-testid="`nc-form-input-cell-${field.label || field.title}`"
                           :class="`nc-form-input-${field.title?.replaceAll(' ', '')}`"
                           :column="field"
+                          :read-only="field?.read_only"
                         />
 
                         <LazySmartsheetCell
@@ -214,6 +218,7 @@ const onDecode = async (scannedCodeValue: string) => {
                           </div>
                         </a-button>
                       </LazySmartsheetDivDataCell>
+                    </NcTooltip>
 
                     <div class="flex flex-col gap-2 text-slate-500 dark:text-slate-300 text-sm mt-2">
                       <template v-if="isVirtualCol(field)">

packages/nc-gui/pages/index/[typeOrId]/form/[viewId]/index/survey.vue

@@ -280,6 +280,9 @@ onMounted(() => {
               <LazyCellRichText :value="field?.description" class="!h-auto -ml-1" is-form-field read-only sync-value-change />
             </div>
 
+            <NcTooltip :disabled="!field?.read_only">
+              <template #title> {{ $t('activity.preFilledFields.lockedFieldTooltip') }} </template>
+
               <LazySmartsheetDivDataCell v-if="field.title" class="relative nc-form-data-cell">
                 <LazySmartsheetVirtualCell
                   v-if="isVirtualCol(field)"
@@ -288,6 +291,7 @@ onMounted(() => {
                   :row="{ row: {}, oldRow: {}, rowMeta: {} }"
                   :data-testid="`nc-survey-form__input-${field.title.replaceAll(' ', '')}`"
                   :column="field"
+                  :read-only="field?.read_only"
                 />
 
                 <LazySmartsheetCell
@@ -312,6 +316,7 @@ onMounted(() => {
                   </div>
                 </div>
               </LazySmartsheetDivDataCell>
+            </NcTooltip>
           </div>
 
           <div class="ml-1 mt-4 flex w-full text-lg">