完成标签管理模块数据交互

heimawl

2023-06-19 d9a869193fb1eeeabd8a3afbb5341a187684c3d0

完成标签管理模块数据交互

 package.json

@@ -47,12 +47,14 @@
    "file-saver": "^2.0.5",
    "fuse.js": "6.4.3",
    "highlight.js": "9.18.5",
    "jquery": "^3.7.0",
    "js-beautify": "1.13.0",
    "js-cookie": "3.0.1",
    "jsencrypt": "3.0.0-rc.1",
    "nprogress": "0.2.0",
    "quill": "1.3.7",
    "quill-image-drop-module": "^1.0.3",
    "quill-image-resize": "^3.0.9",
    "quill-image-resize-module": "^3.0.0",
    "screenfull": "5.0.2",
    "sortablejs": "1.10.2",

 src/api/system/label.js

@@ -9,6 +9,26 @@
    data: data
  })
};
// æ ‡ç­¾çŠ¶æ€ä¿®æ”¹
export function changetagcategory(tagid, isupload) {
  const data = {
    tagid,
    isupload
  }
  return request({
    url: '/base/tag',
    method: 'put',
    data: data
  })
}
// ä¿®æ”¹æ ‡ç­¾ç±»åˆ«
export function toamendtagcategory(data) {
  return request({
    url: '/system/tagcategory',
    method: 'put',
    data: data
  })
};
// æ–°å¢žæ ‡ç­¾
export function addapitag(data) {
    return request({
@@ -17,6 +37,15 @@
      data: data
    })
  };
  // æ–°å¢žæ ‡ç­¾ç±»åˆ«
export function addtagcategory(data) {
  return request({
    url: '/system/tagcategory',
    method: 'post',
    data: data
  })
};


/**
 * 
@@ -38,9 +67,21 @@
   * åˆ é™¤æ ‡ç­¾
   * @returns 
   */
