xiebaomin 1 year ago
parent
commit
81ad48abb8

+ 20 - 4
src/main/resources/static/css/supplier-center/article/article-edit.css

@@ -1,7 +1,3 @@
-.max-width {
-    width: 100% !important
-}
-
 .hide-upload .el-upload {
     display: none
 }
@@ -19,6 +15,20 @@
     width: auto !important;
 }
 
+.text-tab {
+    display: flex;
+    align-items: flex-end;
+}
+.text-tab .el-form-item {
+    width: 45% !important;
+}
+.text-tab .el-form-item .el-select {
+    width: 100% !important;
+}
+.text-tab .el-form-item:nth-child(2) {
+    margin-left: 1% !important;
+}
+
 @media screen and (min-width: 768px) {
     .article-edit .top-tip {
         display: -webkit-box;
@@ -128,6 +138,9 @@
         box-sizing: border-box;
         cursor: pointer
     }
+    .mint-filter .tab-width {
+        width: 100% !important;
+    }
     /* 表单区域 */
     .valide-form {
         width: 720px;
@@ -258,6 +271,9 @@
         color: #fff;
         cursor: pointer
     }
+    .mint-filter .tab-width {
+        width: 100% !important;
+    }
     /* 添加标签 */
     .article-edit .label-add {
         display: -webkit-box;

+ 2 - 2
src/main/resources/static/css/supplier-center/article/article-list.css

@@ -23,7 +23,7 @@
 .article-list .row{width:100%;padding:18px 20px 0;margin-bottom:16px;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff;-webkit-box-shadow:0px 3px 6px rgba(0,0,0,0.07);box-shadow:0px 3px 6px rgba(0,0,0,0.07)}
 .article-list .table,.table tr,.table th,.table td{border:0}
 .article-list .table{width:100%}
-.article-list .table th{font-size:14px;color:#627386;padding-bottom:16px;border-bottom:1px solid #E2E7EF}
+.article-list .table th{font-size:14px;color:#627386;padding-bottom:16px;border-bottom:1px solid #E2E7EF;font-weight: 500;}
 .article-list .table td{font-size:12px;color:#22272E;text-align:center}
 .article-list .table td{padding:16px 0}
 .article-list .table .title,.article-list .table .time,.article-list .table .option{width:100px}
@@ -64,7 +64,7 @@
 .article-list .row{overflow-y: auto; width:100%;padding:4vw 3.4vw 0;margin-bottom:3.8vw;-webkit-box-sizing:border-box;box-sizing:border-box;background:#fff;-webkit-box-shadow:0px 3px 6px rgba(0,0,0,0.07);box-shadow:0px 3px 6px rgba(0,0,0,0.07)}
 .article-list .table,.table tr,.table th,.table td{border:0}
 .article-list .table{width:250vw;}
-.article-list .table th{font-size:3.4vw;color:#627386;padding-bottom:3.8vw;border-bottom:1px solid #E2E7EF}
+.article-list .table th{font-size:3.4vw;color:#627386;padding-bottom:3.8vw;border-bottom:1px solid #E2E7EF;font-weight: 500;}
 .article-list .table td{font-size:2.8vw;color:#22272E;text-align:center}
 .article-list .table td{padding:3.8vw 0}
 .article-list .table .title,.article-list .table .time,.article-list .table .option{width:100px}

+ 37 - 5
src/main/resources/static/js/supplier-center/article/article-edit.js

@@ -37,8 +37,11 @@ var articleEdit = new Vue({
             // 状态
             status: 0,
             // 文章分类
-            typeId: ''
+            typeId: '',
+            // 文章二级分类
+            childId: null,
         },
+        hasSecondary: false, // 是否有二级分类
         // 图片列表
         articleImageList: [],
         // 文章标签列表
@@ -47,6 +50,8 @@ var articleEdit = new Vue({
         chooseLabels: [],
         // 文章分类列表
         articleTypeList: [],
+        // 文章二级分类列表
+        articleChildren: [],
         // 待添加标签名
         addLabelName: '',
         /* 表单验证规则 */
@@ -84,7 +89,10 @@ var articleEdit = new Vue({
             // 文章分类
             typeId: [
                 {required: true, message: '请选择文章所属分类', trigger: 'change'}
-            ]
+            ],
+            // childId: [
+            //     {required: true, message: '请选择文章所属二级分类', trigger: 'change'}
+            // ]
         },
         formValidate: {},
         variable: '',
@@ -170,7 +178,13 @@ var articleEdit = new Vue({
                 }
             })
         },
-        handlerTypeId() {
+        handlerTypeId($event) {
+            this.onFocused()
+            this.onBlured()
+            this.articleChildren = this.articleTypeList.filter(i => i.typeId === $event)[0].articleTypes || []
+            this.formData.childId = null
+        },
+        handlerChildId() {
             this.onFocused()
             this.onBlured()
         },
@@ -183,6 +197,7 @@ var articleEdit = new Vue({
         },
         // 设置表单初始数据
         setFormData: function setFormData(shopArticle) {
+            const isParent = this.articleTypeList.filter(i => i.typeId === shopArticle.typeId).length > 0
             for (var key in this.formData) {
                 if(key === 'labelIds' && shopArticle[key]){
                     this.formData[key] = shopArticle[key].split(',').map(v => parseInt(v));
@@ -190,6 +205,19 @@ var articleEdit = new Vue({
                     this.formData[key] = shopArticle[key];
                 }
             }
+            if (!isParent) {
+                this.articleTypeList.forEach(i => {
+                    if (i.articleTypes) {
+                        i.articleTypes.forEach(e => {
+                            if (e.typeId === shopArticle.typeId) {
+                                this.articleChildren = i.articleTypes
+                                this.formData.typeId = i.typeId
+                                this.formData.childId = e.typeId
+                            }
+                        })
+                    }
+                })
+            }
             // 初始化引导图
             if (this.formData.guidanceImage) {
                 this.articleImageList = [{url: this.formData.guidanceImage}]
@@ -370,7 +398,9 @@ var articleEdit = new Vue({
         onReallySave_new(params) {
             let _this = this;
             this.formData.shopId = this.shopId;
-            SupplierApi.ArticleSubmitSave(this.formData, function (res) {
+            const form = JSON.parse(JSON.stringify(_this.formData))
+            form.typeId = form.childId || form.typeId;
+            SupplierApi.ArticleSubmitSave(form, function (res) {
                 if (res.code === 0) {
                     CAIMEI.dialog('自动保存成功');
                     _this.onFocused()
@@ -384,7 +414,9 @@ var articleEdit = new Vue({
         onReallySave: function onReallySave() {
             var _this = this;
             this.formData.shopId = this.shopId;
-            SupplierApi.ArticleSubmitSave(this.formData, function (res) {
+            const form = JSON.parse(JSON.stringify(_this.formData))
+            form.typeId = form.childId || form.typeId;
+            SupplierApi.ArticleSubmitSave(form, function (res) {
                 if (res.code === 0) {
                     CAIMEI.dialog('保存成功');
                     setTimeout(function () {

+ 33 - 3
src/main/resources/static/js/supplier-center/article/article-list.js

@@ -18,13 +18,15 @@ var articleList = new Vue({
             status: '',
             onlineStatus: '',
             typeId: '',
+            childId: null,// 二级标题id
             pageNum: 1,
             pageSize: 10
         },
         pageInput: 1,
         pageTotal: 0,
         articleList: [],
-        articleTypeList: []
+        articleTypeList: [],
+        articleTypeChildren: [], // 二级菜单列表
     },
     computed: {
         pageTotal: function pageTotal() {
@@ -68,11 +70,39 @@ var articleList = new Vue({
         $('.navLayout').find('.navList').eq(2).addClass("on").find('.con').show().find('a').eq(0).addClass("on");
     },
     methods: {
+        // 查找父级菜单Parents
+        findParent(id) {
+            return this.articleTypeList.filter(i => i.typeId.toString() === id)[0]?.typeName
+        },
         // 获取文章列表
-        getArticleList: function getArticleList() {
+        getArticleList: function getArticleList($event) {
             var that = this;
+            this.articleTypeChildren = this.articleTypeList.filter(i => i.typeId === $event)[0]?.articleTypes || [];
+            this.listQuery.childId = '';
             this.listQuery.shopId = this.shopId;
-            SupplierApi.GetArticleList(this.listQuery, function (res) {
+            const listQuery = JSON.parse(JSON.stringify(this.listQuery))
+            listQuery.typeId = listQuery.childId || listQuery.typeId
+            SupplierApi.GetArticleList(listQuery, function (res) {
+                // console.log(res);
+                if (res.code === 0) {
+                    that.listRecord = res.data.total;
+                    that.articleList = res.data.list;
+                    that.pageTotal = res.data.pages;
+                } else {
+                    CAIMEI.Alert(res.msg, '确定', false);
+                }
+            });
+        },
+        // 二级列表获取文章
+        getArticleChildren($event) {
+            this.listQuery.pageNum = 1
+            this.listQuery.pageSize = 10
+            const that = this
+            const listQuery = JSON.parse(JSON.stringify(this.listQuery))
+            if ($event) {
+                listQuery.typeId = listQuery.childId
+            }
+            SupplierApi.GetArticleList(listQuery, function (res) {
                 // console.log(res);
                 if (res.code === 0) {
                     that.listRecord = res.data.total;

+ 2 - 2
src/main/resources/templates/article/components/article-header.html

@@ -45,7 +45,7 @@
             <a class="searchBtn icon" href="javascript:void(0);" @click="handlerH5Search">搜索</a>
         </div>
         <div class="keywords">
-            <div th:each="label : ${labels}" @click.stop="show = !show">
+            <div th:each="label,count : ${labels}" @click.stop="show = !show" th:if="${count.index} le 7">
                 <a th:href="'/info/label-' + ${label.id} + '-1.html'" th:text="${label.name}"></a>
             </div>
         </div>
@@ -54,7 +54,7 @@
 <!--   导航栏弹窗-->
     <van-popup class="navPopup" v-model="right_drawer" position="right" v-cloak>
         <van-collapse accordion v-model="activeNames">
-            <van-collapse-item th:title="${type.name}" th:name="${type.id}" th:each="type,status: *{articleType}" th:typeId="${type.id}">
+            <van-collapse-item th:title="${type.name}" th:name="${type.id}" th:each="type,status: *{articleType}" th:typeId="${type.id}" th:if="${status.index} < 10">
                 <a th:href="'/info/center-'+${type.id}+'-1.html'" th:text="${type.name}" class="van-collapse-nav"></a>
                 <a class="van-collapse-nav" th:each="link: *{type.linkList}" th:text="${link.name}" th:href="'/info/center-'+${link.id}+'-1.html'"></a>
             </van-collapse-item>

+ 3 - 4
src/main/resources/templates/article/list.html

@@ -14,12 +14,11 @@
     <!--    <div class="tip">提示:产品详情请到采美商城搜索</div> -->
     <!--    面包屑-->
     <div th:if="${typeId}>0" class="bar">
-        <a href="/" target="_blank">首页 &gt; </a>
-        <a th:each="type: ${articleType}" th:if="${typeId}==${type.id}" th:text="${type.name}" href="javascript:void(0);" class="title newTitle"></a>
+        <a th:each="type: ${articleType}" th:if="${typeId}==${type.id}" th:text="${type.name}" th:href="'/info/center-' + ${type.id} + '-1.html'" class="title newTitle"></a>
         <span th:each="type: ${articleType}">
             <span th:each="childLink: ${type.linkList}" th:if="${typeId}==${childLink.id}">
-                <a th:text="${type.name}" href="javascript:void(0);" class="title newTitle"></a>
-                <a th:if="${typeId}==${childLink.id}" href="javascript:void(0);" class="title newTitle" th:text="'>' + ${childLink.name}"></a>
+                <a th:text="${type.name}" th:href="'/info/center-' + ${type.id} + '-1.html'" class="title newTitle"></a>
+                <a th:if="${typeId}==${childLink.id}" th:href="'/info/center-' + ${childLink.id} + '-1.html'" class="title newTitle" th:text="'>' + ${childLink.name}"></a>
             </span>
         </span>
     </div>

+ 17 - 8
src/main/resources/templates/supplier-center/article/article-edit.html

@@ -73,7 +73,7 @@
                                         v-model="formData.labelIds"
                                         multiple
                                         placeholder="请选择标签"
-                                        class="max-width"
+                                        class="tab-width"
                                         :multiple-limit="6"
                                         clearable
                                         filterable
@@ -108,13 +108,22 @@
                                 <div class="mint-message" v-if="formValidate.articleContent">{{formValidate.articleContent}}</div>
                             </el-form-item>
                             <!-- 文章分类 -->
-                            <el-form-item label="文章分类" prop="typeId">
-                                <el-select v-model="formData.typeId" class="max-width" @change="handlerTypeId" @click.native="onFocused">
-                                    <template v-for="(typeInfo, index) in articleTypeList">
-                                        <el-option :label="typeInfo.typeName" :value="typeInfo.typeId" :key="typeInfo.typeId"></el-option>
-                                    </template>
-                                </el-select>
-                            </el-form-item>
+                            <div class="text-tab">
+                                <el-form-item label="文章分类" prop="typeId">
+                                    <el-select v-model="formData.typeId" class="max-width" @change="handlerTypeId" @click.native="onFocused">
+                                        <template v-for="(typeInfo, index) in articleTypeList">
+                                            <el-option :label="typeInfo.typeName" :value="typeInfo.typeId" :key="typeInfo.typeId"></el-option>
+                                        </template>
+                                    </el-select>
+                                </el-form-item>
+                                <el-form-item label="" prop="childId" class="tab-change" v-if="articleChildren.length > 0">
+                                    <el-select v-model="formData.childId" class="max-width" @change="handlerChildId" @click.native="onFocused">
+                                        <template v-for="(typeInfo, index) in articleChildren">
+                                            <el-option :label="typeInfo.typeName" :value="typeInfo.typeId" :key="typeInfo.typeId"></el-option>
+                                        </template>
+                                    </el-select>
+                                </el-form-item>
+                            </div>
                             <!-- 引导图 -->
                             <el-form-item label="引导图" prop="guidanceImage">
                                 <el-input v-model="formData.guidanceImage" placeholder="引导图" v-show="false"></el-input>

+ 21 - 12
src/main/resources/templates/supplier-center/article/article-list.html

@@ -47,20 +47,29 @@
                             <el-input class="control" v-model="listQuery.title" placeholder="请输入文章标题" clearable></el-input>
                         </div>
                         <!--发布人-->
-                        <div class="filter-control">
-                            <span class="label">发布人:</span>
-                            <el-input class="control" v-model="listQuery.publisher" placeholder="请输入文章发布人" clearable></el-input>
-                        </div>
+<!--                        <div class="filter-control">-->
+<!--                            <span class="label">发布人:</span>-->
+<!--                            <el-input class="control" v-model="listQuery.publisher" placeholder="请输入文章发布人" clearable></el-input>-->
+<!--                        </div>-->
                         <!--文章分类-->
                         <div class="filter-control">
                             <span class="label">文章分类:</span>
-                            <el-select v-model="listQuery.typeId" @change="getArticleList" clearable>
+                            <el-select v-model="listQuery.typeId" @change="getArticleList($event)" clearable>
                                 <el-option label="全部" value=""></el-option>
                                 <template v-for="(typeInfo, index) in articleTypeList">
                                     <el-option :key="index" :label="typeInfo.typeName" :value="typeInfo.typeId"></el-option>
                                 </template>
                             </el-select>
                         </div>
+                        <div class="filter-control" v-if="articleTypeChildren.length > 0">
+                            <span class="label">二级分类:</span>
+                            <el-select v-model="listQuery.childId" @change="getArticleChildren" clearable>
+                                <el-option label="全部" value=""></el-option>
+                                <template v-for="(typeInfo, index) in articleTypeChildren">
+                                    <el-option :key="index" :label="typeInfo.typeName" :value="typeInfo.typeId"></el-option>
+                                </template>
+                            </el-select>
+                        </div>
                         <!--审核状态-->
                         <div class="filter-control">
                             <span class="label">审核状态:</span>
@@ -110,15 +119,15 @@
                             <th>审核状态</th>
                             <th>上线状态</th>
                             <th>发布时间</th>
-                            <th>发布人</th>
-                            <th>添加时间</th>
+<!--                            <th>发布人</th>-->
                             <th>状态</th>
                             <th>操作</th>
                         </tr>
                         <template v-for="(articleInfo, index) in articleList"  >
                             <tr :key="index" class="tr-row">
                                 <td v-text="articleInfo.articleId"></td>
-                                <td v-text="articleInfo.typeName"></td>
+                                <td v-if="articleInfo.parentId === '0'">{{ articleInfo.typeName }}</td>
+                                <td v-else>{{ findParent(articleInfo.parentId) + `/${articleInfo.typeName}` }}</td>
                                 <td>
                                     <img class="cover" :src="articleInfo.guidanceImage" :alt="articleInfo.title"/></td>
                                 <td class="title">
@@ -140,10 +149,10 @@
                                 <td class="time">
                                     <div class="time">{{ articleInfo.publishDate | formatDate }}</div>
                                 </td>
-                                <td v-html="articleInfo.publisher"></td>
-                                <td class="time" v-if="articleInfo.createDate">
-                                    <div class="time">{{ articleInfo.createDate | formatDate}}</div>
-                                </td>
+<!--                                <td v-html="articleInfo.publisher"></td>-->
+<!--                                <td class="time" v-if="articleInfo.createDate">-->
+<!--                                    <div class="time">{{ articleInfo.createDate | formatDate}}</div>-->
+<!--                                </td>-->
                                 <td>
                                     <span class="state primary" v-if="articleInfo.status === 1">已发布</span>
                                     <span class="state danger" v-else>存草稿</span>