平板策略引用优化

public/iconfont/demo_index.html

@@ -54,6 +54,12 @@
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe62b;</span>
+                <div class="name">三点</div>
+                <div class="code-name">&amp;#xe62b;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xeb2a;</span>
                 <div class="name">时间</div>
@@ -234,9 +240,9 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1712547599749') format('woff2'),
-       url('iconfont.woff?t=1712547599749') format('woff'),
-       url('iconfont.ttf?t=1712547599749') format('truetype');
+  src: url('iconfont.woff2?t=1713162473058') format('woff2'),
+       url('iconfont.woff?t=1713162473058') format('woff'),
+       url('iconfont.ttf?t=1713162473058') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -262,6 +268,15 @@
       <div class="content font-class">
         <ul class="icon_lists dib-box">
           
+          <li class="dib">
+            <span class="icon iconfont icon-sandian"></span>
+            <div class="name">
+              三点
+            </div>
+            <div class="code-name">.icon-sandian
+            </div>
+          </li>
+          
           <li class="dib">
             <span class="icon iconfont icon-shijian"></span>
             <div class="name">
@@ -532,6 +547,14 @@
       <div class="content symbol">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-sandian"></use>
+                </svg>
+                <div class="name">三点</div>
+                <div class="code-name">#icon-sandian</div>
+            </li>
+          
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#icon-shijian"></use>

public/iconfont/iconfont.css

@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 4468064 */
-  src: url('iconfont.woff2?t=1712547599749') format('woff2'),
-       url('iconfont.woff?t=1712547599749') format('woff'),
-       url('iconfont.ttf?t=1712547599749') format('truetype');
+  src: url('iconfont.woff2?t=1713162473058') format('woff2'),
+       url('iconfont.woff?t=1713162473058') format('woff'),
+       url('iconfont.ttf?t=1713162473058') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-sandian:before {
+  content: "\e62b";
+}
+
 .icon-shijian:before {
   content: "\eb2a";
 }

public/iconfont/iconfont.json

@@ -5,6 +5,13 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "766814",
+      "name": "三点",
+      "font_class": "sandian",
+      "unicode": "e62b",
+      "unicode_decimal": 58923
+    },
     {
       "icon_id": "5387666",
       "name": "时间",

src/api/school.js

@@ -117,3 +117,11 @@ export const user_import = (data) => setRequest("user/import", data);
  * 3.2.6用户--获取班级sn
  */
 export const user_list_cs = (data) => setRequest("user/list_cs", data);
+/**
+ * 3.4.3班级--更新
+ */
+export const class_edit = (data) => setRequest("class/edit", data);
+/**
+ * 3.4.4班级--删除
+ */
+export const class_delete = (data) => setRequest("class/delete", data);

src/views/login/login.vue

@@ -32,6 +32,7 @@
             oncopy="return false"
             onpaste="return false"
             oncut="return false"
+            :maxlength="16"
             v-model="loginForm.loginpwd"
             @keyup.enter.native="login_by_username('loginForm')"
             placeholder="请输入密码"

src/views/schoolSection/strategy/publicStrategy.vue

@@ -532,6 +532,8 @@ export default {
                 arr.length > 0 ? arr[0].handleMethod.split(";") : [];
             });
           }