export function deletetag(tagid) {
export function deletetag(tagids) {
    return request({
      url: '/base/tag/' + tagid,
      url: '/base/tag/' + tagids,
      method: 'delete',
    })
  };
    /**
   * 
   * @param {标签id} tagid 
   * åˆ é™¤æ ‡ç­¾åˆ†ç±»
   * @returns 
   */
export function deletetagcategory(tagid) {
  return request({
    url: '/system/tagcategory/' + tagid,
      method: 'delete',
    })
  };
@@ -63,11 +104,11 @@
   * æŸ¥è¯¢æ ‡ç­¾åˆ—表
   * @returns 
   */
export function listtag(query) {
export function listtag(data) {
    return request({
      url: '/base/tag/list',
      method: 'get',
      params: query
      method: 'post',
      data: data
    })
  };
  /**
@@ -75,10 +116,10 @@
   * èŽ·å–标签分类列表
   * @returns
   */
  export function tagclassifylist(data) {
  export function tagclassifylist(params) {
    return request({
      url: '/system/tagcategory/baseTagCategoryByName',
      method: 'post',
      data: data
      params: params,
    })
  };

 src/main.js

@@ -15,16 +15,30 @@
import plugins from './plugins' // plugins
import { download } from '@/utils/request'
 //引入quill-editor编辑器
//  import VueQuillEditor from 'vue-quill-editor'
//  import 'quill/dist/quill.core.css'
//  import 'quill/dist/quill.snow.css'
//  import 'quill/dist/quill.bubble.css'
 import VueQuillEditor from 'vue-quill-editor'
 // require styles å¼•å…¥æ ·å¼
 import 'quill/dist/quill.core.css'
 import 'quill/dist/quill.snow.css'
 import 'quill/dist/quill.bubble.css'
 Vue.use(VueQuillEditor)

 //实现quill-editor编辑器拖拽上传图片
//  import * as Quill from 'quill'
//  import { ImageDrop } from 'quill-image-drop-module'
//  Quill.register('modules/imageDrop', ImageDrop)
//  import Quill from 'quill'
import {Quill} from 'vue-quill-editor' 
 window.Quill = Quill;
 import imageResize from 'quill-image-resize'
//  const scriptEl = document.createElement('script'); 
//     scriptEl.charset = 'utf-8' 
//     scriptEl.src =  './image-resize.min.js' 
//     const head = document.head || document.getElementsByTagName('head')[0]; 
//     head.appendChild(scriptEl);

 import { ImageDrop } from 'quill-image-drop-module'
//  import imageResize from 'quill-image-resize'
 Quill.register('modules/imageDrop', ImageDrop)
//  import imageResize from 'quill-image-resize-module'
 Quill.register('modules/imageResize', imageResize)
 //实现quill-editor编辑器调整图片尺寸
//  import ImageResize from 'quill-image-resize-module'
//  Quill.register('modules/imageResize', ImageResize)

import './assets/icons' // icon

 src/views/knowledge/education/compilequer/index.vue

@@ -90,164 +90,116 @@
      <!-- å®£æ•™å†…容 -->
      <div v-if="Editprogress == 2">
        <div class="leftvlue-jbxx">宣教内容</div>
        <el-form
          :model="ruleForm"
          :rules="rules"
          ref="ruleForm"
          label-width="100px"
          class="demo-ruleForm"
        >
          <el-form-item label="宣教介绍" prop="desc">
            <el-cascader
              class="demo-cascader"
              v-model="ruleForm.templatevalue"
              :options="asoptions"
              :props="{ expandTrigger: 'hover' }"
            ></el-cascader>
            <el-select v-model="ruleForm.data2" placeholder="提交提示">
              <el-option
                v-for="item in asoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
            <div style="display: flex; margin-top: 20px">
              <div class="PreviewTemplate" @click="PreviewTemplate()">
                é¢„览模版
              </div>
              <el-button type="primary">确认引用</el-button>
            </div>
          </el-form-item>
          <el-form-item label="活动形式" prop="desc">
            <el-input type="textarea" v-model="ruleForm.desc"></el-input>
          </el-form-item>
          <el-form-item label="活动形式" prop="desc">
            <el-input type="textarea" v-model="ruleForm.desc"></el-input>
            <div class="addtopic">
              <el-select
                v-model="addvalue"
                @change="changeaddtopic"
                class="addtopic-input"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </div>

            <div class="presentation">
              <div class="presentation-left">
                <el-table v-loading="loading" :data="userList">
                  <el-table-column
                    label="序号"
                    align="center"
                    key="userid"
                    prop="userid"
                  />
                  <el-table-column
                    label="题目"
                    align="center"
                    key="userName"
                    prop="userName"
                    :show-overflow-tooltip="true"
                  />

                  <el-table-column
                    label="操作"
                    align="center"
                    width="300"
                    class-name="small-padding fixed-width"
                  >
                    <template slot-scope="scope">
                      <!-- <el-button
                        size="medium"
                        type="text"
                        @click="goQRCode(scope.row)"
                        v-hasPermi="['system:user:edit']"
                      >
                        <span class="button-text"
                          ><i class="el-icon-edit"></i>二维码</span
                        ></el-button
                      >
                      <el-button
                        size="medium"
                        type="text"
                        @click="ViewQuestionnaire(scope.row)"
                        v-hasPermi="['system:user:edit']"
                        ><span class="button-textck"
                          ><i class="el-icon-edit"></i>查看</span
                        ></el-button
                      > -->
                      <el-button
                        size="medium"
                        type="text"
                        @click="handleUpdate(scope.row)"
                        v-hasPermi="['system:user:edit']"
                        ><span class="button-textxg"
                          ><i class="el-icon-scissors"></i>修改</span
                        ></el-button
                      >
                      <el-button
                        size="medium"
                        type="text"
                        @click="handleDelete(scope.row)"
                        v-hasPermi="['system:user:remove']"
                        ><span class="button-textsc"
                          ><i class="el-icon-delete"></i>删除</span
                        ></el-button
                      >
                    </template>
                  </el-table-column>
                </el-table>

                <pagination
                  v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList"
                />
              </div>
              <div class="presentation-right">
                <div class="headline">题目设置详情</div>
                <div>题目标题：<span>这家机构怎么样</span></div>
                <div>是否必答：<span>是</span> æ˜¯å¦éšè—ï¼š<span>否</span></div>
                <div class="headline">选项设置</div>
                <div>
                  <p>选项1:<span>医疗机构</span></p>
                  <p>
                    å¡«å†™æ˜Žç»†ï¼š<span>无</span> å¼‚常选项：<span>无</span>
                    åˆ†å€¼ï¼š<span>3</span>
                  </p>
                  <p>选中提示：<span>这个题有点难请注意</span></p>
                  <p>选中跳转：<span>无</span></p>
          <div>
            <el-button @click="openContent" type="primary">查看元素</el-button>
                </div>
              </div>
            </div>
          </el-form-item>
          <el-form-item>
            <el-button type="success" @click="submitForm('ruleForm')"
              >立即创建</el-button
          <div id="quillEditorQiniu">
            <!-- åŸºäºŽelementUi的上传组件 el-upload begin-->
            <el-upload
              class="avatar-uploader"
              :action="uploadImgUrl"
              :accept="'image/*,video/*'"
              :show-file-list="false"
              :on-success="uploadEditorSuccess"
              :on-error="uploadEditorError"
              :before-upload="beforeEditorUpload"
              :headers="headers"
            >
            <el-button type="primary" @click="laststep()">上一步</el-button>
            <el-button @click="resetForm('ruleForm')">重置</el-button>
          </el-form-item>
        </el-form>
            </el-upload>
            <!-- åŸºäºŽelementUi的上传组件 el-upload end-->
            <quill-editor
              class="editor"
              v-model="content"
              ref="customQuillEditor"
              :options="editorOption"
            >
            </quill-editor>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { quillEditor } from "vue-quill-editor";
// import * as Quill from "quill";
import Quill from "quill";

// è¿™é‡Œå¼•å…¥ä¿®æ”¹è¿‡çš„video模块并注册
import Video from "./video";
Quill.register(Video, true);
//获取登录token，引入文件，如果只是简单测试，没有上传文件是否登录的限制的话，
//这个token可以不用获取，文件可以不引入，把上面对应的上传文件携带请求头  :headers="headers" è¿™ä¸ªä»£ç åˆ æŽ‰å³å¯
import { getToken } from "@/utils/auth";
const toolbarOptions = [
  ["bold", "italic", "underline", "strike"], // toggled buttons
  ["blockquote", "code-block"],

  [{ header: 1 }, { header: 2 }], // custom button values
  [{ list: "ordered" }, { list: "bullet" }],
  [{ script: "sub" }, { script: "super" }], // superscript/subscript
  [{ indent: "-1" }, { indent: "+1" }], // outdent/indent
  [{ direction: "rtl" }], // text direction

  [{ size: ["small", false, "large", "huge"] }], // custom dropdown
  [{ header: [1, 2, 3, 4, 5, 6, false] }],

  [{ color: [] }, { background: [] }], // dropdown with defaults from theme
  [{ font: [] }],
  [{ align: [] }],
  ["link", "image", "video"],
  ["clean"], // remove formatting button
];

export default {
  data() {
    return {
      headers: {
        Authorization: "Bearer " + getToken(),
      },
      uploadImgUrl: "/v1/admin/common/upload",
      uploadUrlPath: "没有文件上传",
      quillUpdateImg: false,
      content: "", //最终保存的内容
      editorOption: {
        placeholder: "你想说什么？",
        modules: {
          imageResize: {
            displayStyles: {
              backgroundColor: "black",
              border: "none",
              color: "white",
            },
            modules: ["Resize", "DisplaySize", "Toolbar"],
          },
          toolbar: {
            container: toolbarOptions, // å·¥å…·æ 
            handlers: {
              image: function (value) {
                if (value) {
                  document
                    .querySelector("#quillEditorQiniu .avatar-uploader input")
                    .click();
                } else {
                  this.quill.format("image", false);
                }
              },
              video: function (value) {
                if (value) {
                  document
                    .querySelector("#quillEditorQiniu .avatar-uploader input")
                    .click();
                } else {
                  this.quill.format("video", false);
                }
              },
            },
          },
        },
      },

      sidecolumnrabs: "left", //方向
      Editprogress: 1, //编辑进度
      currentVersion: "1.2.3", //当前版本
@@ -669,6 +621,13 @@
  },

  created() {},
  watch: {
    content(newVal, oldVal) {
      //this.$emit('input', newVal);
      console.log(newVal);
      console.log(oldVal);
    },
  },

  methods: {
    submitForm(formName) {
@@ -714,6 +673,58 @@
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },

    //上传图片之前async
    beforeEditorUpload(res, file) {
      //显示上传动画
      this.quillUpdateImg = true;
      //  const res1 = await uploadImage()
      // console.log(res1,'=====');
      // this.$emit('before',res, file)
      console.log(res);
      console.log(file);
    },
    // ä¸Šä¼ å›¾ç‰‡æˆåŠŸ
    uploadEditorSuccess(res, file) {
      console.log("上传成功");
      // this.$emit('upload',res, file)
      console.log(res, file);
      //拼接出上传的图片在服务器的完整地址
      let imgUrl = res.data.url;
      let type = imgUrl.substring(imgUrl.lastIndexOf(".") + 1);
      console.log(type);
      // èŽ·å–富文本组件实例
      let quill = this.$refs.customQuillEditor.quill;
      // èŽ·å–光标所在位置
      let length = quill.getSelection().index;
      // æ’入图片||视频  res.info为服务器返回的图片地址
      if (type == "mp4" || type == "MP4") {
        window.jsValue = imgUrl;
        quill.insertEmbed(length, "video", imgUrl);
      } else {
        quill.insertEmbed(length, "image", imgUrl);
      }
      // è°ƒæ•´å…‰æ ‡åˆ°æœ€åŽ
      quill.setSelection(length + 1);
      //取消上传动画
      this.quillUpdateImg = false;
    },
    // ä¸Šä¼ (文件)图片失败
    uploadEditorError(res, file) {
      console.log(res);
      console.log(file);
      //页面提示
      this.$message.error("上传图片失败");
      //取消上传动画
      this.quillUpdateImg = false;
    },
    //上传组件返回的结果
    uploadResult: function (res) {
      this.uploadUrlPath = res;
    },
    openContent: function () {
      console.log(this.content);
    },
  },
};
@@ -859,8 +870,80 @@
    font-size: 24px;
  }
}
// ::v-deep.el-form-item--medium .el-form-item__content {
//   line-height: 36px;
//   display: flex;
// }
.editor {
  line-height: normal !important;
  height: 400px;
  margin-bottom: 50px;
}
.ql-snow .ql-tooltip[data-mode="link"]::before {
  content: "请输入链接地址:";
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: "保存";
  padding-right: 0px;
}

.ql-snow .ql-tooltip[data-mode="video"]::before {
  content: "请输入视频地址:";
}

.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: "14px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
  content: "10px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
  content: "18px";
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
  content: "32px";
}

.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: "文本";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: "标题1";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: "标题2";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: "标题3";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: "标题4";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: "标题5";
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: "标题6";
}

