add: 增加城市选择组件

src/view/myTag/myTagList.vue

@@ -3,30 +3,283 @@
     <nav-crumb :navpath="navpath"></nav-crumb>
     <div class="right-content">
       <div class="right-box">
+        <!-- <el-button @click="handleShowTag">显示</el-button> -->
+        <!-- 子类 -->
+        <div class="common-wrap__cateTags">
+          <tag-category :tagLibName="tagLibName"></tag-category>
+        </div>
+        <div class="common-wrap__opt">
+          <el-input
+            class="w-184"
+            placeholder="请输入标签"
+            prefix-icon="el-icon-search"
+            v-model="tagSearch"
+            @keyup.native="(value)=>searchEnterFun(value)"><!-- enter. -->
+          </el-input>
 
+          <el-button type="primary" @click="toManualTagLib" class="fr m-l-8">从手工库新增</el-button>
+          <el-button type="primary" @click="toPlatformTagLib" class="fr">从平台库新增</el-button>
+        </div>
+        <div class="common-wrap__table m-t-20">
+          <el-table
+            ref="multipleTable"
+            :data="tagTableData"
+            tooltip-effect="dark"
+            style="width: 100%"
+            @selection-change="handleSelectChange">
+            <el-table-column
+              type="selection"
+              >
+            </el-table-column>
+            <el-table-column
+              prop="name"
+              label="标签名称"
+              >
+              <!-- <template slot-scope="scope">{{ scope.row.name }}</template> -->
+            </el-table-column>
+            <el-table-column
+              prop="tagDescribe"
+              label="标签描述"
+              >
+            </el-table-column>
+            <el-table-column
+              label="是否实时"
+              >
+              <template slot-scope="scope">
+                {{scope.row.isRealTime == 1? '实时':'非实时'}}
+              </template>
+            </el-table-column>
+            <el-table-column
+              label="操作">
+              <template slot-scope="scope">
+                <router-link :to="{path:'/platformTagDetail',query:{name:scope.row.id}}" class="edit-btn el-button--text">详情</router-link>
+                <el-button type="text" size="small" class="p-l-32" @click="addTemporary(scope.row.id)">添加至暂存架</el-button>
+                <!-- <el-button type="text" size="small" class="p-l-32" @click="toDelTag(scope.row.id)">删除</el-button> -->
+                <el-popover
+                      placement="top"
+                      width="160"
+                      v-model="scope.row.popVisible">
+                      <p style="line-height: 1.5; padding: 10px 10px 20px;">确认删除吗？</p>
+                      <div style="text-align: right; margin: 0">
+                        <el-button size="mini" type="text" @click="cancelDelTag(scope.$index,scope.row)">取消</el-button>
+                        <el-button type="primary" size="mini" @click="toDelTag(scope.$index,scope.row)">确定</el-button>
+                      </div>
+                      <el-button slot="reference" class="m-l-10" type="text">
+                        删除
+                      </el-button>
+                    </el-popover>
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <div class="block common-wrap__page text-right" v-if="tagTableData.length!=0">
+          <el-pagination
+            background
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :current-page="currentPage"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="pageSize"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total">
+          </el-pagination>
+        </div>
       </div>
     </div>
     <vue-gic-footer></vue-gic-footer>
+    <!-- 标签详情缩写版 -->
+    <tagShortDetail :showTagDetail="showTagDetail" @hideTag="handleHideTag"></tagShortDetail>
+    <!-- 暂存架 -->
+    <tag-temporary></tag-temporary>
   </div>
 </template>
 <script>
   import navCrumb from '@/components/nav/nav.vue';
