移动端页面样式优化，文档中插入子文档目录支持

app/Http/Controllers/HomeController.php

@@ -63,15 +63,16 @@ public function home(Request $request, $catalog = 0)
  } else {
  if (empty($catalogId)) {
  // 首页默认只查询不属于任何目录的项目
- $projectModel->where(function($query) {
+ $projectModel->where(function ($query) {
  $query->whereNull('catalog_id')->orWhere('catalog_id', 0);
  });
 
  // 查询项目目录
  // 在分页查询的第一页之外，不展示目录
  if ($page === 1) {
  /** @var Collection $catalogs */
- $catalogs = Catalog::withCount('projects')->where('show_in_home', Catalog::SHOW_IN_HOME)->orderBy('sort_level', 'ASC')->get();
+ $catalogs = Catalog::withCount('projects')->where('show_in_home',
+ Catalog::SHOW_IN_HOME)->orderBy('sort_level', 'ASC')->get();
  }
  } else {
  $catalog = Catalog::where('id', $catalogId)->firstOrFail();
@@ -90,9 +91,9 @@ public function home(Request $request, $catalog = 0)
  if (!empty($userGroups)) {
  $query->orWhere(function ($query) use ($userGroups) {
  $query->where('visibility', '!=', Project::VISIBILITY_PUBLIC)
- ->whereHas('groups', function ($query) use ($userGroups) {
- $query->where('wz_groups.id', $userGroups);
- });
+  ->whereHas('groups', function ($query) use ($userGroups) {
+  $query->where('wz_groups.id', $userGroups);
+  });
  })->orWhere('user_id', $user->id);
  }
  });
@@ -110,8 +111,8 @@ public function home(Request $request, $catalog = 0)
  if (!empty($catalogId)) {
  $favorites =
  $user->favoriteProjects()->where('catalog_id', $catalogId)->withCount('pages')
- ->with('catalog')
- ->get();
+  ->with('catalog')
+  ->get();
  } else {
  $favorites =
  $user->favoriteProjects()->withCount('pages')->with('catalog')->get();
@@ -124,17 +125,18 @@ public function home(Request $request, $catalog = 0)
  }
 
  return view('index', [
- 'projects' => $projects->appends([
+ 'projects'  => $projects->appends([
  'per_page' => $perPage,
  'name' => $name,
  'catalog' => $catalogId ?? null,
  ]),
- 'name' => $name,
- 'catalogs' => $catalogs ?? [],
- 'catalog_id' => $catalogId ?? 0,
- 'catalog' => $catalog ?? null,
- 'favorites' => $favorites ?? [],
- 'tags' => $tags ?? [],
+ 'name' => $name,
+ 'catalogs' => $catalogs ?? [],
+ 'catalog_id' => $catalogId ?? 0,
+ 'catalog' => $catalog ?? null,
+ 'favorites' => $favorites ?? [],
+ 'tags' => $tags ?? [],
+ 'must_show_login_btn' => true,
  ]);
  }
 

public/assets/css/style-dark.css

@@ -4,6 +4,11 @@ body.wz-dark-theme {
 .wz-dark-theme .wz-main-container {
  background: #343a40;
 }
+
+.wz-dark-theme .wz-login-btn {
+ color: white;
+}
+
 .wz-dark-theme .markdown-body table {
  background: #4e4e4e;
 }

public/assets/css/style-dark.less

@@ -29,6 +29,10 @@ body.wz-dark-theme {
  background: @background-color;
  }
 
+ .wz-login-btn {
+ color: white;
+ }
+
  .markdown-body {
  table {
  background: #4e4e4e;

public/assets/css/style.css

@@ -112,6 +112,15 @@ form {
  .wz-panel-breadcrumb .nav {
  float: left!important;
  }
+
+ .wz-hide-small-screen {
+ display: none;
+ }
+
+ .wz-login-btn {
+ width: 100%;
+ margin-top: 5px;
+ }
 }
 
 @media screen and (max-width: 768px) {
@@ -1497,3 +1506,26 @@ pre.prettyprint *,
  display: none;
  }
 }
+
+.wz-nav-normalize {
+ /*border: 1px dashed #ccc;*/
+ padding: 20px;
+}
+
+.wz-nav-normalize .wz-nav-item {
+ display: inline;
+}
+
+.wz-nav-normalize .fa {
+ display: none;
+}
+
+.wz-nav-normalize ul {
+ display: block!important;
+ margin-bottom: auto!important;
+ margin-left: 30px;
+}
+
+.wz-nav-normalize li {
+ list-style: circle;
+}

public/assets/js/markdown-editor.js

@@ -67,7 +67,8 @@ $.wz.mdEditor = function (editor_id, params) {
  sqlCreateBox: 'SQL建表语句',
  mindMapping: '思维导图',
  confirmBtn: '确定',
- cancelBtn: '取消'
+ cancelBtn: '取消',
+ subIndex: '插入子文档目录'
  }
  };
 
@@ -97,7 +98,7 @@ $.wz.mdEditor = function (editor_id, params) {
  "h1", "h2", "h3", "h4", "h5", "|",
  "list-ul", "list-ol", "hr", "|",
  "link", "image", "code", "code-block", "table", "pagebreak", "|",
- "template", "mindMapping", "jsonToTable", "sqlToTable", "sqlCreateBox", "|",
+ "template", "mindMapping", "jsonToTable", "sqlToTable", "sqlCreateBox", "subIndex", "|",
  "watch", "preview", "fullscreen", "|",
  "help"
  ];
@@ -108,6 +109,7 @@ $.wz.mdEditor = function (editor_id, params) {
  jsonToTable: "JSON->表格",
  sqlToTable: "SQL->表格",
  sqlCreateBox: 'SQL建表语句',
+ subIndex: '子文档目录',
  },
  toolbarHandlers: {
  template: function (cm, icon, cursor, selection) {
@@ -238,6 +240,9 @@ $.wz.mdEditor = function (editor_id, params) {
  }]
  }
  });
+ },
+ subIndex: function (cm, icon, cursor, selection) {
+ cm.replaceSelection("[SUB]");
  }
  },
  lang: {
@@ -247,6 +252,7 @@ $.wz.mdEditor = function (editor_id, params) {
  sqlToTable: config.lang.sqlToTable,
  sqlCreateBox: config.lang.sqlCreateBox,
  mindMapping: config.lang.mindMapping,
+ subIndex: config.lang.subIndex,
  }
  },
  onload: function () {

resources/views/layouts/navbar.blade.php

@@ -2,18 +2,17 @@
  <h5 class="my-0 mr-md-auto font-weight-normal wz-top-nav-item">
  <a href="/">{{ config('app.name', 'Wizard API') }}</a>
  </h5>
+
  <div class="wz-top-nav-search ml-md-auto d-flex justify-content-end">
  <form action="{{ wzRoute('search:search') }}" method="get">
  <label for="search-keyword"></label>
  <input type="text" placeholder="@lang('common.search')" id="search-keyword" name="keyword" value="{{ $keyword ?? '' }}">
  </form>
  </div>
- <button type="button" class="btn bmd-btn-icon wz-theme-indicator" data-toggle="tooltip" title="切换主题">
- <i class="material-icons">wb_sunny</i>
- </button>
+
  @if (Auth::guest())
- <a class="btn btn-info active" href="{{ wzRoute('login') }}">@lang('common.login')</a>
- {{--<a class="btn btn-outline-primary" href="{{ wzRoute('register') }}">@lang('common.register')</a>--}}
+ <a class="btn wz-login-btn active {{ ($must_show_login_btn ?? false) ? '' : 'wz-hide-small-screen' }}" href="{{ wzRoute('login') }}">@lang('common.login')</a>
+{{-- <a class="btn btn-outline-primary ml-2" href="{{ wzRoute('register') }}">@lang('common.register')</a>--}}
  @else
  <nav class="my-2 my-md-0 wz-top-nav-item">
  <a class="p-2 text-dark dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
@@ -62,6 +61,9 @@
  </button>
  @endImpersonating
  @endif
+ <button type="button" class="wz-hide-small-screen btn bmd-btn-icon wz-theme-indicator ml-2" data-toggle="tooltip" title="切换主题">
+ <i class="material-icons">wb_sunny</i>
+ </button>
 </div>
 
 @push('script')

resources/views/project/project.blade.php

@@ -10,7 +10,7 @@
  <li class="breadcrumb-item"><a href="{{ wzRoute('project:home', ['id' => $project->id]) }}">{{ $project->name }}</a></li>
  <li class="breadcrumb-item active">{{ $pageItem->title }}</li>
  </ol>
- <ul class="nav nav-pills pull-right">
+ <ul class="nav nav-pills pull-right wz-hide-small-screen">
  @can('page-edit', $pageItem)
  <li role="presentation" class="mr-2">
  <button type="button" data-href="{{ wzRoute('project:doc:edit:show', ['id' => $project->id, 'page_id' => $pageItem->id]) }}" data-toggle="tooltip" title="@lang('common.btn_edit')" class="btn btn-primary bmd-btn-icon">
@@ -95,7 +95,7 @@
 
  <div class="markdown-body wz-panel-limit {{ $type == 'markdown' ? 'wz-markdown-style-fix' : '' }}" id="markdown-body">
  @if($type === 'markdown')
- <textarea class="d-none wz-markdown-content">{{ processMarkdown($pageItem->content ?? '') }}</textarea>
+ <textarea class="d-none wz-markdown-content">{{ str_replace('[SUB]', '<div class="wz-nav-container-in-doc"></div>', processMarkdown($pageItem->content ?? '')) }}</textarea>
  @endif
  @if($type === 'table')
  <textarea id="x-spreadsheet-content" class="d-none">{{ processSpreedSheet($pageItem->content) }}</textarea>
@@ -110,20 +110,22 @@
  </div>
 
  <div class="wz-panel-limit text-center mt-3 wz-content-end wz-score-box">
- <fieldset {{ Auth::guest() ? 'disabled':'' }}>
- <div class="wz-score-opt">
- <button type="button" class="btn btn-default {{ $user_score_type == 1 ? 'active' : '' }} bmd-btn-fab" style="color: #21b351" data-type="1"><i class="material-icons">sentiment_satisfied</i></button>
- <p>{{ $scores[1] ?? '' }} 很赞</p>
- </div>
- <div class="wz-score-opt">
- <button type="button" class="btn btn-default {{ $user_score_type == 2 ? 'active' : '' }} bmd-btn-fab" style="color: #989898" data-type="2"><i class="material-icons">sentiment_very_dissatisfied</i></button>
- <p>{{ $scores[2] ?? '' }} 看不懂</p>
- </div>
- <div class="wz-score-opt">
- <button type="button" class="btn btn-default {{ $user_score_type == 3 ? 'active' : '' }} bmd-btn-fab" style="color: #fed612" data-type="3"><i class="material-icons">sentiment_dissatisfied</i></button>
- <p>{{ $scores[3] ?? '' }} 潦草</p>
- </div>
- </fieldset>
+ @if (!Auth::guest())
+ <fieldset {{ Auth::guest() ? 'disabled':'' }}>
+ <div class="wz-score-opt">
+ <button type="button" class="btn btn-default {{ $user_score_type == 1 ? 'active' : '' }} bmd-btn-fab" style="color: #21b351" data-type="1"><i class="material-icons">sentiment_satisfied</i></button>
+ <p>{{ $scores[1] ?? '' }} 很赞</p>
+ </div>
+ <div class="wz-score-opt">
+ <button type="button" class="btn btn-default {{ $user_score_type == 2 ? 'active' : '' }} bmd-btn-fab" style="color: #989898" data-type="2"><i class="material-icons">sentiment_very_dissatisfied</i></button>
+ <p>{{ $scores[2] ?? '' }} 看不懂</p>
+ </div>
+ <div class="wz-score-opt">
+ <button type="button" class="btn btn-default {{ $user_score_type == 3 ? 'active' : '' }} bmd-btn-fab" style="color: #fed612" data-type="3"><i class="material-icons">sentiment_dissatisfied</i></button>
+ <p>{{ $scores[3] ?? '' }} 潦草</p>
+ </div>
+ </fieldset>
+ @endif
  @if ($useful_score_users)
  <div class="wz-score-useful-users">
  {!! $useful_score_users->map(function($u){return sprintf('<span class="wz-score-user">%s</span>', $u->user->name ?? 'unknown');})->join(', ') !!}
@@ -164,7 +166,7 @@
  @endif
  <li class="breadcrumb-item active">{{ $project->name }}</li>
  </ol>
- <ul class="nav nav-pills pull-right">
+ <ul class="nav nav-pills pull-right wz-hide-small-screen">
  @include('components.page-menus-batch-export', ['project' => $project])
  </ul>
  <div class="clearfix"></div>
@@ -278,6 +280,15 @@ function(data) {
  e.preventDefault();
  });
  @endif