.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: "标准字体";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
  content: "衬线字体";
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
  content: "等宽字体";
}
</style>

 src/views/knowledge/education/compilequer/video.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,71 @@
import  { Quill }  from 'vue-quill-editor'

// æºç ä¸­æ˜¯import直接倒入，这里要用Quill.import引入
const BlockEmbed = Quill.import('blots/block/embed')
// const Link = Quill.import('formats/link')

const ATTRIBUTES = ['height', 'width']

class Video extends BlockEmbed {
    static create (value) {
        const node = super.create(value)
        // console.log("js文件"+ window.jsValue)
        // æ·»åŠ video标签所需的属性
        node.setAttribute('controls', 'controls') // æŽ§åˆ¶æ’­æ”¾å™¨
        //删除原生video的控制条的下载或者全屏按钮的方法
        //<video controls controlsList='nofullscreen nodownload noremote footbar' ></video>
        //不用哪个在下面加上哪个
        node.setAttribute('controlsList', 'nofullscreen') // æŽ§åˆ¶åˆ é™¤
        node.setAttribute('type', 'video/mp4')
        node.setAttribute('style', 'object-fit:fill;width: 100%;')
        node.setAttribute('preload', 'auto')    // auto - å½“页面加载后载入整个视频  meta - å½“页面加载后只载入元数据  none - å½“页面加载后不载入视频
        node.setAttribute('playsinline', 'true')
        node.setAttribute('x-webkit-airplay', 'allow')
        // node.setAttribute('x5-video-player-type', 'h5') // å¯ç”¨H5播放器,是wechat安卓版特性
        node.setAttribute('x5-video-orientation', 'portraint') // ç«–屏播放 å£°æ˜Žäº†h5才能使用  æ’­æ”¾å™¨æ”¯ä»˜çš„方向，landscape横屏，portraint竖屏，默认值为竖屏
        node.setAttribute('x5-playsinline', 'true') // å…¼å®¹å®‰å“ ä¸å…¨å±æ’­æ”¾
        node.setAttribute('x5-video-player-fullscreen', 'true')    // å…¨å±è®¾ç½®ï¼Œè®¾ç½®ä¸º true æ˜¯é˜²æ­¢æ¨ªå±
        node.setAttribute('src', window.jsValue)
        return node
    }

    static formats (domNode) {
        return ATTRIBUTES.reduce((formats, attribute) => {
            if (domNode.hasAttribute(attribute)) {
                formats[attribute] = domNode.getAttribute(attribute)
            }
            return formats
        }, {})
    }

    // static sanitize (url) {
    //
    //      // eslint-disable-line import/no-named-as-default-member
    // }

    static value (domNode) {
        return domNode.getAttribute('src')
    }

    format (name, value) {
        if (ATTRIBUTES.indexOf(name) > -1) {
            if (value) {
                this.domNode.setAttribute(name, value)
            } else {
                this.domNode.removeAttribute(name)
            }
        } else {
            super.format(name, value)
        }
    }

    html () {
        const { video } = this.value()
        return `<a href="${video}">${video}</a>`
    }
}
Video.blotName = 'video' // è¿™é‡Œä¸ç”¨æ”¹ï¼Œæ¥¼ä¸»ä¸ç”¨iframe，直接替换掉原来，如果需要也可以保留原来的，这里用个新的blot
Video.className = 'ql-video'
Video.tagName = 'video' // ç”¨video标签替换iframe

export default Video

 src/views/knowledge/education/index.vue

@@ -157,7 +157,7 @@
            <el-table
              v-loading="loading"
              :data="userList"
              border="true"
              border
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="50" align="center" />

 src/views/system/label/index.vue

@@ -22,7 +22,7 @@
      </div>
      <div class="bottom-fl">
        <el-tabs tab-position="right">
          <el-tab-pane :label="`全部 (${numberlb})`"></el-tab-pane>
          <el-tab-pane :label="`全部 (${total})`"></el-tab-pane>
          <el-tab-pane
            class="tab-paness"
            :key="item.name"