+  import tagCategory from '@/components/tagCategory.vue';
+  import tagTemporary from '@/components/tagTemporary.vue';
+  import tagShortDetail from '@/components/tagShortDetail.vue';
+  import { _debounce } from "@/common/js/public";
   import { getRequest, postRequest, postJson, postForm } from '@/api/api';
   export default {
       name: "myTagList",
       data() {
         return {
+           // 面包屑参数
+          navpath: [
+            {
+              name: '首页',
+              path: ''
+            },
+            {
+              name: '会员标签',
+              path: ''
+            }
+          ],
 
+          showTagDetail: false, // 标签详情缩小版显示/隐藏
+
+          tagLibName: 'myTag',// 面包屑分类需要的参数
+
+          tagSearch: '', // 搜索值绑定的参数
+
+          // 标签列表数据
+          tagTableData:[
+            {
+              id: 1,
+              name: "123",
+              tagDescribe: '描述描述，最多200字，一行显示50字，默认显示一行',
+              isRealTime: 1,
+              popVisible: false,
+            }
+          ],
+
+          // 分页参数
+          currentPage: 1,
+          pageSize: 20,
+          total: 0,
+
+          // 子分类数据
+          currentTagDatas: [
+            {
+              id: 1,
+              name: '基本信息',
+            },
+            {
+              id: 2,
+              name: '地理信息',
+            },
+          ],
+          childTagDatas: [
+            {
+              id: 1,
+              name: '其他一',
+              num: 12
+            },
+            {
+              id: 2,
+              name: '其他二',
+              num: 12
+            },
+          ],
         }
       },
       methods: {
+        /**
+         * 路由跳转
+         */
+        changeRoute(route) {
+          this.$router.push(route);
+        },
+        /**
+         * 显示标签详情缩小版
+         */
+        handleShowTag() {
+          var that = this
+          that.showTagDetail = true
+        },
+
+        /**
+         * 隐藏标签详情缩小版
+         */
+        handleHideTag(val){
+          var that = this
+          that.showTagDetail = false
+        },
+
+        /**
+         * 到手工标签库
+         */
+        toManualTagLib() {
+          var that = this
+          that.changeRoute('/manualTagList')
+        },
+
+        /**
+         * 到平台标签库
+         */
+        toPlatformTagLib() {
+          var that = this
+          that.changeRoute('/platformTagList')
+        },
+
+        /**
+         * 搜索标签
+         */
+        searchEnterFun: _debounce(function(e) {
+          var that = this
+          console.log(e)
+        },500),
 
+        /**
+         * 表格---多选
+         */
+        handleSelectChange(val) {
+          var that = this
+          console.log(val);
+        },
+
+        /**
+         * 分页---页码变化
+         */
+        handleSizeChange(val) {
+          console.log(`每页 ${val} 条`);
+        },
+        /**
+         * 分页---当前页变化
+         */
+        handleCurrentChange(val) {
+          console.log(`当前页: ${val}`);
+        },
+
+        /**
+         * 获取当前分类下下的标签
+         */
+        getTagList(val) {
+          var that = this
+
+        },
+
+        /**
+         * 点击显示标签详情缩写版
+         */
+        addTemporary(id){
+          var that = this
+          that.showTagDetail = true
+        },
+
+        /**
+         * 删除当前标签 -- 取消
+         */
+        cancelDelTag(index,row) {
+          var that = this
+          row.popVisible = false
+        },
+
+        /**
+         * 删除当前标签 -- 取消
+         */
+        toDelTag(index,row) {
+          var that = this
+          that.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            that.tagTableData.splice(index,1)
+          }).catch(() => {
+
+          });
+
+        }
       },
       mounted() {
 
       },
       components: {
-        navCrumb
+        navCrumb,
+        tagShortDetail,
+        tagCategory,
+        tagTemporary
       }
     }
 </script>

src/view/platformTag/platformTagList.vue

@@ -134,13 +134,13 @@
         </div>
       </div>
     </div> -->
-    <tag-temporary></tag-temporary>
+    <!-- <tag-temporary></tag-temporary> -->
   </div>
 </template>
 <script>
   import navCrumb from '@/components/nav/nav.vue';
   import tagCategory from '@/components/tagCategory.vue';
-  import tagTemporary from '@/components/tagTemporary.vue';
+  // import tagTemporary from '@/components/tagTemporary.vue';
   import { getRequest, postRequest, postJson, postForm } from '@/api/api';
   export default {
       name: "platformTagList",
@@ -260,7 +260,7 @@
       components: {
         navCrumb,
         tagCategory,
-        tagTemporary
+        // tagTemporary
       }
     }
 </script>

static/css/public.css

@@ -362,6 +362,10 @@ input:focus {
   margin-bottom: 20px;
 }
 
+.m-b-26 {
+  margin-bottom: 26px;
+}
+
 .p-20 {
   padding: 20px;
 }
@@ -413,6 +417,10 @@ input:focus {
   display: block;
 }
 
+.top {
+  vertical-align: top;
+}
+
 .middle {
   vertical-align: middle;
 }
@@ -456,10 +464,20 @@ i {
   font-style: normal;
   font-weight: normal;
 }
+
+.font-14 {
+  font-size: 14px;
+}
+
 .font-18 {
   font-size: 18px;
 }
 
+.pointer {
+  cursor: pointer;
+}
+
+
 /* 颜色 */
 .color-blue {
   color: #1890ff;
@@ -715,6 +733,11 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
 
 }
 .common-libFields {
+  min-width: 1300px;
+  -webkit-flex-wrap: wrap;
+  -moz-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  -o-flex-wrap: wrap;
   flex-wrap: wrap;
   margin-top: 22px;
   overflow: hidden;
@@ -1095,3 +1118,7 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
   overflow: unset;
 }
 
+
+.el-date-editor .el-range__close-icon {
+  line-height: 27px;
+}