fix: added title field in kanban settings

crm/api/doc.py

@@ -207,6 +207,7 @@ def get_data(
 	page_length=20,
 	page_length_count=20,
 	column_field=None,
+	title_field=None,
 	columns=[],
 	rows=[],
 	kanban_columns=[],
@@ -311,6 +312,12 @@ def get_data(
 			elif field_meta.fieldtype == "Select":
 				kanban_columns = [{"name": option} for option in field_meta.options.split("\n")]
 
+		if not title_field:
+			title_field = "name"
+
+		if title_field not in rows:
+			rows.append(title_field)
+
 		if not kanban_fields:
 			kanban_fields = ["name"]
 
@@ -472,7 +479,7 @@ def get_fields_meta(doctype, restricted_fieldtypes=None, as_array=False):
 
 	fields_meta = {}
 	for field in fields:
-		fields_meta[field.fieldname] = field
+		fields_meta[field.get('fieldname')] = field
 
 	return fields_meta
 

crm/fcrm/doctype/crm_view_settings/crm_view_settings.json

@@ -29,6 +29,7 @@
   "kanban_tab",
   "kanban_section",
   "column_field",
+  "title_field",
   "kanban_columns",
   "kanban_fields"
  ],
@@ -171,11 +172,17 @@
    "fieldname": "kanban_fields",
    "fieldtype": "Code",
    "label": "Kanban Fields"
+  },
+  {
+   "default": "name",
+   "fieldname": "title_field",
+   "fieldtype": "Data",
+   "label": "Title Field"
   }
  ],
  "index_web_pages_for_search": 1,
  "links": [],
- "modified": "2024-06-25 17:16:02.876349",
+ "modified": "2024-06-25 19:40:12.067788",
  "modified_by": "Administrator",
  "module": "FCRM",
  "name": "CRM View Settings",

crm/fcrm/doctype/crm_view_settings/crm_view_settings.py

@@ -41,6 +41,7 @@ def create(view):
 	doc.order_by = view.order_by
 	doc.group_by_field = view.group_by_field
 	doc.column_field = view.column_field
+	doc.title_field = view.title_field
 	doc.kanban_columns = json.dumps(view.kanban_columns)
 	doc.kanban_fields = json.dumps(view.kanban_fields)
 	doc.columns = json.dumps(view.columns)
@@ -72,6 +73,7 @@ def update(view):
 	doc.order_by = view.order_by
 	doc.group_by_field = view.group_by_field
 	doc.column_field = view.column_field
+	doc.title_field = view.title_field
 	doc.kanban_columns = json.dumps(kanban_columns)
 	doc.kanban_fields = json.dumps(kanban_fields)
 	doc.columns = json.dumps(columns)
@@ -170,6 +172,7 @@ def create_or_update_default_view(view):
 		doc.order_by = view.order_by
 		doc.group_by_field = view.group_by_field
 		doc.column_field = view.column_field
+		doc.title_field = view.title_field
 		doc.kanban_columns = json.dumps(kanban_columns)
 		doc.kanban_fields = json.dumps(kanban_fields)
 		doc.columns = json.dumps(columns)
@@ -189,6 +192,7 @@ def create_or_update_default_view(view):
 		doc.order_by = view.order_by
 		doc.group_by_field = view.group_by_field
 		doc.column_field = view.column_field
+		doc.title_field = view.title_field
 		doc.kanban_columns = json.dumps(kanban_columns)
 		doc.kanban_fields = json.dumps(kanban_fields)
 		doc.columns = json.dumps(columns)

frontend/src/components/Kanban/KanbanSettings.vue

@@ -16,14 +16,32 @@
           v-if="columnFields"
           value=""
           :options="columnFields"
-          @change="(f) => (column_field = f)"
+          @change="(f) => (columnField = f)"
         >
           <template #target="{ togglePopover }">
             <Button
               class="w-full !justify-start"
               variant="subtle"
               @click="togglePopover()"
-              :label="column_field.label"
+              :label="columnField.label"
+            />
+          </template>
+        </Autocomplete>
+        <div class="text-base text-gray-800 mb-2 mt-4">
+          {{ __('Title Field') }}
+        </div>
+        <Autocomplete
+          v-if="fields.data"
+          value=""
+          :options="fields.data"
+          @change="(f) => (titleField = f)"
+        >
+          <template #target="{ togglePopover }">
+            <Button
+              class="w-full !justify-start"
+              variant="subtle"
+              @click="togglePopover()"
+              :label="titleField.label"
             />
           </template>
         </Autocomplete>
@@ -110,7 +128,7 @@ const emit = defineEmits(['update'])
 const list = defineModel()
 const showDialog = ref(false)
 