+
+ var documentIsEmpty = {{ trim($pageItem->content ?? '') === '' ? 'true' : 'false' }};
+ if ($('.markdown-body .wz-nav-container-in-doc').length > 0) {
+ $('.markdown-body .wz-nav-container-in-doc').replaceWith("<div class='wz-nav-normalize'>" + $('.wz-has-child.active').children('ul').html() + "</div>");
+ } else {
+ if (documentIsEmpty && $('.wz-has-child.active') !== null && $('.wz-has-child.active').children('ul') !== null && $('.wz-has-child.active').children('ul').html() != null) {
+ $('.markdown-body').prepend("<div class='wz-nav-normalize'>" + $('.wz-has-child.active').children('ul').html() + "</div>");
+ }
+ }
  });
 </script>
 

resources/views/share-show.blade.php

@@ -5,14 +5,16 @@
  <h1 class="wz-page-title">
  {{ $pageItem->title }}
  </h1>
+ @if(Auth::user())
  <a href="{{ wzRoute('project:home', ['id' => $project->id, 'p' => $pageItem->id]) }}"
  title="返回"
  class="btn btn-link float-right print-hide"><i class="material-icons">clear</i></a>
  <hr />
+ @endif
 </nav>
 <div class="markdown-body" id="markdown-body">
  @if($type == 'markdown')
- <textarea id="append-test" style="display:none;">{{ $pageItem->content }}</textarea>
+ <textarea id="append-test" style="display:none;">{{ str_replace('[SUB]', '', processMarkdown($pageItem->content)) }}</textarea>
  @endif
  @if($type == 'table')
  <textarea id="x-spreadsheet-content" class="d-none">{{ processSpreedSheet($pageItem->content) }}</textarea>