+          //刷新左侧树
+          this.$emit("refresh");
           this.curState = 2; //编辑状态
           this.stPadInfo.show = false;
         } else {

src/views/schoolSection/strategy/strategyManage.vue

@@ -116,12 +116,14 @@ export default {
         if (res.code === 0) {
           this.schoolInfo = res.obj;
           this.schoolInfo.schoolid = this.schoolInfo.id;
-          this.curClass = this.schoolInfo;
-          if (this.schoolInfo.children.length > 0 && !this.curClass.id) {
+          if (this.schoolInfo.children.length > 0) {
             this.schoolInfo.children.forEach((item) => {
               item.schoolid = this.schoolInfo.id;
             });
           }
+          if (!this.curClass.id) {
+            this.curClass = this.schoolInfo;
+          }
           this.strategy = this.strategy ? this.strategy : 1; //渲染页面
         } else {
           this.$Message.error(res.msg);

src/views/schoolSection/userManage/userManage.vue

@@ -16,6 +16,7 @@
         <div v-for="item in schoolInfo.children" :key="item.id">
           <div
             :class="[
+              'class_item',
               curClass.id === item.id && curClass.type === item.type
                 ? 'active'
                 : ''
@@ -25,6 +26,10 @@
           >
             {{ item.name }}
           </div>
+          <span
+            @click="toOpenMenu(item, $event)"
+            class="ivu-icon iconfont icon-sandian"
+          ></span>
         </div>
       </div>
     </div>
@@ -138,6 +143,45 @@
         ></Page>
       </div>
     </div>
+    <!-- 更多菜单弹窗 -->
+    <div
+      class="more_menu"
+      ref="moreMenuRef"
+      @mousedown.stop
+      @contextmenu.stop.prevent
+      @mousewheel.stop
+    >
+      <div @click="toSelectMenuItem(1)" class="menu_group">编辑</div>
+      <div @click="toSelectMenuItem(2)" class="menu_group">删除</div>
+    </div>
+    <!-- 编辑班级 -->
+    <Modal
+      v-model="classInfo.show"
+      :mask-closable="false"
+      class="modal_tip"
+      title="编辑"
+    >
+      <Form
+        v-if="classInfo.show"
+        ref="classInfo"
+        :model="classInfo"
+        :rules="rules"
+        :label-width="110"
+      >
+        <FormItem label="班级名称" prop="classname">
+          <Input
+            v-model.trim="classInfo.classname"
+            placeholder="请输入班级名称"
+          ></Input>
+        </FormItem>
+      </Form>
+      <div slot="footer" style="text-align: right">
+        <Button @click="exitInfo.show = false">取消</Button>
+        <Button @click="saveclassInfo()" type="primary" class="primary_btn"
+          >保存</Button
+        >
+      </div>
+    </Modal>
     <!-- 已存在列表 -->
     <Modal
       v-model="exitInfo.show"
@@ -321,6 +365,8 @@
 
 <script>
 import {
+  class_delete,
+  class_edit,
   class_list,
   user_care,
   user_delete,
@@ -333,9 +379,26 @@ import {
 } from "@/api/school";
 import { user_add, user_edit } from "@/api/school";
 import { exportToExcel } from "@/utils/exportToExcel";
-import { generateRandomString, pwdCheck, reg} from "@/utils";
+import { generateRandomString, pwdCheck, reg } from "@/utils";
 export default {
   data() {
+    const classnameCheck = async (rule, value, callback) => {
+      if (value) {
+        let flag = this.schoolInfo.children.some((v) => {
+          return (
+            v.name === this.classInfo.classname &&
+            v.id != this.classInfo.classid
+          );
+        });
+        if (flag) {
+          return callback(new Error("班级名称已存在!"));
+        } else {
+          callback();
+        }
+      } else {
+        return callback(new Error("班级名称不能为空!"));
+      }
+    };
     // 重复密码验证
     const pwdAgainCheck = async (rule, value, callback) => {
       if (!reg.test(value)) {
@@ -417,6 +480,13 @@ export default {
         cardid: ""
       },
       rules: {
+        classname: [
+          {
+            required: true,
+            validator: classnameCheck,
+            trigger: "blur"
+          }
+        ],
         username: [
           {
             required: true,
@@ -508,6 +578,8 @@ export default {
           align: "center"
         }
       ],
+      classInfo: {},
+      selectedModel: {},
       schoolInfo: {
         children: [],
         name: ""
@@ -527,6 +599,91 @@ export default {
     this.searchList();
   },
   methods: {
+    saveclassInfo() {
+      this.$refs.classInfo.validate((valid) => {
+        if (valid) {
+          this.showLoading = true;
+          class_edit({
+            classid: this.classInfo.classid,
+            classname: this.classInfo.classname,
+            rversion: this.classInfo.rversion
+          }).then((res) => {
+            this.showLoading = false;
+            if (res.code === 0) {
+              if (this.classInfo.classid === this.curClass.id) {
+                this.curClass.name = this.classInfo.classname;
+              }
+              this.classInfo.show = false;
+              this.init();
+              this.$Message.success(res.msg);
+            } else {
+              this.$Message.error(res.msg);
+            }
+          });
+        }
+      });
+    },
+    toSelectMenuItem(type) {
+      this.removeMoreMenu();
+      //type 1编辑 2删除
+      if (type === 1) {
+        this.classInfo = {
+          show: true,
+          classid: this.selectedModel.id,
+          rversion: this.selectedModel.rversion,
+          classname: this.selectedModel.name
+        };
+      } else {
+        this.$Modal.confirm({
+          title: "提示",
+          content: "您确定删除【" + this.selectedModel.name + "】吗？",
+          onOk: () => {
+            class_delete({
+              classid: this.selectedModel.id,
+              rversion: this.selectedModel.rversion
+            }).then((res) => {
+              if (res.code === 0) {
+                this.init();
+                this.$Message.success(res.msg);
+              } else {
+                this.$Message.error(res.msg);
+              }
+            });
+          },
+          onCancel: () => {}
+        });
+      }
+    },
+    // 打开弹窗菜单
+    toOpenMenu(Item, event) {
+      this.selectClass(Item);
+      if (!this.$refs.moreMenuRef) {
+        return;
+      }
+      this.selectedModel = Item;
+      let _clientX = event.clientX;
+      let _clientY = event.clientY;
+      this.$refs.moreMenuRef.style.display = `block`;
+      this.$nextTick(() => {
+        let _bodyHeight = document.body.clientHeight;
+        let _domHeight = this.$refs.moreMenuRef.getBoundingClientRect().height;
+        this.$refs.moreMenuRef.style.left = `${_clientX - 105}px`;
+        if (_clientY + _domHeight > _bodyHeight) {
+          this.$refs.moreMenuRef.style.top = `${_bodyHeight - _domHeight}px`;
+        } else {
+          this.$refs.moreMenuRef.style.top = `${_clientY}px`;
+        }
+      });
+    },
+    // 隐藏弹窗菜单
+    removeMoreMenu() {
+      if (!this.$refs.moreMenuRef) {
+        return;
+      }
+      this.$refs.moreMenuRef.style.display = `none`;
+      this.$refs.moreMenuRef.style.left = `-9999px`;
+      this.$refs.moreMenuRef.style.top = `-9999px`;
+    },
     classChange() {
       if (this.schoolInfo.children.length === 0) {
         return;
@@ -767,7 +924,9 @@ export default {
         this.showLoading = false;
         if (res.code === 0) {
           this.schoolInfo = res.obj;
-          this.curClass = res.obj;
+          if (!this.curClass.id) {
+            this.curClass = res.obj;
+          }
         } else {
           this.$Message.error(res.msg);
         }
@@ -846,6 +1005,19 @@ export default {
         height: 30px;
         text-align: center;
         cursor: pointer;
+        position: relative;
+        .icon-sandian {
+          display: none;
+        }
+        &:hover {
+          .icon-sandian {
+            display: block;
+            position: absolute;
+            top: 4px;
+            right: 6px;
+            font-size: 24px;
+          }
+        }
       }
     }
     .active {
@@ -945,4 +1117,20 @@ export default {
     }
   }
 }
+.more_menu {
+  width: 100px;
+  text-align: center;
+  background: #ffffff;
+  box-shadow: 0 8px 30px 0 #bcc9e380;
+  border-radius: 10px;
+  border: none;
+  .menu_group {
+    height: 35px;
+    line-height: 35px;
+    cursor: pointer;
+    &:hover {
+      background-color: #dbeeffcc;
+    }
+  }
+}
 </style>