-const column_field = computed({
+const columnField = computed({
   get: () => {
     let fieldname = list.value?.params?.column_field
     if (!fieldname) return ''
@@ -122,16 +140,29 @@ const column_field = computed({
   },
 })
 
+const titleField = computed({
+  get: () => {
+    let fieldname = list.value?.params?.title_field
+    if (!fieldname) return ''
+
+    return fields.data?.find((field) => field.fieldname === fieldname)
+  },
+  set: (val) => {
+    list.value.params.title_field = val.fieldname
+  },
+})
+
 const columnFields = computed(() => {
   return (
-    fields.data?.filter((field) => ['Link', 'Select'].includes(field.fieldtype)) ||
-    []
+    fields.data?.filter((field) =>
+      ['Link', 'Select'].includes(field.fieldtype),
+    ) || []
   )
 })
 
 const fields = createResource({
   url: 'crm.api.doc.get_fields_meta',
-  params: { doctype: props.doctype, as_array: true},
+  params: { doctype: props.doctype, as_array: true },
   cache: ['kanban_fields', props.doctype],
   auto: true,
   onSuccess: (data) => {
@@ -161,7 +192,7 @@ const allFields = computed({
 })
 
 function reorder() {
-  allFields.value = allFields.value.map(row => row.fieldname)
+  allFields.value = allFields.value.map((row) => row.fieldname)
 }
 
 function addField(field) {
@@ -181,7 +212,8 @@ function apply() {
   nextTick(() => {
     showDialog.value = false
     emit('update', {
-      column_field: column_field.value.fieldname,
+      column_field: columnField.value.fieldname,
+      title_field: titleField.value.fieldname,
       kanban_fields: allFields.value.map((row) => row.fieldname),
     })
   })

frontend/src/components/Kanban/KanbanView.vue

@@ -76,7 +76,7 @@
           <template #item="{ element: fields }">
             <component
               :is="options.getRoute ? 'router-link' : 'div'"
-              class="pt-3 px-3.5 pb-2.5 rounded-lg border bg-white text-base flex flex-col gap-2"
+              class="pt-3 px-3.5 pb-2.5 rounded-lg border bg-white text-base flex flex-col"
               :data-name="fields.name"
               v-bind="{
                 to: options.getRoute ? options.getRoute(fields) : undefined,
@@ -85,8 +85,24 @@
                   : undefined,
               }"
             >
-              <div v-for="value in column.fields" :key="value">
-                <div class="truncate">{{ fields[value] }}</div>
+              <div class="h-5 flex items-center">
+                <div v-if="fields[titleField]">{{ fields[titleField] }}</div>
+                <div class="text-gray-500" v-else>{{ __('No Title') }}</div>
+              </div>
+              <div class="border-b h-px my-2.5" />
+              <div class="flex flex-col gap-2">
+                <div v-for="value in column.fields" :key="value">
+                  <div class="truncate">{{ fields[value] || '-' }}</div>
+                </div>
+              </div>
+              <div class="border-b h-px mt-2.5 mb-2" />
+              <div class="flex gap-2 items-center justify-between">
+                <div></div>
+                <Button
+                  icon="plus"
+                  variant="ghost"
+                  @click.stop.prevent
+                />
               </div>
             </component>
           </template>
@@ -117,6 +133,10 @@ const emit = defineEmits(['update'])
 
 const kanban = defineModel()
 
+const titleField = computed(() => {
+  return kanban.value?.params?.title_field
+})
+
 const columns = computed(() => {
   if (!kanban.value?.data?.data || kanban.value.data.view_type != 'kanban')
     return []

frontend/src/components/ViewControls.vue

@@ -365,6 +365,7 @@ const view = ref({
   filters: {},
   order_by: 'modified desc',
   column_field: 'status',
+  title_field: 'name',
   kanban_columns: '',
   kanban_fields: '',
   columns: '',
@@ -402,6 +403,7 @@ function getParams() {
   const columns = _view?.columns || ''
   const rows = _view?.rows || ''
   const column_field = _view?.column_field || 'status'
+  const title_field = _view?.title_field || 'name'
   const kanban_columns = _view?.kanban_columns || ''
   const kanban_fields = _view?.kanban_fields || ''
 
@@ -414,6 +416,7 @@ function getParams() {
     order_by: order_by,
     group_by_field: group_by_field,
     column_field: column_field,
+    title_field: title_field,
     kanban_columns: kanban_columns,
     kanban_fields: kanban_fields,
     columns: columns,
@@ -435,6 +438,7 @@ function getParams() {
       group_by_field: group_by_field,
     },
     column_field: column_field,
+    title_field: title_field,
     kanban_columns: kanban_columns,
     kanban_fields: kanban_fields,
     columns: columns,
@@ -462,6 +466,7 @@ list.value = createResource({
         group_by_field: params?.view?.group_by_field || 'owner',
       },
       column_field: params.column_field,
+      title_field: params.title_field,
       kanban_columns: params.kanban_columns,
       kanban_fields: params.kanban_fields,
       columns: data.columns,
@@ -749,6 +754,10 @@ async function updateKanbanSettings(data) {
     list.value.params.column_field = data.column_field
     view.value.column_field = data.column_field
   }
+  if (data.title_field && data.title_field != view.value.title_field) {
+    list.value.params.title_field = data.title_field
+    view.value.title_field = data.title_field
+  }
   if (data.kanban_columns) {
     list.value.params.kanban_columns = data.kanban_columns
     view.value.kanban_columns = data.kanban_columns
@@ -804,6 +813,7 @@ function create_or_update_default_view() {
       order_by: defaultParams.value.order_by,
       group_by_field: defaultParams.value.view?.group_by_field,
       column_field: defaultParams.value.column_field,
+      title_field: defaultParams.value.title_field,
       kanban_columns: defaultParams.value.kanban_columns,
       kanban_fields: defaultParams.value.kanban_fields,
       columns: defaultParams.value.columns,
@@ -827,6 +837,7 @@ function update_custom_view() {
     order_by: defaultParams.value.order_by,
     group_by_field: defaultParams.value.view.group_by_field,
     column_field: defaultParams.value.column_field,
+    title_field: defaultParams.value.title_field,
     kanban_columns: defaultParams.value.kanban_columns,
     kanban_fields: defaultParams.value.kanban_fields,
     columns: defaultParams.value.columns,
@@ -997,6 +1008,7 @@ function saveView() {
     order_by: defaultParams.value.order_by,
     group_by_field: defaultParams.value.view.group_by_field,
     column_field: defaultParams.value.column_field,
+    title_field: defaultParams.value.title_field,
     kanban_columns: defaultParams.value.kanban_columns,
     kanban_fields: defaultParams.value.kanban_fields,
     columns: defaultParams.value.columns,