导航栏管理

biz/navigation.go

@@ -123,9 +123,22 @@ func (s *NavigationAPIService) ListNavigation(ctx context.Context, req *pb.ListN
 		Size:         int(req.Size_),
 		WithCount:    true,
 		SelectFields: req.Field,
-		Sort:         strings.Split(req.Order, ","),
 	}
 
+	if req.Order != "" {
+		opt.Sort = strings.Split(req.Order, ",")
+	}
+
+	if req.Wd != "" {
+		opt.QueryLike = map[string][]interface{}{
+			"title":       {req.Wd},
+			"description": {req.Wd},
+			"href":        {req.Wd},
+		}
+	}
+
+	s.logger.Debug("ListNavigation", zap.Any("opt", opt), zap.Any("req", req))
+
 	navs, total, err := s.dbModel.GetNavigationList(opt)
 	if err != nil {
 		s.logger.Error("GetNavigationList", zap.Error(err))

model/navigation.go

@@ -47,6 +47,10 @@ func (m *DBModel) UpdateNavigation(navigation *Navigation, updateFields ...strin
 		db = db.Select(m.GetTableFields(tableName))
 	}
 
+	if navigation.Id == navigation.ParentId {
+		navigation.ParentId = 0
+	}
+
 	err = db.Where("id = ?", navigation.Id).Updates(navigation).Error
 	if err != nil {
 		m.logger.Error("UpdateNavigation", zap.Error(err))
@@ -104,6 +108,9 @@ func (m *DBModel) GetNavigationList(opt *OptionGetNavigationList) (navigationLis
 		db = db.Select(opt.SelectFields)
 	}
 
+	if len(opt.Sort) == 0 {
+		opt.Sort = []string{"sort desc"}
+	}
 	db = m.generateQuerySort(db, tableName, opt.Sort)
 
 	db = db.Offset((opt.Page - 1) * opt.Size).Limit(opt.Size)

web/components/FormNavigation.vue

@@ -6,6 +6,21 @@
       label-width="80px"
       :model="navigation"
     >
+      <el-form-item label="上级导航">
+        <el-cascader
+          v-model="navigation.parent_id"
+          :options="trees"
+          :filterable="true"
+          :props="{
+            checkStrictly: true,
+            expandTrigger: 'hover',
+            label: 'title',
+            value: 'id',
+          }"
+          clearable
+          placeholder="请选择上级分类"
+        ></el-cascader>
+      </el-form-item>
       <el-form-item
         label="名称"
         prop="title"
@@ -60,6 +75,38 @@
         ></el-col>
       </el-row>
 
+      <el-row :gutter="20">
+        <el-col :span="12">
+          <el-form-item label="颜色">
+            <el-color-picker
+              v-model="navigation.color"
+              show-alpha
+              clearable
+              placeholder="请选择颜色"
+            ></el-color-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="打开方式">
+            <!-- 即 target -->
+            <el-select
+              v-model="navigation.target"
+              placeholder="请选择打开方式"
+              clearable
+            >
+              <el-option
+                v-for="item in [
+                  { label: '当前页', value: '_self' },
+                  { label: '新页签', value: '_blank' },
+                ]"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              ></el-option>
+            </el-select> </el-form-item
+        ></el-col>
+      </el-row>
+
       <el-form-item label="描述">
         <el-input
           v-model="navigation.description"
@@ -92,6 +139,12 @@ export default {
         return {}
       },
     },
+    trees: {
+      type: Array,
+      default: () => {
+        return []
+      },
+    },
   },
   data() {
     return {
@@ -118,6 +171,11 @@ export default {
         }
         this.loading = true
         const navigation = { ...this.navigation }
+        if (navigation.parent_id && navigation.parent_id.length > 0) {
+          navigation.parent_id =
+            navigation.parent_id[navigation.parent_id.length - 1]
+        }
+
         if (this.navigation.id > 0) {
           const res = await updateNavigation(navigation)
           if (res.status === 200) {

web/pages/admin/navigation.vue

@@ -52,6 +52,7 @@
       <FormNavigation
         ref="navigationForm"
         :init-navigation="navigation"
+        :trees="navigations"
         @success="formNavigationSuccess"
       />
     </el-dialog>
@@ -230,17 +231,6 @@ export default {
           name: 'wd',
           placeholder: '请输入关键字',
         },
-        {
-          type: 'select',
-          label: '状态',
-          name: 'enable',
-          placeholder: '请选择状态',
-          multiple: true,
-          options: [
-            { label: '启用', value: 1 },
-            { label: '禁用', value: 0 },
-          ],
-        },
       ]
     },
     initTableListFields() {
@@ -249,7 +239,7 @@ export default {
         {
           prop: 'title_html',
           label: '名称',
-          minWidth: 150,
+          minWidth: 200,
           fixed: 'left',
           type: 'html',
         },
@@ -259,9 +249,10 @@ export default {
           width: 80,
           type: 'bool',
         },
-        { prop: 'href', label: '链接', minWidth: 250 },
+        { prop: 'href', label: '链接', minWidth: 200 },
+        { prop: 'target', label: '打开方式', width: 80 },
         { prop: 'sort', label: '排序', width: 80, type: 'number' },
-        { prop: 'description', label: '描述', minWidth: 250 },
+        { prop: 'description', label: '描述', minWidth: 200 },
         { prop: 'created_at', label: '创建时间', width: 160, type: 'datetime' },
         { prop: 'updated_at', label: '更新时间', width: 160, type: 'datetime' },
       ]