@@ -30,15 +30,18 @@
          >
            <span slot="label">
              {{
                item.title + " (" + item.number + ")"
                item.categoryname + " (" + item.tagNum + ")"
              }}&nbsp&nbsp&nbsp<el-popover
                placement="top-start"
                width="100"
                trigger="hover"
              >
                <div style="text-align: center">
                  <el-button type="text" @click="popoveramend">修改</el-button
                  ><el-button type="text" @click="deleteVisible = true"
                  <el-button
                    type="text"
                    @click="popoveramend(item.tagcategoryid)"
                    >修改</el-button
                  ><el-button type="text" @click="deletefenlei(item)"
                    ><span style="color: rgb(173, 55, 55)"
                      >删除</span
                    ></el-button
@@ -47,8 +50,6 @@
                <i slot="reference" class="el-icon-share"></i> </el-popover
            ></span>
          </el-tab-pane>

          <el-tab-pane :label="`未分组(${numberlbs})`"></el-tab-pane>
        </el-tabs>
      </div>
    </div>
@@ -69,7 +70,7 @@
            >
              <el-form-item label="标签名称" prop="userName">
                <el-input
                  v-model="queryParams.userName"
                  v-model="queryParams.tagname"
                  placeholder="请输入"
                  clearable
                  style="width: 200px"
@@ -101,7 +102,7 @@
                  plain
                  icon="el-icon-plus"
                  size="medium"
                  @click="lstamendtagVisible = true"
                  @click="addladeltag"
                  v-hasPermi="['system:user:add']"
                  >新增</el-button
                >
@@ -152,41 +153,51 @@
              <el-table-column
                label="序号"
                align="center"
                key="userId"
                prop="userId"
                key="tagid"
                prop="tagid"
              />
              <el-table-column
                label="标签名称"
                align="center"
                key="userName"
                prop="userName"
                key="tagname"
                prop="tagname"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="最近编辑"
                align="center"
                key="nickName"
                prop="nickName"
                :show-overflow-tooltip="true"
              />
                key="updateTime"
                prop="updateTime"
              >
                <template slot-scope="scope">
                  <span
                    >{{ scope.row.updateBy }}
                    <p>{{ scope.row.updateTime }}</p></span
                  >
                </template>
              </el-table-column>

              <el-table-column
                label="标签描述"
                align="center"
                key="aphonenumber"
                prop="aphonenumber"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              />
              >
              </el-table-column>
              <el-table-column
                label="状态"
                align="center"
                key="aphonenumbers"
                prop="aphonenumbers"
                key="isupload"
                prop="isupload"
                width="120"
              >
                <template slot-scope="scope">
                  <el-switch
                    v-model="scope.row.delivery"
                    v-model="scope.row.isupload"
                    :active-value="1"
                    :inactive-value="0"
                    active-color="#13ce66"
                    @change="handleStatusChange(scope.row)"
                  ></el-switch>
                </template>
@@ -238,12 +249,12 @@
      width="30%"
      :visible.sync="dialogFormVisible"
    >
      <el-form :model="sidecolumnform">
      <el-form :model="classifyform">
        <el-form-item
          :label="amendtag ? '请输入新的类别名称' : '请输入类别名称'"
        >
          <el-input
            v-model="sidecolumnform.classesname"
            v-model="classifyform.categoryname"
            autocomplete="off"
          ></el-input>
        </el-form-item>
@@ -264,9 +275,7 @@
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="deleteVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="deleteVisible = false"
          >ç¡® å®š</el-button
        >
        <el-button type="primary" @click="deletefenlei">ç¡® å®š</el-button>
      </span>
    </el-dialog>
    <!-- ä¿®æ”¹/添加标签弹框 -->
@@ -277,38 +286,55 @@
    >
      <el-form ref="form" :model="tagform" label-width="80px">
        <el-form-item label="标签名称">
          <el-input v-model="tagform.name"></el-input>
          <el-input v-model="tagform.tagname"></el-input>
        </el-form-item>
        <el-form-item label="标签描述">
          <el-select
            v-model="tagform.tagcategoryid"
            placeholder="请选择标签分类"
          >
            <el-option
              v-for="item in editableTabs"
              :key="item.tagcategoryid"
              :label="item.categoryname"
              :value="item.tagcategoryid"
            >
            </el-option>
          </el-select>
        </el-form-item>

        <el-form-item label="是否启用">
          <el-switch v-model="tagform.delivery"></el-switch>
          <el-switch
            v-model="tagform.isupload"
            :active-value="1"
            :inactive-value="0"
            active-color="#13ce66"
          ></el-switch>
        </el-form-item>

        <el-form-item label="标签描述">
          <el-input type="textarea" v-model="tagform.desc"></el-input>
          <el-input type="textarea" v-model="tagform.tagdescription"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="lstamendtagVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="submitsidecolumn">ç¡® å®š</el-button>
        <el-button type="primary" @click="Maintenancetag">ç¡® å®š</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
} from "@/api/system/user";
import { addUser, updateUser } from "@/api/system/user";
import {
  toamendtag,
  addapitag,
  detailstag,
  deletetag,
  changetagcategory,
  toamendtagcategory,
  addtagcategory,
  deletetagcategory,
  listtag,
  tagclassifylist,
} from "@/api/system/label";
@@ -332,6 +358,7 @@
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      idds: "", //分类id
      // æ€»æ¡æ•°
      total: 0,
      amendtag: false, //是否修改类别
@@ -341,23 +368,16 @@
      deletefenl: "高血压", //删除项
      //修改添加标签弹框数据
      tagform: {
        delivery: "",
        name: "",
        desc: "",
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
      },
      classifyform: {
        categoryname: "",
      },
      // æ ‡ç­¾è¡¨æ ¼æ•°æ®
      userList: [
        {
          userId: 1,
          userName: "三号",
          nickName: "1.2.4",
          aphonenumber: "关节炎症",
          delivery: true,
          aphonenumbers: "",
          bphonenumber: "很棒",
          cphonenumber: "2022-12-12 ",
        },
      ],
      userList: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
@@ -370,11 +390,10 @@
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      forms: {
        name: "",
      },
      numberlb: 22,
      numberlbs: 2,
      sidecolumnform: {
        classesname: "",
      }, //添加类别表单
      dialogFormVisible: false, //添加、修改类别弹框
      lstamendtagVisible: false, //添加、修改标签弹框
      goQRCodeVisible: false, //二维码弹框
@@ -418,15 +437,12 @@
          number: "2",
        },
      ],
      // æŸ¥è¯¢å‚æ•°
      // æŸ¥è¯¢æ ‡ç­¾åˆ—表参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        phonenumber: undefined,
        status: undefined,
        deptId: undefined,
        IDnumber: undefined,
        tagname: undefined,
        tagdescription: undefined,
      },
      // åˆ—信息
      columns: [
@@ -439,51 +455,51 @@
        { key: 6, label: `创建时间`, visible: true },
      ],
      // è¡¨å•æ ¡éªŒ
      rules: {
        userName: [
          { required: true, message: "标签名称不能为空", trigger: "blur" },
          {
            min: 2,
            max: 20,
            message: "标签名称长度必须介于 2 å’Œ 20 ä¹‹é—´",
            trigger: "blur",
          },
        ],
        nickName: [
          { required: true, message: "标签昵称不能为空", trigger: "blur" },
        ],
        password: [
          { required: true, message: "标签密码不能为空", trigger: "blur" },
          {
            min: 5,
            max: 20,
            message: "标签密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
            trigger: "blur",
          },
        ],
        email: [
          {
            type: "email",
            message: "请输入正确的邮箱地址",
            trigger: ["blur", "change"],
          },
        ],
        phonenumber: [
          {
            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
            message: "请输入正确的手机号码",
            trigger: "blur",
          },
        ],
        IDnumber: [
          {
            pattern:
              /^\d{6}((((((19|20)\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(((19|20)\d{2})(0[13578]|1[02])31)|((19|20)\d{2})02(0[1-9]|1\d|2[0-8])|((((19|20)([13579][26]|[2468][048]|0[48]))|(2000))0229))\d{3})|((((\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|((\d{2})(0[13578]|1[02])31)|((\d{2})02(0[1-9]|1\d|2[0-8]))|(([13579][26]|[2468][048]|0[048])0229))\d{2}))(\d|X|x)$/,
            message: "请输入正确的身份证号码",
            trigger: "blur",
          },
        ],
      },
      // rules: {
      //   userName: [
      //     { required: true, message: "标签名称不能为空", trigger: "blur" },
      //     {
      //       min: 2,
      //       max: 20,
      //       message: "标签名称长度必须介于 2 å’Œ 20 ä¹‹é—´",
      //       trigger: "blur",
      //     },
      //   ],
      //   nickName: [
      //     { required: true, message: "标签昵称不能为空", trigger: "blur" },
      //   ],
      //   password: [
      //     { required: true, message: "标签密码不能为空", trigger: "blur" },
      //     {
      //       min: 5,
      //       max: 20,
      //       message: "标签密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      //       trigger: "blur",
      //     },
      //   ],
      //   email: [
      //     {
      //       type: "email",
      //       message: "请输入正确的邮箱地址",
      //       trigger: ["blur", "change"],
      //     },
      //   ],
      //   phonenumber: [
      //     {
      //       pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
      //       message: "请输入正确的手机号码",
      //       trigger: "blur",
      //     },
      //   ],
      //   IDnumber: [
      //     {
      //       pattern:
      //         /^\d{6}((((((19|20)\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|(((19|20)\d{2})(0[13578]|1[02])31)|((19|20)\d{2})02(0[1-9]|1\d|2[0-8])|((((19|20)([13579][26]|[2468][048]|0[48]))|(2000))0229))\d{3})|((((\d{2})(0[13-9]|1[012])(0[1-9]|[12]\d|30))|((\d{2})(0[13578]|1[02])31)|((\d{2})02(0[1-9]|1\d|2[0-8]))|(([13579][26]|[2468][048]|0[048])0229))\d{2}))(\d|X|x)$/,
      //       message: "请输入正确的身份证号码",
      //       trigger: "blur",
      //     },
      //   ],
      // },
    };
  },
  watch: {},
@@ -495,47 +511,112 @@
  methods: {
    /** æŸ¥è¯¢æ ‡ç­¾åˆ—表 */
    getList() {
      //   this.loading = true;
      let forms = {};
      forms.name = this.sidecolumnval;
      listtag(forms).then((response) => {
      listtag(this.addDateRange(this.queryParams)).then((response) => {
        console.log(response);
      });
      listUser().then((response) => {
        console.log(response);

        console.log(this.userList);
        this.total = response.total;
        this.userList = response.rows;
      });
    },
    // èŽ·å–标签分类
    gitclasify() {
      let forms = {};
      forms.name = this.sidecolumnval;
      tagclassifylist(forms).then((response) => {
        console.log(response);
      });
    },
    // æ·»åŠ ç±»åˆ«
    submitsidecolumn() {
      this.dialogFormVisible = false;
    /** ä¿®æ”¹æ ‡ç­¾ */
    handleUpdate(row) {
      console.log(row, "修改标签");
      this.lstamendtagVisible = true;
      this.lstamendtag = true;
      this.tagform = {
        delivery: "",
        name: "",
        desc: "",
        isupload: row.isupload,
        tagname: row.tagname,
        tagcategoryid: row.tagcategoryid,
        tagdescription: row.tagdescription,
        tagid: row.tagid,
      };
    },
    // ä¿®æ”¹å¼¹æ¡†
    popoveramend() {
    addladeltag() {
      this.lstamendtagVisible = true;
      this.lstamendtag = false;
      this.tagform = {
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
        tagid: "",
      };
    },
    // æ·»åŠ /修改标签
    Maintenancetag() {
      if (this.lstamendtag) {
        toamendtag(this.addDateRange(this.tagform)).then((response) => {
          console.log(response);
          this.getList();
        });
      } else {
        addapitag(this.addDateRange(this.tagform)).then((response) => {
          console.log(response);
          this.getList();
        });
      }
      this.tagform = {
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
        tagid: "",
      };
    },

    // èŽ·å–标签分类
    gitclasify() {
      tagclassifylist(this.addDateRange(this.forms)).then((response) => {
        console.log(response);
        this.numberlb = response.total;
        this.editableTabs = response.rows;
      });
    },
    // æ·»åŠ /修改类别
    submitsidecolumn() {
      if (this.amendtag) {
        this.classifyform.tagcategoryid = this.idds;
        toamendtagcategory(this.addDateRange(this.classifyform)).then(
          (response) => {
            console.log(response);
            this.gitclasify();
          }
        );
      } else {
        addtagcategory(this.addDateRange(this.classifyform)).then(
          (response) => {
            console.log(response);
            this.gitclasify();
          }
        );
      }
      this.classifyform = {
        categoryname: "",
      };
      this.idds = "";
      this.dialogFormVisible = false;
    },
    //删除分类
    deletefenlei(row) {
      if (this.deleteVisible) {
        deletetagcategory(this.idds).then((response) => {
          console.log(response);
          this.gitclasify();
        });
        this.deleteVisible = false;
        this.idds = "";
      } else {
        this.deleteVisible = true;
        this.idds = row.tagcategoryid;
        this.deletefenl = row.categoryname;
      }
    },
    // ä¿®æ”¹åˆ†ç±»å¼¹æ¡†
    popoveramend(tagcategoryid) {
      this.idds = tagcategoryid;
      this.amendtag = true;
      this.dialogFormVisible = true;
    },
    // åˆ‡æ¢å…±äº«/本地
    tophandleClick() {},
    // å–消按钮
    cancel() {
      this.open = false;
      this.reset();
    },

    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
@@ -556,17 +637,18 @@
    },
    // æ ‡ç­¾çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      console.log(row.isupload);
      let text = row.isupload === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"标签吗？')
        .confirm('确认要"' + text + '""' + row.tagname + '"标签吗？')
        .then(function () {
          // return changeUserStatus(row.userId, row.status);
          return changetagcategory(row.tagid, row.isupload);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
          row.isupload = row.isupload === "0" ? "1" : "0";
        });
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
@@ -578,33 +660,15 @@
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.deptId = undefined;
      this.queryParams.tagname = "";
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.ids = selection.map((item) => item.tagid);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    /** ä¿®æ”¹æ ‡ç­¾ */
    handleUpdate(row) {
      console.log(row, "修改标签");
      this.lstamendtagVisible = true;
      this.lstamendtag = true;
      this.tagform = {
        delivery: row.delivery,
        name: row.userName,
        desc: row.bphonenumber,
      };
    },
    // æŸ¥çœ‹é—®å·
    ViewQuestionnaire() {
      this.$router.push({
        path: "/knowledge/questionnaire/examine/",
        query: { id: "1" },
      });
    },

    /** æ›´æ–°/修改提交按钮 */
@@ -630,16 +694,17 @@
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      console.log(row, "删除弹窗");
      const userIds = row.userId || this.ids;
      const aphonenumber = row.aphonenumber;
      const tagids = row.tagid || this.ids;
      console.log(tagids);
      const tagname = row.tagname;
      this.$modal
        .confirm(
          aphonenumber
            ? '是否确认删除标签名称为"' + aphonenumber + '"的数据项？'
          tagname
            ? '是否确认删除标签名称为"' + tagname + '"的数据项？'
            : "是否确认删除选中的数据项？"
        )
        .then(function () {
          return delUser(userIds);
          return deletetag(tagids);
        })
        .then(() => {
          this.getList();
@@ -650,7 +715,7 @@
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "basetag/export",
        "base/tag/export",
        {
          ...this.topqueryParams,
        },

 src/views/system/user/index.vue

@@ -29,7 +29,14 @@
      </el-col>
      <!--用户数据-->
      <el-col :span="20" :xs="24">
        <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="68px"
        >
          <el-form-item label="用户名称" prop="userName">
            <el-input
              v-model="queryParams.userName"
@@ -75,8 +82,16 @@
            ></el-date-picker>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="mini"
              @click="handleQuery"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
              >重置</el-button
            >
          </el-form-item>
        </el-form>

@@ -89,7 +104,8 @@
              size="mini"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
            >新增</el-button>
              >新增</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
@@ -100,7 +116,8 @@
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['system:user:edit']"
            >修改</el-button>
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
@@ -111,7 +128,8 @@
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
            >删除</el-button>
              >删除</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
@@ -121,7 +139,8 @@
              size="mini"
              @click="handleImport"
              v-hasPermi="['system:user:import']"
            >导入</el-button>
              >导入</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
@@ -131,19 +150,67 @@
              size="mini"
              @click="handleExport"
              v-hasPermi="['system:user:export']"
            >导出</el-button>
              >导出</el-button
            >
          </el-col>
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
          <right-toolbar
            :showSearch.sync="showSearch"
            @queryTable="getList"
            :columns="columns"
          ></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="userList" @selection-change="handleSelectionChange">
        <el-table
          v-loading="loading"
          :data="userList"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="50" align="center" />
          <el-table-column label="用户编号" align="center" key="userId" prop="userId" v-if="columns[0].visible" />
          <el-table-column label="用户名称" align="center" key="userName" prop="userName" v-if="columns[1].visible" :show-overflow-tooltip="true" />
          <el-table-column label="用户昵称" align="center" key="nickName" prop="nickName" v-if="columns[2].visible" :show-overflow-tooltip="true" />
          <el-table-column label="部门" align="center" key="deptName" prop="dept.deptName" v-if="columns[3].visible" :show-overflow-tooltip="true" />
          <el-table-column label="手机号码" align="center" key="phonenumber" prop="phonenumber" v-if="columns[4].visible" width="120" />
          <el-table-column label="状态" align="center" key="status" v-if="columns[5].visible">
          <el-table-column
            label="用户编号"
            align="center"
            key="userId"
            prop="userId"
            v-if="columns[0].visible"
          />
          <el-table-column
            label="用户名称"
            align="center"
            key="userName"
            prop="userName"
            v-if="columns[1].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="用户昵称"
            align="center"
            key="nickName"
            prop="nickName"
            v-if="columns[2].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="部门"
            align="center"
            key="deptName"
            prop="dept.deptName"
            v-if="columns[3].visible"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="手机号码"
            align="center"
            key="phonenumber"
            prop="phonenumber"
            v-if="columns[4].visible"
            width="120"
          />
          <el-table-column
            label="状态"
            align="center"
            key="status"
            v-if="columns[5].visible"
          >
            <template slot-scope="scope">
              <el-switch
                v-model="scope.row.status"
@@ -153,7 +220,13 @@
              ></el-switch>
            </template>
          </el-table-column>
          <el-table-column label="创建时间" align="center" prop="createTime" v-if="columns[6].visible" width="160">
          <el-table-column
            label="创建时间"
            align="center"
            prop="createTime"
            v-if="columns[6].visible"
            width="160"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
@@ -171,21 +244,37 @@
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
                v-hasPermi="['system:user:edit']"
              >修改</el-button>
                >修改</el-button
              >
              <el-button
                size="mini"
                type="text"
                icon="el-icon-delete"
                @click="handleDelete(scope.row)"
                v-hasPermi="['system:user:remove']"
              >删除</el-button>
              <el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['system:user:resetPwd', 'system:user:edit']">
                <el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
                >删除</el-button
              >
              <el-dropdown
                size="mini"
                @command="(command) => handleCommand(command, scope.row)"
                v-hasPermi="['system:user:resetPwd', 'system:user:edit']"
              >
                <el-button size="mini" type="text" icon="el-icon-d-arrow-right"
                  >更多</el-button
                >
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item command="handleResetPwd" icon="el-icon-key"
                    v-hasPermi="['system:user:resetPwd']">重置密码</el-dropdown-item>
                  <el-dropdown-item command="handleAuthRole" icon="el-icon-circle-check"
                    v-hasPermi="['system:user:edit']">分配角色</el-dropdown-item>
                  <el-dropdown-item
                    command="handleResetPwd"
                    icon="el-icon-key"
                    v-hasPermi="['system:user:resetPwd']"
                    >重置密码</el-dropdown-item
                  >
                  <el-dropdown-item
                    command="handleAuthRole"
                    icon="el-icon-circle-check"
                    v-hasPermi="['system:user:edit']"
                    >分配角色</el-dropdown-item
                  >
                </el-dropdown-menu>
              </el-dropdown>
            </template>
@@ -208,36 +297,71 @@
        <el-row>
          <el-col :span="12">
            <el-form-item label="用户昵称" prop="nickName">
              <el-input v-model="form.nickName" placeholder="请输入用户昵称" maxlength="30" />
              <el-input
                v-model="form.nickName"
                placeholder="请输入用户昵称"
                maxlength="30"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="归属部门" prop="deptId">
              <treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" placeholder="请选择归属部门" />
              <treeselect
                v-model="form.deptId"
                :options="deptOptions"
                :show-count="true"
                placeholder="请选择归属部门"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="手机号码" prop="phonenumber">
              <el-input v-model="form.phonenumber" placeholder="请输入手机号码" maxlength="11" />
              <el-input
                v-model="form.phonenumber"
                placeholder="请输入手机号码"
                maxlength="11"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="邮箱" prop="email">
              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50" />
              <el-input
                v-model="form.email"
                placeholder="请输入邮箱"
                maxlength="50"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item v-if="form.userId == undefined" label="用户名称" prop="userName">
              <el-input v-model="form.userName" placeholder="请输入用户名称" maxlength="30" />
            <el-form-item
              v-if="form.userId == undefined"
              label="用户名称"
              prop="userName"
            >
              <el-input
                v-model="form.userName"
                placeholder="请输入用户名称"
                maxlength="30"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item v-if="form.userId == undefined" label="用户密码" prop="password">
              <el-input v-model="form.password" placeholder="请输入用户密码" type="password" maxlength="20" show-password/>
            <el-form-item
              v-if="form.userId == undefined"
              label="用户密码"
              prop="password"
            >
              <el-input
                v-model="form.password"
                placeholder="请输入用户密码"
                type="password"
                maxlength="20"
                show-password
              />
            </el-form-item>
          </el-col>
        </el-row>
@@ -261,7 +385,8 @@
                  v-for="dict in dict.type.sys_normal_disable"
                  :key="dict.value"
                  :label="dict.value"
                >{{dict.label}}</el-radio>
                  >{{ dict.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
@@ -269,7 +394,11 @@
        <el-row>
          <el-col :span="12">
            <el-form-item label="岗位">
              <el-select v-model="form.postIds" multiple placeholder="请选择岗位">
              <el-select
                v-model="form.postIds"
                multiple
                placeholder="请选择岗位"
              >
                <el-option
                  v-for="item in postOptions"
                  :key="item.postId"
@@ -282,7 +411,11 @@
          </el-col>
          <el-col :span="12">
            <el-form-item label="角色">
              <el-select v-model="form.roleIds" multiple placeholder="请选择角色">
              <el-select
                v-model="form.roleIds"
                multiple
                placeholder="请选择角色"
              >
                <el-option
                  v-for="item in roleOptions"
                  :key="item.roleId"
@@ -297,7 +430,11 @@
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input>
              <el-input
                v-model="form.remark"
                type="textarea"
                placeholder="请输入内容"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
@@ -309,7 +446,12 @@
    </el-dialog>

    <!-- ç”¨æˆ·å¯¼å…¥å¯¹è¯æ¡† -->
    <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
    <el-dialog
      :title="upload.title"
      :visible.sync="upload.open"
      width="400px"
      append-to-body
    >
      <el-upload
        ref="upload"
        :limit="1"
@@ -326,10 +468,17 @@
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip text-center" slot="tip">
          <div class="el-upload__tip" slot="tip">
            <el-checkbox v-model="upload.updateSupport" /> æ˜¯å¦æ›´æ–°å·²ç»å­˜åœ¨çš„用户数据
            <el-checkbox v-model="upload.updateSupport" />
            æ˜¯å¦æ›´æ–°å·²ç»å­˜åœ¨çš„用户数据
          </div>
          <span>仅允许导入xls、xlsx格式文件。</span>
          <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>
          <el-link
            type="primary"
            :underline="false"
            style="font-size: 12px; vertical-align: baseline"
            @click="importTemplate"
            >下载模板</el-link
          >
        </div>
      </el-upload>
      <div slot="footer" class="dialog-footer">
@@ -341,14 +490,23 @@
</template>

<script>
import { listUser, getUser, delUser, addUser, updateUser, resetUserPwd, changeUserStatus, deptTreeSelect } from "@/api/system/user";
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
  deptTreeSelect,
} from "@/api/system/user";
import { getToken } from "@/utils/auth";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";

export default {
  name: "User",
  dicts: ['sys_normal_disable', 'sys_user_sex'],
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
@@ -386,7 +544,7 @@
      form: {},
      defaultProps: {
        children: "children",
        label: "label"
        label: "label",
      },
      // ç”¨æˆ·å¯¼å…¥å‚æ•°
      upload: {
@@ -401,7 +559,7 @@
        // è®¾ç½®ä¸Šä¼ çš„请求头部
        headers: { Authorization: "Bearer " + getToken() },
        // ä¸Šä¼ çš„地址
        url: process.env.VUE_APP_BASE_API + "/system/user/importData"
        url: process.env.VUE_APP_BASE_API + "/system/user/importData",
      },
      // æŸ¥è¯¢å‚æ•°
      queryParams: {
@@ -410,7 +568,7 @@
        userName: undefined,
        phonenumber: undefined,
        status: undefined,
        deptId: undefined
        deptId: undefined,
      },
      // åˆ—信息
      columns: [
@@ -420,48 +578,58 @@
        { key: 3, label: `部门`, visible: true },
        { key: 4, label: `手机号码`, visible: true },
        { key: 5, label: `状态`, visible: true },
        { key: 6, label: `创建时间`, visible: true }
        { key: 6, label: `创建时间`, visible: true },
      ],
      // è¡¨å•æ ¡éªŒ
      rules: {
        userName: [
          { required: true, message: "用户名称不能为空", trigger: "blur" },
          { min: 2, max: 20, message: '用户名称长度必须介于 2 å’Œ 20 ä¹‹é—´', trigger: 'blur' }
          {
            min: 2,
            max: 20,
            message: "用户名称长度必须介于 2 å’Œ 20 ä¹‹é—´",
            trigger: "blur",
          },
        ],
        nickName: [
          { required: true, message: "用户昵称不能为空", trigger: "blur" }
          { required: true, message: "用户昵称不能为空", trigger: "blur" },
        ],
        password: [
          { required: true, message: "用户密码不能为空", trigger: "blur" },
          { min: 5, max: 20, message: '用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´', trigger: 'blur' }
          {
            min: 5,
            max: 20,
            message: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
            trigger: "blur",
          },
        ],
        email: [
          {
            type: "email",
            message: "请输入正确的邮箱地址",
            trigger: ["blur", "change"]
          }
            trigger: ["blur", "change"],
          },
        ],
        phonenumber: [
          {
            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
            message: "请输入正确的手机号码",
            trigger: "blur"
          }
        ]
      }
            trigger: "blur",
          },
        ],
      },
    };
  },
  watch: {
    // æ ¹æ®åç§°ç­›é€‰éƒ¨é—¨æ ‘
    deptName(val) {
      this.$refs.tree.filter(val);
    }
    },
  },
  created() {
    this.getList();
    this.getDeptTree();
    this.getConfigKey("sys.user.initPassword").then(response => {
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
@@ -469,7 +637,9 @@
    /** æŸ¥è¯¢ç”¨æˆ·åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
      console.log(this.queryParams);
      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
@@ -478,7 +648,7 @@
    },
    /** æŸ¥è¯¢éƒ¨é—¨ä¸‹æ‹‰æ ‘结构 */
    getDeptTree() {
      deptTreeSelect().then(response => {
      deptTreeSelect().then((response) => {
        this.deptOptions = response.data;
      });
    },
@@ -495,11 +665,15 @@
    // ç”¨æˆ·çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal.confirm('确认要"' + text + '""' + row.userName + '"用户吗？').then(function() {
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
        return changeUserStatus(row.userId, row.status);
      }).then(() => {
        })
        .then(() => {
        this.$modal.msgSuccess(text + "成功");
      }).catch(function() {
        })
        .catch(function () {
        row.status = row.status === "0" ? "1" : "0";
      });
    },
@@ -522,7 +696,7 @@
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: []
        roleIds: [],
      };
      this.resetForm("form");
    },
@@ -541,7 +715,7 @@
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.userId);
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
@@ -561,7 +735,7 @@
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      getUser().then(response => {
      getUser().then((response) => {
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.open = true;
@@ -573,7 +747,7 @@
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then(response => {
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
@@ -591,12 +765,14 @@
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´"
      }).then(({ value }) => {
          resetUserPwd(row.userId, value).then(response => {
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        }).catch(() => {});
        })
        .catch(() => {});
    },
    /** åˆ†é…è§’色操作 */
    handleAuthRole: function(row) {
@@ -605,16 +781,16 @@
    },
    /** æäº¤æŒ‰é’® */
    submitForm: function() {
      this.$refs["form"].validate(valid => {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then(response => {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then(response => {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
@@ -626,18 +802,26 @@
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal.confirm('是否确认删除用户编号为"' + userIds + '"的数据项？').then(function() {
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
        return delUser(userIds);
      }).then(() => {
        })
        .then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {});
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download('system/user/export', {
        ...this.queryParams
      }, `user_${new Date().getTime()}.xlsx`)
      this.download(
        "system/user/export",
        {
          ...this.queryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
    /** å¯¼å…¥æŒ‰é’®æ“ä½œ */
    handleImport() {
@@ -646,8 +830,11 @@
    },
    /** ä¸‹è½½æ¨¡æ¿æ“ä½œ */
    importTemplate() {
      this.download('system/user/importTemplate', {
      }, `user_template_${new Date().getTime()}.xlsx`)
      this.download(
        "system/user/importTemplate",
        {},
        `user_template_${new Date().getTime()}.xlsx`
      );
    },
    // æ–‡ä»¶ä¸Šä¼ ä¸­å¤„理
    handleFileUploadProgress(event, file, fileList) {
@@ -658,13 +845,19 @@
      this.upload.open = false;
      this.upload.isUploading = false;
      this.$refs.upload.clearFiles();
      this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
      this.$alert(
        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
          response.msg +
          "</div>",
        "导入结果",
        { dangerouslyUseHTMLString: true }
      );
      this.getList();
    },
    // æäº¤ä¸Šä¼ æ–‡ä»¶
    submitFileForm() {
      this.$refs.upload.submit();
    }
  }
    },
  },
};
</script>

 vue.config.js

@@ -36,7 +36,7 @@
      // detail: https://cli.vuejs.org/config/#devserver-proxy
      [process.env.VUE_APP_BASE_API]: {
        target1: `http://192.168.1.4:8080`,
        target: `http://localhost:8080`,
        target: `http://192.168.1.4:8080`,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''