Merge branch 'wulong' of http://116.62.18.175:6699/r/~yxh/smartor-web into ...

yxh

2023-08-22 8539cd011187d85633204fc22a9c7fc7fd008605

Merge branch 'wulong' of http://116.62.18.175:6699/r/~yxh/smartor-web into yxh01

 package.json

@@ -37,6 +37,7 @@
  },
  "dependencies": {
    "@riophae/vue-treeselect": "0.4.0",
    "@vue/babel-plugin-jsx": "^1.1.5",
    "axios": "0.24.0",
    "clipboard": "2.0.8",
    "codemirror": "^5.65.13",
@@ -60,6 +61,7 @@
    "quill-image-resize-module": "^3.0.0",
    "sass": "^1.63.6",
    "screenfull": "5.0.2",
    "socket.io": "^2.1.1",
    "sortablejs": "1.10.2",
    "style-loader": "^3.3.3",
    "stylus-loader": "^7.1.3",

 src/api/noteapi/chitchat.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,11 @@
import request from '@/utils/request'
import { parseStrEmpty } from "@/utils/ruoyi";//处理字符串,und,null转换为'';

// èŠå¤©æ¡†ä¸Šä¼ æ–‡ä»¶
export function chitchatapi(data) {
  return request({
    url: '/system/file/admin/uploadFile',
    method: 'post',
    data: data
  })
};

 src/layout/components/Navbar.vue

@@ -9,13 +9,13 @@
      <template v-if="device!=='mobile'">
        <search id="header-search" class="right-menu-item" />
        
        <el-tooltip content="源码地址" effect="dark" placement="bottom">
        <!-- <el-tooltip content="源码地址" effect="dark" placement="bottom">
          <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
        </el-tooltip>
        </el-tooltip> -->

        <el-tooltip content="文档地址" effect="dark" placement="bottom">
        <!-- <el-tooltip content="文档地址" effect="dark" placement="bottom">
          <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
        </el-tooltip>
        </el-tooltip> -->

        <screenfull id="screenfull" class="right-menu-item hover-effect" />


 src/main.js

@@ -64,6 +64,8 @@
  selectDictLabels,
  handleTree,
} from "@/utils/ruoyi";
import LemonMessageVoice from './websocket/lemon-message-voice';
Vue.component(LemonMessageVoice.name,LemonMessageVoice);
// åˆ†é¡µç»„件
import Pagination from "@/components/Pagination";
// è‡ªå®šä¹‰è¡¨æ ¼å·¥å…·ç»„件

 src/views/complaint/complaintlist/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,893 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->
      <el-col :span="24" :xs="24">
        <el-form
          :model="topqueryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="98px"
        >
          <el-form-item label="投诉提交时间">
            <el-date-picker
              v-model="dateRange"
              style="width: 240px"
              value-format="yyyy-MM-dd"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="病人搜索" prop="userName">
            <el-input
              v-model="topqueryParams.userName"
              placeholder="请输入"
              clearable
              style="width: 200px"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>

          <el-form-item label="被投诉科室" prop="status">
            <el-cascader
              v-model="topqueryParams.tagid"
              :options="optionss"
              :props="propss"
              clearable
            ></el-cascader>
          </el-form-item>
          <el-form-item label="投诉类型" prop="status">
            <el-select v-model="topqueryParams.topic" placeholder="请选择">
              <el-option
                v-for="item in topicoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="被投诉员工" prop="status">
            <el-select v-model="topqueryParams.topic" placeholder="请选择">
              <el-option
                v-for="item in topicoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="medium"
              @click="handleQuery"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
              >重置</el-button
            >
          </el-form-item>
        </el-form>
        <el-divider></el-divider>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-plus"
              size="medium"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
              >新增</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="success"
              plain
              icon="el-icon-edit"
              size="medium"
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['system:user:edit']"
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="danger"
              plain
              icon="el-icon-delete"
              size="medium"
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
              >删除</el-button
            >
          </el-col>
          <el-col :span="19">
            <div class="documentf">
              <div class="document">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="medium"
                  @click="handleExport"
                  v-hasPermi="['system:user:export']"
                  >导出</el-button
                >
              </div>
            </div>
          </el-col>
          <!-- <el-col :span="1.5"> </el-col> -->
        </el-row>
        <!-- <right-toolbar
            :showSearch.sync="showSearch"
            @queryTable="getList"
            :columns="columns"
          ></right-toolbar> -->
        <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"
          />

          <el-table-column
            label="病人姓名"
            align="center"
            key="userName"
            prop="userName"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="手机号"
            align="center"
            key="types"
            prop="types"
          />
          <el-table-column
            label="性别"
            align="center"
            key="nickName"
            prop="nickName"
          />
          <el-table-column
            label="投诉方式"
            align="center"
            key="phonenumber"
            prop="phonenumber"
            width="120"
          />

          <el-table-column
            label="投诉对象"
            align="center"
            key="topicnumber"
            prop="topicnumber"
            width="120"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="级别"
            align="center"
            key="topicnumber"
            prop="topicnumber"
            width="120"
            :show-overflow-tooltip="true"
          /><el-table-column
            label="提交人"
            align="center"
            key="topicnumber"
            prop="topicnumber"
            width="120"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="提交时间"
            align="center"
            prop="createTime"
            width="160"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="就诊日期"
            align="center"
            prop="createTime"
            width="160"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="投诉日期"
            align="center"
            prop="createTime"
            width="160"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            width="160"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope" v-if="scope.row.userId !== 1">
              <el-button
                size="medium"
                type="text"
                icon="el-icon-edit"
                @click="Referencequestion(scope.row)"
                v-hasPermi="['system:user:edit']"
                >预览</el-button
              >
              <el-button
                size="medium"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
                v-hasPermi="['system:user:edit']"
                >修改</el-button
              >
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="topqueryParams.pageNum"
          :limit.sync="topqueryParams.pageSize"
          @pagination="getList"
        />
      </el-col>
    </el-row>

    <!-- æ·»åŠ æˆ–修改投诉配置对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="900px"
      append-to-body
    >
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="投诉名称" prop="nickName">
              <el-input
                v-model="form.nickName"
                placeholder="请输入"
                maxlength="30"
              />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="投诉类型" prop="deptId">
              <el-select v-model="form.types" placeholder="请选择">
                <el-option
                  v-for="item in topicoptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="答案选项" prop="email">
            <el-tag
              :key="tag"
              v-for="tag in dynamicTags"
              closable
              :disable-transitions="false"
              @close="handleClose(tag)"
            >
              {{ tag }}
            </el-tag>
            <el-input
              class="input-new-tag"
              v-if="inputVisible"
              v-model="inputValue"
              ref="saveTagInput"
              size="small"
              @keyup.enter.native="handleInputConfirm"
              @blur="handleInputConfirm"
            >
            </el-input>
            <el-button
              v-else
              class="button-new-tag"
              size="small"
              @click="showInput"
              >+ æ–°å¢žé€‰é¡¹</el-button
            >
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="投诉标签" prop="email">
              <el-cascader
                v-model="form.totagid"
                :options="optionss"
                :props="propss"
                clearable
              ></el-cascader>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否启用">
              <el-radio-group v-model="form.qystatus">
                <el-radio
                  v-for="item in qyoptions"
                  :key="item.value"
                  :label="item.value"
                  >{{ item.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否必填">
              <el-radio-group v-model="form.btstatus">
                <el-radio
                  v-for="item in btoptions"
                  :key="item.value"
                  :label="item.value"
                  >{{ item.label }}</el-radio
                >
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注">
              <el-input
                v-model="form.remark"
                type="textarea"
                placeholder="请输入内容"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">ç¡® å®š</el-button>
        <el-button @click="cancel">取 æ¶ˆ</el-button>
      </div>
    </el-dialog>
    <!-- æŠ•è¯‰é¢„览弹框 -->
    <el-dialog width="30%" title="投诉预览" :visible.sync="previewVisible">
      <div class="qrcode-dialo">
        <!-- å•é€‰ -->
        <div class="topic-dev" v-if="previewtype == 1">
          <div class="dev-text">
            [单选]&nbsp&nbsp<span>{{ previewvalue.username }}</span>
          </div>
          <div class="dev-xx">
            <el-radio-group v-model="radio">
              <el-radio
                v-for="(items, index) in dynamicTags"
                :key="index"
                :label="index"
                >{{ items }}</el-radio
              >
            </el-radio-group>
          </div>
        </div>
        <!-- å¤šé€‰ -->
        <div class="topic-dev" v-else-if="previewtype == 2">
          <div class="dev-text">
            [多选]&nbsp&nbsp<span>{{ previewvalue.username }}</span>
          </div>
          <div class="dev-xx">
            <el-checkbox-group v-model="radios">
              <el-checkbox
                v-for="(items, index) in dynamicTags"
                :key="index"
                :label="index"
              >
                {{ items }}
              </el-checkbox>
            </el-checkbox-group>
          </div>
        </div>
        <!-- å¡«ç©º -->
        <div class="topic-dev" v-if="previewtype == 3">
          <div class="dev-text">
            [填空]&nbsp&nbsp<span>{{ previewvalue.username }}</span>
          </div>
          <div class="dev-xx">
            <el-input placeholder="请输入答案" v-model="radioas" clearable>
            </el-input>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //投诉预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览投诉类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导投诉数量
      //预览投诉信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      //导入进度
      dractive: 1,
      // å¯¼å…¥å±•ç¤ºè¡¨å•
      uploadingData: {},
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      optionss: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      qyoptions: [
        {
          value: 1,
          label: "启用",
        },
        {
          value: 2,
          label: "关闭",
        },
      ],
      btoptions: [
        {
          value: 1,
          label: "必填",
        },
        {
          value: 2,
          label: "非必填",
        },
      ],
      topicoptions: [
        {
          value: 1,
          label: "单选",
        },
        {
          value: 2,
          label: "多选",
        },
        {
          value: 3,
          label: "填空",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  methods: {
    /** æŸ¥è¯¢æŠ•è¯‰åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹æŠ•è¯‰è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },

    // æŠ•è¯‰çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      getUser().then((response) => {
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.addalteropen = true;
        this.title = "新增投诉";
        this.form.password = this.initPassword;
      });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}
.document {
  width: 100px;
  height: 50px;
}
.documentf {
  display: flex;
  justify-content: flex-end;
}
.download {
  text-align: center;
  .el-upload__tip {
    font-size: 23px;
  }
  .el-upload__text {
    font-size: 23px;
  }
}
.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}
.el-tag + .el-tag {
  margin-left: 10px;
}
.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}
.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}
.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;
  img {
    width: 100px;
    height: 100px;
  }
}
.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;
    .dev-text {
      margin-bottom: 10px;
    }
  }
}
::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}
::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/complaint/complaintmy/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,877 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->
      <el-col :span="24" :xs="24">
        <el-form
          :model="topqueryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="98px"
        >
          <el-form-item label="投诉类型" prop="status">
            <el-select v-model="topqueryParams.topic" placeholder="请选择">
              <el-option
                v-for="item in topicoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="投诉状态" prop="status">
            <el-select v-model="topqueryParams.topic" placeholder="请选择">
              <el-option
                v-for="item in topicoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              icon="el-icon-search"
              size="medium"
              @click="handleQuery"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
              >重置</el-button
            >
          </el-form-item>
        </el-form>
        <el-divider></el-divider>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-plus"
              size="medium"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
              >新增</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="success"
              plain
              icon="el-icon-edit"
              size="medium"
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['system:user:edit']"
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="danger"
              plain
              icon="el-icon-delete"
              size="medium"
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
              >删除</el-button
            >
          </el-col>
          <el-col :span="19">
            <div class="documentf">
              <div class="document">
                <el-button
                  type="warning"
                  plain
                  icon="el-icon-download"
                  size="medium"
                  @click="handleExport"
                  v-hasPermi="['system:user:export']"
                  >导出</el-button
                >
              </div>
            </div>
          </el-col>
          <!-- <el-col :span="1.5"> </el-col> -->
        </el-row>
        <!-- <right-toolbar
            :showSearch.sync="showSearch"
            @queryTable="getList"
            :columns="columns"
          ></right-toolbar> -->
        <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"
          />

          <el-table-column
            label="病人姓名"
            align="center"
            sortable
            key="userName"
            prop="userName"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="手机号"
            align="center"
            key="types"
            prop="types"
          />
          <el-table-column
            label="性别"
            align="center"
            key="nickName"
            prop="nickName"
          />
          <el-table-column
            label="投诉方式"
            align="center"
            key="phonenumber"
            prop="phonenumber"
            width="120"
          />

          <el-table-column
            label="投诉对象"
            align="center"
            key="topicnumber"
            prop="topicnumber"
            width="120"
            :show-overflow-tooltip="true"
          />
          <el-table-column
            label="级别"
            align="center"
            key="topicnumberaa"
            prop="topicnumberaa"
            sortable
            width="120"
            :show-overflow-tooltip="true"
          />

          <el-table-column
            label="投诉日期"
            sortable
            align="center"
            prop="createTime"
            width="160"
          >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.createTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            width="160"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope">
              <el-button
                size="medium"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
                v-hasPermi="['system:user:edit']"
                >修改</el-button
              >
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="topqueryParams.pageNum"
          :limit.sync="topqueryParams.pageSize"
          @pagination="getList"
        />
      </el-col>
    </el-row>
    <!-- æ·»åŠ æˆ–修改投诉对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="900px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="80px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="病人姓名">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
          <el-col :span="12"
            ><el-form-item label="性别">
              <el-radio v-model="form.radio" label="1">男</el-radio>
              <el-radio v-model="form.radio" label="2">女</el-radio>
              <el-radio v-model="form.radio" label="3">未知</el-radio>
            </el-form-item></el-col
          >
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="联系电话">
              <div style="margin-top: 15px">
                <el-input
                  placeholder="请输入手机号"
                  v-model="form.input3"
                  class="input-with-select"
                >
                  <el-button slot="append" icon="el-icon-search"></el-button>
                </el-input>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="投诉类型">
              <el-select v-model="form.region" placeholder="请选择活动区域">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="投诉日期">
              <el-date-picker
                v-model="form.value2"
                align="right"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions"
              >
              </el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="投诉级别">
              <el-select v-model="form.region" placeholder="请选择活动区域">
                <el-option label="一级" value="shanghai"></el-option>
                <el-option label="二级" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12"
            ><el-form-item label="门诊日期">
              <el-date-picker
                v-model="form.value2"
                align="right"
                type="date"
                placeholder="选择日期"
                :picker-options="pickerOptions"
              >
              </el-date-picker> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="投诉对象搜索">
              <el-select
                v-model="value"
                multiple
                filterable
                remote
                reserve-keyword
                placeholder="请输入关键词"
                :remote-method="remoteMethod"
                :loading="loading"
              >
                <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="投诉对象显示">
              <div>{{ form.name }}</div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="投诉描述">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="投诉要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增投诉",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //投诉预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览投诉类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导投诉数量
      //预览投诉信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      //导入进度
      dractive: 1,
      // å¯¼å…¥å±•ç¤ºè¡¨å•
      uploadingData: {},
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "单选",
        },
        {
          value: 2,
          label: "多选",
        },
        {
          value: 3,
          label: "填空",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢æŠ•è¯‰åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹æŠ•è¯‰è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // æŠ•è¯‰çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增投诉";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/followvisit/discharge/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,897 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->

      <el-form
        :model="topqueryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
        label-width="98px"
      >
        <el-form-item label="任务名称">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="随访类型" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模版" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门诊随访状态" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="medium"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            plain
            icon="el-icon-edit"
            size="medium"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['system:user:edit']"
            >修改</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col>
        <el-col :span="19">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                plain
                icon="el-icon-download"
                size="medium"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
                >导出</el-button
              >
            </div>
          </div>
        </el-col>
        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/执行失败</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-promotion"></i>开始执行</span
              ></el-button
            >
          </template>
        </el-table-column>
        <el-table-column
          label="任务详情"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-xq"
                ><i class="el-icon-s-data"></i>详情</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-order"></i>报表</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>删除</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  color: #2ba05c;
}
.button-xq {
  font-weight: 500;
  color: #409eff;
}
.button-sc {
  font-weight: 500;
  color: #dd302a;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/followvisit/linem/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,798 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col>
        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/执行失败</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-promotion"></i>开始执行</span
              ></el-button
            >
          </template>
        </el-table-column>
        <el-table-column
          label="任务详情"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-xq"
                ><i class="el-icon-s-data"></i>详情</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-order"></i>报表</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>删除</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  color: #2ba05c;
}
.button-xq {
  font-weight: 500;
  color: #409eff;
}
.button-sc {
  font-weight: 500;
  color: #dd302a;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/followvisit/outpatient/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,897 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->

      <el-form
        :model="topqueryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
        label-width="98px"
      >
        <el-form-item label="任务名称">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="随访类型" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模版" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门诊随访状态" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="medium"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            plain
            icon="el-icon-edit"
            size="medium"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['system:user:edit']"
            >修改</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col>
        <el-col :span="19">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                plain
                icon="el-icon-download"
                size="medium"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
                >导出</el-button
              >
            </div>
          </div>
        </el-col>
        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/执行失败</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-promotion"></i>开始执行</span
              ></el-button
            >
          </template>
        </el-table-column>
        <el-table-column
          label="任务详情"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-xq"
                ><i class="el-icon-s-data"></i>详情</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-order"></i>报表</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>删除</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  color: #2ba05c;
}
.button-xq {
  font-weight: 500;
  color: #409eff;
}
.button-sc {
  font-weight: 500;
  color: #dd302a;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/followvisit/record/detailpage/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,136 @@
<template>
  <div class="Followupdetailspage">
    <div class="Followuserinfo">
      <div class="userinfo-text">随访详情</div>
      <div class="userinfo-value">
        <span><i class="el-icon-user-solid"></i>吴龙</span><span>男</span
        ><span><i class="el-icon-user-solid"></i>13803963330</span
        ><span>出院时间：:2023-03-29 08:57:57</span>
      </div>
      <div><el-button type="success">随访后短信</el-button></div>
    </div>
    <div>
      <el-tabs type="border-card">
        <el-tab-pane>
          <span class="mulsz" slot="label"
            ><i class="el-icon-headset"></i> è¯­éŸ³è¯¦æƒ…1</span
          >
          <div class="borderdiv">
            <div>
              <div class="leftside">
                <i class="el-icon-phone-outline"></i><span>说撒啊小说</span>
              </div>
              <div class="offside">
                <i class="el-icon-user"></i>
                <div class="offside-value">
                  <el-input v-model="input"></el-input>
                  <el-radio v-model="radio" label="1">备选项</el-radio>
                  <el-radio v-model="radio" label="2">备选项2</el-radio>
                  <el-radio v-model="radio" label="3">备选项3</el-radio>
                  <el-radio v-model="radio" label="4">备选项4</el-radio>
                </div>
              </div>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane>
          <span class="mulsz" slot="label"
            ><i class="el-icon-headset"></i> è¯­éŸ³è¯¦æƒ…2</span
          >
          <div class="borderdiv">语音详情2</div>
        </el-tab-pane>
        <el-tab-pane>
          <span class="mulsz" slot="label"
            ><i class="el-icon-notebook-1"></i> è¯­éŸ³ä¿¡æ¯</span
          >
          <div class="borderdiv">语音信息</div>
        </el-tab-pane>
        <el-tab-pane>
          <span class="mulsz" slot="label"
            ><i class="el-icon-phone-outline"></i> å¤–呼信息</span
          >
          <div class="borderdiv">外呼信息</div>
        </el-tab-pane>
        <el-tab-pane>
          <span class="mulsz" slot="label"
            ><i class="el-icon-s-operation"></i> æ ‡ç­¾çŠ¶æ€</span
          >
          <div class="borderdiv">
            <el-radio v-model="radio" label="1">不处理</el-radio>
            <el-radio v-model="radio" label="2">继续跟踪</el-radio
            ><el-radio v-model="radio" label="3">通知医院就诊</el-radio>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      radio: "1",
      userid: "",
      input: "",
      radio: "2",
    };
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped>
.Followuserinfo {
  margin: 20px 10px;
  display: flex;
  align-items: center;
  .userinfo-text {
    font-size: 20px;
    margin-right: 20px;
  }
  .userinfo-value {
    color: rgb(15, 139, 211);
    span {
      margin-right: 20px;
    }
  }
}
.borderdiv {
  min-height: 60vh;
  font-size: 20px;
  padding: 30px;
  .leftside {
    margin-bottom: 30px;
    span {
      width: 400px;
      margin-left: 20px;
      padding: 10px;
      color: #fff;
      background: rgb(110, 196, 247);
      border-radius: 10px;
    }
  }
  .offside {
    display: flex;
    flex-direction: row-reverse;
    .offside-value {
      padding: 10px;
      background: rgb(217, 173, 253);
      border-radius: 10px;
      color: #fff;
      margin-right: 20px;
    }
  }
}
::v-deep.offside-value .el-radio__label {
  color: #fff;
}
.mulsz {
  font-size: 25px;
  margin-top: 20px;
}
</style>

 src/views/followvisit/record/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,1092 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->

      <el-form
        :model="topqueryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
        label-width="98px"
      >
        <el-form-item label="任务名称">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="随访类型" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模版" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门诊随访状态" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="medium"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <!-- <el-col :span="1.5">
          <el-button
            type="success"
            plain
            icon="el-icon-edit"
            size="medium"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['system:user:edit']"
            >修改</el-button
          >
        </el-col> -->
        <!-- <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col> -->
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                plain
                icon="el-icon-upload2"
                size="medium"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
                >导出</el-button
              >
            </div>
          </div>
        </el-col>
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="success"
                plain
                icon="el-icon-download"
                size="medium"
                @click="toleadExport"
                v-hasPermi="['system:user:export']"
                >导入</el-button
              >
            </div>
          </div>
        </el-col>
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="info"
                icon="el-icon-refresh"
                size="medium"
                @click="TaskReset"
                v-hasPermi="['system:user:export']"
                >任务重置</el-button
              >
            </div>
          </div>
        </el-col>
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="success"
                icon="el-icon-position"
                size="medium"
                @click="AllStarted"
                v-hasPermi="['system:user:export']"
                >全部开始</el-button
              >
            </div>
          </div>
        </el-col>
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                icon="el-icon-remove"
                size="medium"
                @click="AllStop"
                v-hasPermi="['system:user:export']"
                >全部停止</el-button
              >
            </div>
          </div>
        </el-col>
        <el-col :span="1.5">
          <div class="documentf">
            <div class="document">
              <el-button
                type="primary"
                icon="el-icon-remove"
                size="medium"
                @click="Sendtimesetting"
                v-hasPermi="['system:user:export']"
                >发送时间设置</el-button
              >
            </div>
          </div>
        </el-col>

        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/待审核</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>

        <el-table-column
          label="操作"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="followupvisit(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-promotion"></i>重新随访</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handlestop(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>停止</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="Seedetails(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-order"></i>查看详情</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
    <!-- ä¿®æ”¹å‘送时间对话框 -->
    <el-dialog
      title="发送时间设置"
      :visible.sync="modificationVisible"
      width="45%"
    >
      <div style="margin-bottom: 20px; color: red">
        ç»Ÿä¸€ä¿®æ”¹å½“天未发送的任务时间
      </div>

      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="120px"
        class="demo-ruleForm"
      >
        <el-form-item label="发送日期">
          <el-date-picker
            v-model="ruleForm.value1"
            type="date"
            placeholder="选择日期"
          >
          </el-date-picker>
        </el-form-item>

        <el-form-item label="时间段" prop="type">
          <el-checkbox-group v-model="ruleForm.type">
            <el-checkbox label="上午" name="type"></el-checkbox>
            <el-checkbox label="下午" name="type"></el-checkbox>
            <el-checkbox label="晚上" name="type"></el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <el-form-item label="上午时间区间" required>
          <el-time-picker
            is-range
            v-model="ruleForm.value2"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            placeholder="选择时间范围"
          >
          </el-time-picker>
        </el-form-item>
        <el-form-item label="下午时间区间" required>
          <el-time-picker
            is-range
            v-model="ruleForm.value3"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            placeholder="选择时间范围"
          >
          </el-time-picker>
        </el-form-item>
        <el-form-item label="晚上时间区间" required>
          <el-time-picker
            is-range
            v-model="ruleForm.value4"
            range-separator="至"
            start-placeholder="开始时间"
            end-placeholder="结束时间"
            placeholder="选择时间范围"
          >
          </el-time-picker>
        </el-form-item>
      </el-form>

      <span slot="footer" class="dialog-footer">
        <el-button @click="modificationVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="modificationVisible = false"
          >ç¡® å®š</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // ä¿®æ”¹å‘送时间对话框
      modificationVisible: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      ruleForm: {
        type: [],
      },
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    // handleUpdate(row) {
    //   this.reset();
    //   const userId = row.userId || this.ids;
    //   getUser(userId).then((response) => {
    //     this.form = response.data;
    //     this.postOptions = response.posts;
    //     this.roleOptions = response.roles;
    //     this.$set(this.form, "postIds", response.postIds);
    //     this.$set(this.form, "roleIds", response.roleIds);
    //     this.addalteropen = true;
    //     this.title = "修改用户";
    //     this.form.password = "";
    //   });
    // },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    // å…¨éƒ¨åœæ­¢
    AllStop() {
      this.$modal
        .confirm("是否停止全部任务？")
        .then(function () {
          return console.log("停止成功");
        })
        .then(() => {
          this.getList();
          this.$modal.msgWarning("停止成功");
        })
        .catch(() => {});
    },
    // å…¨éƒ¨å¼€å§‹
    AllStarted() {
      this.$modal
        .confirm("是否开启全部任务？")
        .then(function () {
          return console.log("开启成功");
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("开启成功");
        })
        .catch(() => {});
    },
    // ä»»åŠ¡é‡ç½®
    TaskReset() {
      this.$modal
        .confirm("是否重置选中的任务项？")
        .then(function () {
          return console.log("选中成功");
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("重置成功");
        })
        .catch(() => {});
    },
    // è®¾ç½®å‘送时间
    Sendtimesetting() {
      this.modificationVisible = true;
    },
    // è·³è½¬è¯¦æƒ…页
    Seedetails() {
      this.$router.push({
        path: "/followvisit/record/detailpage/",
        query: { id: "1" },
      });
    },
    // å¯¼å…¥æŒ‰é’®
    toleadExport() {},
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  // width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  background-color: #2ba05c;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}
.button-xq {
  font-weight: 500;
  background-color: #409eff;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}
.button-sc {
  font-weight: 500;
  background-color: #dd302a;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

// é€‰é¡¹å­—体放大
// ::v-deep.el-checkbox-group {
//   span {
//     font-size: 24px;
//   }
// }
</style>

 src/views/followvisit/satisfaction/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,897 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->

      <el-form
        :model="topqueryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
        label-width="98px"
      >
        <el-form-item label="任务名称">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="随访类型" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模版" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门诊随访状态" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="medium"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            plain
            icon="el-icon-edit"
            size="medium"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['system:user:edit']"
            >修改</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col>
        <el-col :span="19">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                plain
                icon="el-icon-download"
                size="medium"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
                >导出</el-button
              >
            </div>
          </div>
        </el-col>
        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/执行失败</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-promotion"></i>开始执行</span
              ></el-button
            >
          </template>
        </el-table-column>
        <el-table-column
          label="任务详情"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-xq"
                ><i class="el-icon-s-data"></i>详情</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-order"></i>报表</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>删除</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  color: #2ba05c;
}
.button-xq {
  font-weight: 500;
  color: #409eff;
}
.button-sc {
  font-weight: 500;
  color: #dd302a;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/followvisit/tasklist/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,897 @@
<template>
  <div class="app-container">
    <el-row :gutter="20">
      <!--用户数据-->

      <el-form
        :model="topqueryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
        label-width="98px"
      >
        <el-form-item label="任务名称">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核人">
          <el-input v-model="topqueryParams.name"></el-input>
        </el-form-item>
        <el-form-item label="审核时间">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="随访类型" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模版" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="门诊随访状态" prop="status">
          <el-select v-model="topqueryParams.topic" placeholder="请选择">
            <el-option
              v-for="item in topicoptions"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button
            type="primary"
            icon="el-icon-search"
            size="medium"
            @click="handleQuery"
            >搜索</el-button
          >
          <el-button icon="el-icon-refresh" size="medium" @click="resetQuery"
            >重置</el-button
          >
        </el-form-item>
      </el-form>
      <el-divider></el-divider>
      <el-row :gutter="10" class="mb8">
        <el-col :span="1.5">
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="medium"
            @click="handleAdd"
            v-hasPermi="['system:user:add']"
            >新增</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="success"
            plain
            icon="el-icon-edit"
            size="medium"
            :disabled="single"
            @click="handleUpdate"
            v-hasPermi="['system:user:edit']"
            >修改</el-button
          >
        </el-col>
        <el-col :span="1.5">
          <el-button
            type="danger"
            plain
            icon="el-icon-delete"
            size="medium"
            :disabled="multiple"
            @click="handleDelete"
            v-hasPermi="['system:user:remove']"
            >删除</el-button
          >
        </el-col>
        <el-col :span="19">
          <div class="documentf">
            <div class="document">
              <el-button
                type="warning"
                plain
                icon="el-icon-download"
                size="medium"
                @click="handleExport"
                v-hasPermi="['system:user:export']"
                >导出</el-button
              >
            </div>
          </div>
        </el-col>
        <!-- <el-col :span="1.5"> </el-col> -->
      </el-row>
      <!-- <right-toolbar
              :showSearch.sync="showSearch"
              @queryTable="getList"
              :columns="columns"
            ></right-toolbar> -->
      <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"
        />

        <el-table-column
          label="任务名称"
          align="center"
          sortable
          key="userName"
          prop="userName"
          :show-overflow-tooltip="true"
        />
        <el-table-column
          label="服务模板"
          align="center"
          key="types"
          prop="types"
        />
        <el-table-column
          label="创建日期"
          align="center"
          key="nickName"
          prop="nickName"
        />
        <el-table-column
          label="待执行/总数"
          align="center"
          key="phonenumber"
          prop="phonenumber"
          width="120"
        >
          <template slot-scope="scope">
            <span style="margin-left: 10px"
              >{{ scope.row.date }}/{{ scope.row.data }}</span
            >
          </template>
        </el-table-column>

        <el-table-column
          label="执行状态"
          align="center"
          key="topicnumber"
          prop="topicnumber"
          width="120"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <div>执行完成/执行失败</div>
          </template>
        </el-table-column>
        <el-table-column
          label="审核人"
          align="center"
          key="topicnumberaa"
          prop="topicnumberaa"
          sortable
          width="120"
          :show-overflow-tooltip="true"
        />

        <el-table-column
          label="审核时间"
          sortable
          align="center"
          prop="createTime"
          width="160"
        >
          <template slot-scope="scope">
            <span>{{ parseTime(scope.row.createTime) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-zx"
                ><i class="el-icon-s-promotion"></i>开始执行</span
              ></el-button
            >
          </template>
        </el-table-column>
        <el-table-column
          label="任务详情"
          align="center"
          width="200"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-xq"
                ><i class="el-icon-s-data"></i>详情</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-bb"
                ><i class="el-icon-s-order"></i>报表</span
              ></el-button
            >
            <el-button
              size="medium"
              type="text"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['system:user:edit']"
              ><span class="button-sc"
                ><i class="el-icon-delete"></i>删除</span
              ></el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="topqueryParams.pageNum"
        :limit.sync="topqueryParams.pageSize"
        @pagination="getList"
      />
    </el-row>
    <!-- æ·»åŠ æˆ–修改门诊随访对话框 -->
    <el-dialog
      :title="title"
      :visible.sync="addalteropen"
      width="700px"
      append-to-body
    >
      <el-form ref="form" :model="form" label-width="100px">
        <el-row :gutter="20">
          <el-col :span="12"
            ><el-form-item label="任务名称">
              <el-input v-model="form.name"></el-input> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="所属科室">
              <el-select v-model="form.region" placeholder="请选择科室">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item></el-col
        ></el-row>
        <el-row :gutter="20">
          <el-col :span="24"
            ><el-form-item label="随访类型">
              <el-select v-model="form.region" placeholder="请选择随访类型">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select> </el-form-item
          ></el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="服务模块">
              <el-select v-model="form.region" placeholder="请选择模块">
                <el-option label="区域一" value="shanghai"></el-option>
                <el-option label="区域二" value="beijing"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="门诊随访要求">
              <el-input type="textarea" v-model="form.desc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">提 äº¤</el-button>
        <el-button @click="cancel">返 å›ž</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
} from "@/api/system/user";
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"],
  components: { Treeselect },
  data() {
    return {
      // é®ç½©å±‚
      loading: true,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: null,
      // å¼¹å‡ºå±‚标题
      title: "新增门诊随访",
      // æ˜¯å¦æ˜¾ç¤ºä¿®æ”¹ã€æ·»åŠ å¼¹å‡ºå±‚
      addalteropen: false,
      // éƒ¨é—¨åç§°
      deptName: undefined,
      // é»˜è®¤å¯†ç 
      initPassword: undefined,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      dynamicTags: ["选项一", "选项二", "选项三"], //选项
      inputVisible: false,
      inputValue: "",
      previewVisible: false, //门诊随访预览弹框
      radio: "",
      radios: [],
      previewtype: 2, //预览门诊随访类型
      total: 0, // æ€»æ¡æ•°
      ImportQuantity: 999, //导门诊随访数量
      //预览门诊随访信息
      previewvalue: {
        username: "这个医生对你怎么样",
      },
      value: [],
      list: [],
      loading: false,
      states: [
        "Alabama",
        "Alaska",
        "Arizona",
        "Arkansas",
        "California",
        "Colorado",
        "Connecticut",
        "Delaware",
        "Florida",
        "Georgia",
        "Hawaii",
        "Idaho",
        "Illinois",
        "Indiana",
        "Iowa",
        "Kansas",
        "Kentucky",
        "Louisiana",
        "Maine",
        "Maryland",
        "Massachusetts",
        "Michigan",
        "Minnesota",
        "Mississippi",
        "Missouri",
        "Montana",
        "Nebraska",
        "Nevada",
        "New Hampshire",
        "New Jersey",
        "New Mexico",
        "New York",
        "North Carolina",
        "North Dakota",
        "Ohio",
        "Oklahoma",
        "Oregon",
        "Pennsylvania",
        "Rhode Island",
        "South Carolina",
        "South Dakota",
        "Tennessee",
        "Texas",
        "Utah",
        "Vermont",
        "Virginia",
        "Washington",
        "West Virginia",
        "Wisconsin",
        "Wyoming",
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // è¡¨å•å‚æ•°
      form: {
        phonenumber: "",
        totagid: "",
        types: "",
        nickName: "",
        qystatus: "",
        btstatus: "",
      },
      // æŸ¥è¯¢å‚æ•°
      topqueryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        tagid: undefined,
        topic: undefined,
      },
      propss: { multiple: true },
      options: [],

      topicoptions: [
        {
          value: 1,
          label: "待审核",
        },
        {
          value: 2,
          label: "执行中",
        },
        {
          value: 3,
          label: "执行完成",
        },
        {
          value: 4,
          label: "已停止",
        },
      ],
      // è¡¨å•æ ¡éªŒ
      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: {},
  created() {
    this.getList();
    this.getConfigKey("sys.user.initPassword").then((response) => {
      this.initPassword = response.msg;
    });
  },
  // æœç´¢
  mounted() {
    this.list = this.states.map((item) => {
      return { value: `value:${item}`, label: `label:${item}` };
    });
  },
  methods: {
    /** æŸ¥è¯¢é—¨è¯Šéšè®¿åˆ—表 */
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.topqueryParams, this.dateRange)).then(
        (response) => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // æŸ¥çœ‹é—¨è¯Šéšè®¿è¯¦æƒ…
    Referencequestion(row) {
      this.previewVisible = true;
    },
    // æ·»åŠ å¼¹æ¡†æœç´¢
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.list.filter((item) => {
            return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = [];
      }
    },
    // é—¨è¯Šéšè®¿çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    // å–消按钮
    cancel() {
      this.addalteropen = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.topqueryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.topqueryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    //删除选项
    handleClose(tag) {
      this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
    },
    //触发新增输入
    showInput() {
      this.inputVisible = true;
      this.$nextTick((_) => {
        this.$refs.saveTagInput.$refs.input.focus();
      });
    },
    //获取失去焦点触发
    handleInputConfirm() {
      let inputValue = this.inputValue;
      if (inputValue) {
        this.dynamicTags.push(inputValue);
      }
      this.inputVisible = false;
      this.inputValue = "";
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.addalteropen = true;
      // getUser().then((response) => {
      //   this.postOptions = response.posts;
      //   this.roleOptions = response.roles;
      //   this.title = "新增门诊随访";
      //   this.form.password = this.initPassword;
      // });
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then((response) => {
        this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.$set(this.form, "postIds", response.postIds);
        this.$set(this.form, "roleIds", response.roleIds);
        this.addalteropen = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },
    /** é‡ç½®å¯†ç æŒ‰é’®æ“ä½œ */
    handleResetPwd(row) {
      this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        closeOnClickModal: false,
        inputPattern: /^.{5,20}$/,
        inputErrorMessage: "用户密码长度必须介于 5 å’Œ 20 ä¹‹é—´",
      })
        .then(({ value }) => {
          resetUserPwd(row.userId, value).then((response) => {
            this.$modal.msgSuccess("修改成功，新密码是：" + value);
          });
        })
        .catch(() => {});
    },

    /** æäº¤æŒ‰é’® */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            updateUser(this.form).then((response) => {
              this.$modal.msgSuccess("修改成功");
              this.open = false;
              this.getList();
            });
          } else {
            addUser(this.form).then((response) => {
              this.$modal.msgSuccess("新增成功");
              this.open = false;
              this.getList();
            });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "system/user/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.el-button--primary.is-plain {
  color: #ffffff;
  background: #409eff;
  border-color: #4fabe9;
}

.document {
  width: 100px;
  height: 50px;
}

.documentf {
  display: flex;
  justify-content: flex-end;
}

.download {
  text-align: center;

  .el-upload__tip {
    font-size: 23px;
  }

  .el-upload__text {
    font-size: 23px;
  }
}

.uploading {
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #ffffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.el-tag + .el-tag {
  margin-left: 10px;
}

.button-new-tag {
  margin-left: 10px;
  height: 32px;
  line-height: 30px;
  padding-top: 0;
  padding-bottom: 0;
}

.input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}

.drexamine {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: #daeaf5;

  img {
    width: 100px;
    height: 100px;
  }
}

.qrcode-dialo {
  // text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);

  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;

    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.button-bb {
  font-weight: 500;
  color: #2ba05c;
}
.button-xq {
  font-weight: 500;
  color: #409eff;
}
.button-sc {
  font-weight: 500;
  color: #dd302a;
}
.button-zx {
  background: #4fabe9;
  padding: 5px;
  border-radius: 1px;
  color: #ffffff;
}

::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}

::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/views/login.vue

@@ -36,7 +36,7 @@
          />
        </el-input>
      </el-form-item>
      <el-form-item prop="code" v-if="captchaEnabled">
      <!-- <el-form-item prop="code" v-if="captchaEnabled">
        <el-input
          v-model="loginForm.code"
          auto-complete="off"
@@ -53,7 +53,7 @@
        <div class="login-code">
          <img :src="codeUrl" @click="getCode" class="login-code-img" />
        </div>
      </el-form-item>
      </el-form-item> -->
      <el-checkbox
        v-model="loginForm.rememberMe"
        style="margin: 0px 0px 25px 0px"
@@ -108,7 +108,7 @@
        password: [
          { required: true, trigger: "blur", message: "请输入您的密码" },
        ],
        code: [{ required: true, trigger: "change", message: "请输入验证码" }],
        // code: [{ required: true, trigger: "change", message: "请输入验证码" }],
      },
      loading: false,
      // éªŒè¯ç å¼€å…³
@@ -133,6 +133,7 @@
  methods: {
    getCode() {
      getCodeImg().then((res) => {
        console.log(res);
        this.captchaEnabled =
          res.captchaEnabled === undefined ? true : res.captchaEnabled;
        if (this.captchaEnabled) {

 src/views/patient/follow/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>患者回访</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/patient/physical/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>体检通知</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/patient/propaganda/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>宣教服务</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/patient/questionnaire/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>问卷服务</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/patient/review/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>复查通知</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/patient/servefn/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,27 @@
<template>
  <div>
患者服务
  </div>
</template>

<script>
export default {
  data () {
    return {

    }
  },

  created () {

  },

  methods: {

  }
}
</script>

<style lang='scss' scoped>

</style>

 src/views/patient/subsequent/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>复诊通知</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/sfstatistics/Voicedetail/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,379 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">复查统计 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">复诊统计 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <div class="viewbox">
      <div class="title-bot">
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          label-width="98px"
        >
          <el-form-item prop="userName">
            <el-select
              v-model="queryParams.value1"
              placeholder="默认按月份暂时"
            >
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="投诉提交时间">
            <el-date-picker
              v-model="queryParams.dateRange"
              style="width: 240px"
              value-format="yyyy-MM-dd"
              type="daterange"
              range-separator="-"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="科室：" prop="userName">
            <el-select v-model="queryParams.value2" placeholder="请选择">
              <el-option
                v-for="item in ksoptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="管理方案：" prop="userName">
            <el-select v-model="queryParams.value3" placeholder="请选择">
              <el-option
                v-for="item in gloptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </div>
      <div class="viewhez">
        <div
          id="fucazCharts"
          class="sontwoactiveNamecaz"
          style="width: 800px; height: 800px"
        ></div>
        <div
          id="fucabCharts"
          class="sontwoactiveNamecab"
          style="width: 1300px; height: 800px"
        ></div>
      </div>
    </div>
  </div>
</template>

<script>
import Treeselect from "@riophae/vue-treeselect";
import * as echarts from "echarts";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "Local", //顶部选择
      fucazCharts: {},
      fucabCharts: {},
      queryParams: {},
      options: [
        {
          value: 1,
          label: "按月份",
        },
        {
          value: 2,
          label: "按季度",
        },
        {
          value: 3,
          label: "按年",
        },
      ],
      ksoptions: [
        {
          value: 1,
          label: "骨科",
        },
        {
          value: 2,
          label: "心脏科",
        },
        {
          value: 3,
          label: "内分泌科",
        },
      ],
      gloptions: [
        {
          value: 4,
          label: "一号",
        },
        {
          value: 2,
          label: "二号",
        },
        {
          value: 3,
          label: "三号",
        },
        {
          value: 1,
          label: "无",
        },
      ],
    };
  },
  watch: {},
  created() {},
  mounted() {
    this.fucazCharts = document.getElementById("fucazCharts");
    this.fucabCharts = document.getElementById("fucabCharts");

    console.log(this.fucazCharts);
    console.log(this.fucabCharts);

    this.fucazChartsInit();
    this.fucabChartsInit();
  },

  methods: {
    // é¥¼å›¾
    fucazChartsInit() {
      var fucazCharts = echarts.init(this.fucazCharts);
      console.log(fucazCharts);
      var option = {
        tooltip: {
          trigger: "item",
        },
        legend: {
          top: "5%",
          left: "center",
        },
        series: [
          {
            name: "原因归属",
            type: "pie",
            radius: ["40%", "70%"],
            avoidLabelOverlap: false,
            itemStyle: {
              borderRadius: 10,
              borderColor: "#fff",
              borderWidth: 2,
            },
            label: {
              show: false,
              formatter(param) {
                // correct the percentage
                return param.name + " (" + param.percent * 2 + "%)";
              },
              position: "center",
            },
            emphasis: {
              label: {
                show: true,
                fontSize: 40,
                fontWeight: "bold",
              },
            },
            labelLine: {
              show: false,
            },
            data: [
              { value: 1048, name: "不需要复诊" },
              { value: 735, name: "没有意义" },
              { value: 580, name: "不知道时间" },
              { value: 484, name: "经济原因" },
              { value: 300, name: "忘记复诊" },
              { value: 200, name: "不方便来院复诊" },
              { value: 200, name: "其他医院复诊" },
              { value: 100, name: "其他" },
            ],
          },
        ],
      };
      // ä½¿ç”¨åˆšæŒ‡å®šçš„配置项和数据显示图表。
      fucazCharts.setOption(option);
    },
    fucabChartsInit() {
      var fucabCharts = echarts.init(this.fucabCharts);
      console.log(fucabCharts);
      var option = {
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "cross",
            crossStyle: {
              color: "#999",
            },
          },
        },
        toolbox: {
          feature: {
            dataView: { show: true, readOnly: false },
            magicType: { show: true, type: ["line", "bar"] },
            restore: { show: true },
            saveAsImage: { show: true },
          },
        },
        legend: {
          data: ["未复诊数", "及时复诊数", "及时复诊率"],
        },
        xAxis: [
          {
            type: "category",
            data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
            axisPointer: {
              type: "shadow",
            },
          },
        ],
        yAxis: [
          {
            type: "value",
            name: "人数",
            min: 0,
            max: 250,
            interval: 50,
            axisLabel: {
              formatter: "{value} ",
            },
          },
          {
            type: "value",
            name: "百分比",
            min: 0,
            max: 25,
            interval: 5,
            axisLabel: {
              formatter: "{value} %",
            },
          },
        ],
        series: [
          {
            name: "未复诊数",
            type: "bar",
            tooltip: {
              valueFormatter: function (value) {
                return value + " ";
              },
            },
            data: [
              47.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4,
              3.3,
            ],
          },
          {
            name: "及时复诊数",
            type: "bar",
            tooltip: {
              valueFormatter: function (value) {
                return value + " ";
              },
            },
            data: [
              66.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0,
              2.3,
            ],
          },
          {
            name: "及时复诊率",
            type: "line",
            yAxisIndex: 1,
            tooltip: {
              valueFormatter: function (value) {
                return value + " %";
              },
            },
            data: [
              7.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2,
            ],
          },
        ],
      };
      // ä½¿ç”¨åˆšæŒ‡å®šçš„配置项和数据显示图表。
      fucabCharts.setOption(option);
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
}

::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  text-align: left;
  font-size: 20px;
}

.leftvlue {
  //   display: flex;
  //   flex: 1;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
.viewbox {
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  // height: 300px;
  margin-top: 20px;
  .title-bot {
    padding: 20px;
  }
}
.viewhez {
  display: flex;
  overflow: hidden;
}
</style>

 src/views/sfstatistics/analyse/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,107 @@
<template>
  <div class="indexanalysis">
    <div class="analysis-top">
      <div class="title-top">查询条件</div>
      <div class="value">
        <el-form ref="form" :model="form" label-width="120px">
          <el-form-item label="选择指标类型">
            <el-select v-model="value" filterable placeholder="请选择">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div class="formindex">
      <el-table :data="tableData" border style="width: 100%">
        <el-table-column prop="date" label="指标类型"> </el-table-column>
        <el-table-column prop="name" label="指标名称"> </el-table-column>
        <el-table-column prop="address" label="出现次数"> </el-table-column>
        <el-table-column prop="times" label="指标类型出现次数">
        </el-table-column>
        <el-table-column prop="proportion" label="占比"> </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  name: "indexanalysis",
  data() {
    return {
      options: [
        {
          value: "选项1",
          label: "发热有无",
        },
        {
          value: "选项2",
          label: "咳嗽有无",
        },
        {
          value: "选项3",
          label: "服药后不良反应",
        },
      ],
      tableData: [
        {
          date: "发热有无",
          name: "有",
          address: 1,
          times: 2,
          proportion: "50%",
        },
        {
          date: "发热有无",
          name: "无",
          address: 1,
          times: 2,
          proportion: "50%",
        },
        {
          date: "发热有无",
          name: "其他",
          address: 0,
          times: 2,
          proportion: "0%",
        },
      ],
    };
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped>
.analysis-top {
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  margin: 15px;
  .title-top {
    background-color: #00bbd3;
    color: #fff;
    padding: 10px 20px;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 20px;
  }
}
.formindex {
  margin: 0 15px;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  padding: 20px;
}
</style>

 src/views/sfstatistics/percentage/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,884 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <div class="sidecolumn-top">
        <div class="top-wj">患者来源</div>
      </div>

      <div class="bottom-fl">
        <el-tabs
          tab-position="right"
          v-model="activeName"
          @tab-click="handleClick"
        >
          <el-tab-pane label="全部" name="first"></el-tab-pane>
          <el-tab-pane label="住院" name="bhospitalized"></el-tab-pane>
          <el-tab-pane label="在院" name="Inhospital"></el-tab-pane>
          <el-tab-pane label="门诊" name="outpatient"></el-tab-pane>
          <el-tab-pane label="体检" name="physical"></el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">按出院病区统计 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">按出院科室统计 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--标签数据-->
          <el-col :span="24" :xs="24">
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="98px"
            >
              <el-form-item label="医院" prop="userName">
                <el-select v-model="queryParams.value1" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院病区" prop="userName">
                <el-select v-model="queryParams.value2" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="管理方案" prop="userName">
                <el-select v-model="queryParams.value3" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime1"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptionsa"
                >
                </el-date-picker>
              </el-form-item>
              <el-form-item label="计划随访日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime2"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
              </el-form-item>

              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="medium"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="medium"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="medium"
                  @click="addladeltag"
                  v-hasPermi="['system:user:add']"
                  >新增</el-button
                >
              </el-col>

              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="medium"
                  :disabled="multiple"
                  @click="handleDelete"
                  v-hasPermi="['system:user:remove']"
                  >删除</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <div class="documentf">
                  <div class="document">
                    <el-button
                      type="warning"
                      plain
                      icon="el-icon-download"
                      size="medium"
                      @click="handleExport"
                      v-hasPermi="['system:user:export']"
                      >导出</el-button
                    >
                  </div>
                </div>
              </el-col>

              <!-- <el-col :span="1.5"> </el-col> -->
            </el-row>
            <!-- <right-toolbar
          :showSearch.sync="showSearch"
          @queryTable="getList"
          :columns="columns"
        ></right-toolbar> -->
            <el-table
              v-loading="loading"
              :data="userList"
              :border="true"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="50" align="center" />
              <el-table-column
                fixed
                label="序号"
                align="center"
                key="tagid"
                prop="tagid"
                width="50"
              />
              <el-table-column
                fixed
                label="出院病区"
                align="center"
                key="tagname"
                prop="tagname"
                width="100"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="应随访数"
                align="center"
                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="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="随访完成率"
                align="center"
                key="isupload"
                prop="isupload"
              >
              </el-table-column>
              <el-table-column
                label="AI外呼次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="微信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="短信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="人工随访次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="失访数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="失访率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="失访率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="异常总数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="总异常率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="回复异常数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="回复异常及时处理数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>
              <el-table-column
                label="回复异常及时处理率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
              >
              </el-table-column>

              <!-- <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="handleUpdate(scope.row)"
                    v-hasPermi="['system:user:edit']"
                    ><span class="button-textxg"
                      ><i class="el-icon-edit"></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"
            />
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
import {
  toamendtag,
  addapitag,
  detailstag,
  deletetag,
  changetagcategory,
  toamendtagcategory,
  addtagcategory,
  deletetagcategory,
  listtag,
  tagclassifylist,
} from "@/api/system/label";

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "Local", //顶部选择
      activeName: "first", //侧边选择
      // é®ç½©å±‚
      loading: false,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      idds: "", //分类id
      // æ€»æ¡æ•°
      total: 0,
      amendtag: false, //是否修改类别
      lstamendtag: false, //是否修改标签
      scavisible: false, //删除弹框
      deleteVisible: false, //分类删除弹框
      deletefenl: "高血压", //删除项
      //修改添加标签弹框数据
      tagform: {
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
      },
      classifyform: {
        categoryname: "",
      },
      // æ ‡ç­¾è¡¨æ ¼æ•°æ®
      userList: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      forms: {
        name: "",
      },
      numberlb: 22,
      dialogFormVisible: false, //添加、修改类别弹框
      lstamendtagVisible: false, //添加、修改标签弹框
      goQRCodeVisible: false, //二维码弹框
      sidecolumnval: "", //类别搜索
      propss: { multiple: true },
      topqueryParams: {}, //导出筛选条件
      options: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 3600 * 1000 * 24;
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      pickerOptionsa: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // æŸ¥è¯¢æ ‡ç­¾åˆ—表参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        tagname: undefined,
        tagdescription: undefined,
      },
      // åˆ—信息
      columns: [
        { key: 0, label: `标签编号`, visible: true },
        { key: 1, label: `标签名称`, visible: true },
        { key: 2, label: `标签昵称`, visible: true },
        { key: 3, label: `部门`, visible: true },
        { key: 4, label: `手机号码`, visible: true },
        { key: 5, label: `状态`, visible: true },
        { 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",
      //     },
      //   ],
      // },
    };
  },
  watch: {},
  created() {
    this.getList();
    this.gitclasify();
  },

  methods: {
    /** æŸ¥è¯¢æ ‡ç­¾åˆ—表 */
    getList() {
      listtag(this.addDateRange(this.queryParams)).then((response) => {
        console.log(response);
        this.total = response.total;
        this.userList = response.rows;
      });
    },
    /** ä¿®æ”¹æ ‡ç­¾ */
    handleUpdate(row) {
      console.log(row, "修改标签");
      this.lstamendtagVisible = true;
      this.lstamendtag = true;
      this.tagform = {
        isupload: row.isupload,
        tagname: row.tagname,
        tagcategoryid: row.tagcategoryid,
        tagdescription: row.tagdescription,
        tagid: row.tagid,
      };
    },
    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: "",
      };
    },

    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    // æ ‡ç­¾çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      console.log(row.isupload);
      let text = row.isupload === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.tagname + '"标签吗？')
        .then(function () {
          return changetagcategory(row.tagid, row.isupload);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.isupload = row.isupload === "0" ? "1" : "0";
        });
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.tagname = "";
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.tagid);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },

    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      console.log(row, "删除弹窗");
      const tagids = row.tagid || this.ids;
      console.log(tagids);
      const tagname = row.tagname;
      this.$modal
        .confirm(
          tagname
            ? '是否确认删除标签名称为"' + tagname + '"的数据项？'
            : "是否确认删除选中的数据项？"
        )
        .then(function () {
          return deletetag(tagids);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "base/tag/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 180px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .sidecolumn-top {
    display: flex;
    justify-content: space-between;
    .top-wj {
      font-size: 20px;
    }
    .top-tj {
      font-size: 18px;

      color: rgb(0, 89, 255);
      cursor: pointer;
    }
  }
  .center-ss {
    margin-top: 30px;
    .input-with-select {
      height: 40px !important;
    }
  }
  .bottom-fl {
    margin-top: 30px;
    display: center !important;
  }
}
.qrcode-dialo {
  text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .qrcode-text {
    font-size: 20px;
    span {
      margin-left: 20px;
    }
  }
  .qrcode-img {
    width: 300px;
    height: 400px;
  }
}
::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  text-align: left;
  font-size: 20px;
}

.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
.document {
  width: 100px;
  height: 50px;
}
.documentf {
  display: flex;
  justify-content: flex-end;
}
.button-text {
  color: rgb(70, 204, 238);
}
.button-textck {
  color: rgb(39, 167, 67);
}
.button-textxg {
  color: rgb(35, 81, 233);
}
.button-textsc {
  color: rgb(235, 23, 23);
}
</style>

 src/views/sfstatistics/propaganda/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,951 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <div class="sidecolumn-top">
        <div class="top-wj">患者来源</div>
      </div>

      <div class="bottom-fl">
        <el-tabs
          tab-position="right"
          v-model="activeName"
          @tab-click="handleClick"
        >
          <el-tab-pane label="全部" name="first"></el-tab-pane>
          <el-tab-pane label="住院" name="bhospitalized"></el-tab-pane>
          <el-tab-pane label="在院" name="Inhospital"></el-tab-pane>
          <el-tab-pane label="门诊" name="outpatient"></el-tab-pane>
          <el-tab-pane label="体检" name="physical"></el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">按出院病区统计 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">按出院科室统计 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--标签数据-->
          <el-col :span="24" :xs="24">
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="98px"
            >
              <el-form-item label="医院" prop="userName">
                <el-select
                  v-model="queryParams.value1"
                  placeholder="默认是该账号所属医院"
                >
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院病区" prop="userName">
                <el-select v-model="queryParams.value2" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="管理方案" prop="userName">
                <el-select v-model="queryParams.value3" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime1"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptionsa"
                >
                </el-date-picker>
              </el-form-item>
              <el-form-item label="计划执行日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime2"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
              </el-form-item>
              <el-form-item label="实际完成日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime2"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
              </el-form-item>

              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="medium"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="medium"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="medium"
                  @click="addladeltag"
                  v-hasPermi="['system:user:add']"
                  >新增</el-button
                >
              </el-col>

              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="medium"
                  :disabled="multiple"
                  @click="handleDelete"
                  v-hasPermi="['system:user:remove']"
                  >删除</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <div class="documentf">
                  <div class="document">
                    <el-button
                      type="warning"
                      plain
                      icon="el-icon-download"
                      size="medium"
                      @click="handleExport"
                      v-hasPermi="['system:user:export']"
                      >导出</el-button
                    >
                  </div>
                </div>
              </el-col>

              <!-- <el-col :span="1.5"> </el-col> -->
            </el-row>
            <!-- <right-toolbar
          :showSearch.sync="showSearch"
          @queryTable="getList"
          :columns="columns"
        ></right-toolbar> -->
            <el-table
              v-loading="loading"
              :data="userList"
              :border="true"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="50" align="center" />
              <el-table-column
                fixed
                label="序号"
                align="center"
                key="tagid"
                prop="tagid"
                width="50"
              />
              <el-table-column
                fixed
                label="出院病区"
                align="center"
                key="tagname"
                prop="tagname"
                width="100"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="宣教"
                align="center"
                key="updateTime"
                prop="updateTime"
              >
              </el-table-column>

              <el-table-column
                label="宣教更新日期"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="110"
              >
              </el-table-column>
              <el-table-column
                label="管理方案"
                align="center"
                key="isupload"
                prop="isupload"
              >
              </el-table-column>
              <el-table-column
                label="随访任务数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="随访完成率"
                align="center"
                key="isupload"
                prop="isupload"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="AI外呼次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="微信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="短信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="人工随访次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>

              <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="handleUpdate(scope.row)"
                    v-hasPermi="['system:user:edit']"
                    ><span class="button-textxg"
                      ><i class="el-icon-s-data"></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-share"></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"
            />
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- å•é¢˜å±•ç¤ºå¼¹æ¡† -->
    <el-dialog :visible.sync="topicVisible" width="45%">
      <div class="topicdia">
        <div class="top-text">{{ topicvalue.name }}</div>
        <div class="top-mintext">随访完成数{{ topicvalue.number }}</div>
        <div style="overflow-x: hidden; overflow-y: auto; max-height: 65vh">
          <div class="ttaabbcc" v-for="item in topiclist" :key="item.name">
            <div class="describe">
              ç¬¬{{ item.number }}题： {{ item.name }}?<span
                >[{{ item.type == 1 ? "单选题" : "多选题" }}]</span
              >
            </div>
            <div>
              <el-table :data="tableData" style="width: 100%">
                <el-table-column prop="date" label="问题选项">
                </el-table-column>
                <el-table-column prop="name" label="选择人数">
                </el-table-column>
                <el-table-column prop="address" label="比例"> </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="topicVisible = false">关 é—­</el-button>
      </span>
    </el-dialog>
    <!-- ç»“果统计弹框 -->
    <el-dialog title="提示" :visible.sync="consequenceVisible" width="50%">
      <div class="topicdia">
        <div class="top-text" style="margin-bottom: 20px">宣教统计结果</div>
        <div>
          <el-table :data="tableData" style="width: 100%">
            <el-table-column prop="date" label="患者姓名"> </el-table-column>
            <el-table-column prop="namea" label="性别"> </el-table-column>
            <el-table-column prop="namec" label="年龄"> </el-table-column>
            <el-table-column prop="named" label="联系方式"> </el-table-column>
            <el-table-column prop="namee" label="计划执行时间" width="120">
            </el-table-column>
            <el-table-column prop="namex" label="实际完成时间" width="120">
            </el-table-column>
            <el-table-column prop="namez" label="完成方式"> </el-table-column>
            <el-table-column prop="nameh" label="宣教"> </el-table-column>
            <el-table-column prop="namej" label="得分"> </el-table-column>
            <!-- æˆªå–几列选项属性名维护数组遍历 -->
            <!-- <el-table-column prop="namet">
              <template slot="header" slot-scope="scope">
                <div>{{ scope.row.name }}<span>[单选题]</span></div>
              </template>
            </el-table-column> -->
          </el-table>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="consequenceVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="consequenceVisible = false"
          >ç¡® å®š</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  toamendtag,
  addapitag,
  deletetag,
  changetagcategory,
  listtag,
} from "@/api/system/label";

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "Local", //顶部选择
      activeName: "first",
      // é®ç½©å±‚
      loading: false,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      idds: "", //分类id
      // æ€»æ¡æ•°
      total: 0,
      lstamendtag: false, //是否修改标签
      topicVisible: false, //控制单题弹框
      consequenceVisible: false, //控制结果弹框
      //修改添加标签弹框数据
      tagform: {
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
      },
      topicvalue: {
        name: "骨科随访模版",
        number: 222,
      },
      classifyform: {
        categoryname: "",
      },
      topiclist: [
        {
          name: "您的身体康复情况如何",
          number: 1,
          type: 1,
        },
        {
          name: "您的饮食情况如何",
          number: 2,
          type: 2,
        },
        {
          name: "您的恢复情况如何",
          number: 3,
          type: 1,
        },
      ],
      tableData: [
        {
          date: "好",
          name: 12,
          address: "50%",
        },
        {
          date: "一般",
          name: 2,
          address: "6.2%",
        },
        {
          date: "å·®",
          name: 0,
          address: "0%",
        },
      ],
      // æ ‡ç­¾è¡¨æ ¼æ•°æ®
      userList: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      forms: {
        name: "",
      },
      numberlb: 22,
      dialogFormVisible: false, //添加、修改类别弹框
      lstamendtagVisible: false, //添加、修改标签弹框
      goQRCodeVisible: false, //二维码弹框
      sidecolumnval: "", //类别搜索
      propss: { multiple: true },
      topqueryParams: {}, //导出筛选条件
      options: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 3600 * 1000 * 24;
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      pickerOptionsa: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // æŸ¥è¯¢æ ‡ç­¾åˆ—表参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        tagname: undefined,
        tagdescription: undefined,
      },
      // åˆ—信息
      columns: [
        { key: 0, label: `标签编号`, visible: true },
        { key: 1, label: `标签名称`, visible: true },
        { key: 2, label: `标签昵称`, visible: true },
        { key: 3, label: `部门`, visible: true },
        { key: 4, label: `手机号码`, visible: true },
        { key: 5, label: `状态`, visible: true },
        { 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",
      //     },
      //   ],
      // },
    };
  },
  watch: {},
  created() {
    this.getList();
    this.gitclasify();
  },

  methods: {
    /** æŸ¥è¯¢æ ‡ç­¾åˆ—表 */
    getList() {
      listtag(this.addDateRange(this.queryParams)).then((response) => {
        console.log(response);
        this.total = response.total;
        this.userList = response.rows;
      });
    },
    /** ä¿®æ”¹æ ‡ç­¾ */
    handleUpdate(row) {
      console.log(row, "修改标签");
      this.lstamendtagVisible = true;
      this.lstamendtag = true;
      this.tagform = {
        isupload: row.isupload,
        tagname: row.tagname,
        tagcategoryid: row.tagcategoryid,
        tagdescription: row.tagdescription,
        tagid: row.tagid,
      };
    },
    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: "",
      };
    },

    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    //单题弹框
    handleUpdate() {
      this.topicVisible = true;
    },
    //结果弹框
    handleDelete() {
      this.consequenceVisible = true;
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.tagname = "";
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.tagid);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },

    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "base/tag/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 180px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .sidecolumn-top {
    display: flex;
    justify-content: space-between;
    .top-wj {
      font-size: 20px;
    }
    .top-tj {
      font-size: 18px;

      color: rgb(0, 89, 255);
      cursor: pointer;
    }
  }
  .center-ss {
    margin-top: 30px;
    .input-with-select {
      height: 40px !important;
    }
  }
  .bottom-fl {
    margin-top: 30px;
    display: center !important;
  }
}
.topicdia {
  text-align: center;
  margin: 0 20px;

  // overflow: scroll;

  .top-text {
    font-size: 25px;
    font-weight: 600;
  }
  .top-mintext {
    color: #bdae25;
    font-size: 15px;
    margin: 10px 0;
  }
  .ttaabbcc {
    // background: #edf1f7;
    border: 1px solid #dcdfe6;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
      0 0 6px 0 rgba(0, 0, 0, 0.04);
    margin: 15px 0;
    margin-top: 30px;
    padding: 30px;
  }
  .describe {
    text-align: left;
    margin-bottom: 20px;
    span {
      color: rgb(23, 140, 235);
      margin-left: 5px;
    }
  }
}
::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  text-align: left;
  font-size: 20px;
}

.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
.document {
  width: 100px;
  height: 50px;
}
.documentf {
  display: flex;
  justify-content: flex-end;
}
.button-text {
  color: rgb(70, 204, 238);
}
.button-textck {
  color: rgb(39, 167, 67);
}
.button-textxg {
  font-size: 18px;
  color: rgb(35, 81, 233);
}
.button-textsc {
  font-size: 18px;

  color: rgb(23, 140, 235);
}
</style>

 src/views/sfstatistics/statement/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,952 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <div class="sidecolumn-top">
        <div class="top-wj">患者来源</div>
      </div>

      <div class="bottom-fl">
        <el-tabs
          tab-position="right"
          v-model="activeName"
          @tab-click="handleClick"
        >
          <el-tab-pane label="全部" name="first"></el-tab-pane>
          <el-tab-pane label="住院" name="bhospitalized"></el-tab-pane>
          <el-tab-pane label="在院" name="Inhospital"></el-tab-pane>
          <el-tab-pane label="门诊" name="outpatient"></el-tab-pane>
          <el-tab-pane label="体检" name="physical"></el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">按出院病区统计 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">按出院科室统计 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--标签数据-->
          <el-col :span="24" :xs="24">
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="98px"
            >
              <el-form-item label="医院" prop="userName">
                <el-select
                  v-model="queryParams.value1"
                  placeholder="默认是该账号所属医院"
                >
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院病区" prop="userName">
                <el-select v-model="queryParams.value2" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="管理方案" prop="userName">
                <el-select v-model="queryParams.value3" placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="出院日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime1"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptionsa"
                >
                </el-date-picker>
              </el-form-item>
              <el-form-item label="计划随访日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime2"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
              </el-form-item>
              <el-form-item label="计划随访日期" prop="userName">
                <el-date-picker
                  v-model="queryParams.valuetime2"
                  align="right"
                  type="date"
                  placeholder="选择日期"
                  :picker-options="pickerOptions"
                >
                </el-date-picker>
              </el-form-item>

              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="medium"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="medium"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  plain
                  icon="el-icon-plus"
                  size="medium"
                  @click="addladeltag"
                  v-hasPermi="['system:user:add']"
                  >新增</el-button
                >
              </el-col>

              <el-col :span="1.5">
                <el-button
                  type="danger"
                  plain
                  icon="el-icon-delete"
                  size="medium"
                  :disabled="multiple"
                  @click="handleDelete"
                  v-hasPermi="['system:user:remove']"
                  >删除</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <div class="documentf">
                  <div class="document">
                    <el-button
                      type="warning"
                      plain
                      icon="el-icon-download"
                      size="medium"
                      @click="handleExport"
                      v-hasPermi="['system:user:export']"
                      >导出</el-button
                    >
                  </div>
                </div>
              </el-col>

              <!-- <el-col :span="1.5"> </el-col> -->
            </el-row>
            <!-- <right-toolbar
          :showSearch.sync="showSearch"
          @queryTable="getList"
          :columns="columns"
        ></right-toolbar> -->
            <el-table
              v-loading="loading"
              :data="userList"
              :border="true"
              @selection-change="handleSelectionChange"
            >
              <el-table-column type="selection" width="50" align="center" />
              <el-table-column
                fixed
                label="序号"
                align="center"
                key="tagid"
                prop="tagid"
                width="50"
              />
              <el-table-column
                fixed
                label="出院病区"
                align="center"
                key="tagname"
                prop="tagname"
                width="100"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="问卷"
                align="center"
                key="updateTime"
                prop="updateTime"
              >
              </el-table-column>

              <el-table-column
                label="问卷更新日期"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="110"
              >
              </el-table-column>
              <el-table-column
                label="管理方案"
                align="center"
                key="isupload"
                prop="isupload"
              >
              </el-table-column>
              <el-table-column
                label="随访任务数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="随访完成率"
                align="center"
                key="isupload"
                prop="isupload"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="AI外呼次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="AI随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="微信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="微信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="短信发送次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="短信随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="人工随访次数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="100"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成数"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>
              <el-table-column
                label="人工随访完成率"
                align="center"
                key="tagdescription"
                prop="tagdescription"
                width="120"
              >
              </el-table-column>

              <el-table-column
                fixed="right"
                label="操作"
                align="center"
                width="300"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
                  <el-button
                    size="medium"
                    type="text"
                    @click="handleUpdate(scope.row)"
                    v-hasPermi="['system:user:edit']"
                    ><span class="button-textxg"
                      ><i class="el-icon-s-data"></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-share"></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"
            />
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- å•é¢˜å±•ç¤ºå¼¹æ¡† -->
    <el-dialog :visible.sync="topicVisible" width="45%">
      <div class="topicdia">
        <div class="top-text">{{ topicvalue.name }}</div>
        <div class="top-mintext">随访完成数{{ topicvalue.number }}</div>
        <div style="overflow-x: hidden; overflow-y: auto; max-height: 65vh">
          <div class="ttaabbcc" v-for="item in topiclist" :key="item.name">
            <div class="describe">
              ç¬¬{{ item.number }}题： {{ item.name }}?<span
                >[{{ item.type == 1 ? "单选题" : "多选题" }}]</span
              >
            </div>
            <div>
              <el-table :data="tableData" style="width: 100%">
                <el-table-column prop="date" label="问题选项">
                </el-table-column>
                <el-table-column prop="name" label="选择人数">
                </el-table-column>
                <el-table-column prop="address" label="比例"> </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="topicVisible = false">关 é—­</el-button>
      </span>
    </el-dialog>
    <!-- ç»“果统计弹框 -->
    <el-dialog title="提示" :visible.sync="consequenceVisible" width="50%">
      <div class="topicdia">
        <div class="top-text" style="margin-bottom: 20px">问卷统计结果</div>
        <div>
          <el-table :data="tableData" style="width: 100%">
            <el-table-column prop="date" label="患者姓名"> </el-table-column>
            <el-table-column prop="namea" label="性别"> </el-table-column>
            <el-table-column prop="namec" label="年龄"> </el-table-column>
            <el-table-column prop="named" label="联系方式"> </el-table-column>
            <el-table-column prop="namee" label="计划执行时间" width="120">
            </el-table-column>
            <el-table-column prop="namex" label="实际完成时间" width="120">
            </el-table-column>
            <el-table-column prop="namez" label="完成方式"> </el-table-column>
            <el-table-column prop="nameh" label="问卷"> </el-table-column>
            <el-table-column prop="namej" label="得分"> </el-table-column>
            <!-- æˆªå–几列选项属性名维护数组遍历 -->
            <!-- <el-table-column prop="namet">
              <template slot="header" slot-scope="scope">
                <div>{{ scope.row.name }}<span>[单选题]</span></div>
              </template>
            </el-table-column> -->
          </el-table>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="consequenceVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="consequenceVisible = false"
          >ç¡® å®š</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  toamendtag,
  addapitag,
  deletetag,
  changetagcategory,
  listtag,
} from "@/api/system/label";

import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "Local", //顶部选择
      activeName: "first",
      // é®ç½©å±‚
      loading: false,
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      idds: "", //分类id
      // æ€»æ¡æ•°
      total: 0,
      lstamendtag: false, //是否修改标签
      topicVisible: false, //控制单题弹框
      consequenceVisible: false, //控制结果弹框
      //修改添加标签弹框数据
      tagform: {
        isupload: "",
        tagname: "",
        tagcategoryid: "",
        tagdescription: "",
      },
      topicvalue: {
        name: "骨科随访模版",
        number: 222,
      },
      classifyform: {
        categoryname: "",
      },
      topiclist: [
        {
          name: "您的身体康复情况如何",
          number: 1,
          type: 1,
        },
        {
          name: "您的饮食情况如何",
          number: 2,
          type: 2,
        },
        {
          name: "您的恢复情况如何",
          number: 3,
          type: 1,
        },
      ],
      tableData: [
        {
          date: "好",
          name: 12,
          address: "50%",
        },
        {
          date: "一般",
          name: 2,
          address: "6.2%",
        },
        {
          date: "å·®",
          name: 0,
          address: "0%",
        },
      ],
      // æ ‡ç­¾è¡¨æ ¼æ•°æ®
      userList: [],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      forms: {
        name: "",
      },
      numberlb: 22,
      dialogFormVisible: false, //添加、修改类别弹框
      lstamendtagVisible: false, //添加、修改标签弹框
      goQRCodeVisible: false, //二维码弹框
      sidecolumnval: "", //类别搜索
      propss: { multiple: true },
      topqueryParams: {}, //导出筛选条件
      options: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 3600 * 1000 * 24;
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      pickerOptionsa: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      // æŸ¥è¯¢æ ‡ç­¾åˆ—表参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        tagname: undefined,
        tagdescription: undefined,
      },
      // åˆ—信息
      columns: [
        { key: 0, label: `标签编号`, visible: true },
        { key: 1, label: `标签名称`, visible: true },
        { key: 2, label: `标签昵称`, visible: true },
        { key: 3, label: `部门`, visible: true },
        { key: 4, label: `手机号码`, visible: true },
        { key: 5, label: `状态`, visible: true },
        { 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",
      //     },
      //   ],
      // },
    };
  },
  watch: {},
  created() {
    this.getList();
    this.gitclasify();
  },

  methods: {
    /** æŸ¥è¯¢æ ‡ç­¾åˆ—表 */
    getList() {
      listtag(this.addDateRange(this.queryParams)).then((response) => {
        console.log(response);
        this.total = response.total;
        this.userList = response.rows;
      });
    },
    /** ä¿®æ”¹æ ‡ç­¾ */
    handleUpdate(row) {
      console.log(row, "修改标签");
      this.lstamendtagVisible = true;
      this.lstamendtag = true;
      this.tagform = {
        isupload: row.isupload,
        tagname: row.tagname,
        tagcategoryid: row.tagcategoryid,
        tagdescription: row.tagdescription,
        tagid: row.tagid,
      };
    },
    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: "",
      };
    },

    // è¡¨å•é‡ç½®
    reset() {
      this.form = {
        userId: undefined,
        deptId: undefined,
        userName: undefined,
        nickName: undefined,
        password: undefined,
        phonenumber: undefined,
        email: undefined,
        sex: undefined,
        status: "0",
        remark: undefined,
        postIds: [],
        roleIds: [],
      };
      this.resetForm("form");
    },
    //单题弹框
    handleUpdate() {
      this.topicVisible = true;
    },
    //结果弹框
    handleDelete() {
      this.consequenceVisible = true;
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.tagname = "";
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.tagid);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },

    /** å¯¼å‡ºæŒ‰é’®æ“ä½œ */
    handleExport() {
      this.download(
        "base/tag/export",
        {
          ...this.topqueryParams,
        },
        `user_${new Date().getTime()}.xlsx`
      );
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 180px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .sidecolumn-top {
    display: flex;
    justify-content: space-between;
    .top-wj {
      font-size: 20px;
    }
    .top-tj {
      font-size: 18px;

      color: rgb(0, 89, 255);
      cursor: pointer;
    }
  }
  .center-ss {
    margin-top: 30px;
    .input-with-select {
      height: 40px !important;
    }
  }
  .bottom-fl {
    margin-top: 30px;
    display: center !important;
  }
}
.topicdia {
  text-align: center;
  margin: 0 20px;

  // overflow: scroll;

  .top-text {
    font-size: 25px;
    font-weight: 600;
  }
  .top-mintext {
    color: #bdae25;
    font-size: 15px;
    margin: 10px 0;
  }
  .ttaabbcc {
    // background: #edf1f7;
    border: 1px solid #dcdfe6;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
      0 0 6px 0 rgba(0, 0, 0, 0.04);
    margin: 15px 0;
    margin-top: 30px;
    padding: 30px;
  }
  .describe {
    text-align: left;
    margin-bottom: 20px;
    span {
      color: rgb(23, 140, 235);
      margin-left: 5px;
    }
  }
}
::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  text-align: left;
  font-size: 20px;
}

.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
.document {
  width: 100px;
  height: 50px;
}
.documentf {
  display: flex;
  justify-content: flex-end;
}
.button-text {
  color: rgb(70, 204, 238);
}
.button-textck {
  color: rgb(39, 167, 67);
}
.button-textxg {
  font-size: 18px;
  color: rgb(35, 81, 233);
}
.button-textsc {
  font-size: 18px;

  color: rgb(23, 140, 235);
}
</style>

 src/views/shortmessage/aoconnect/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,17 @@
<template>
  <div>一对一测试</div>
</template>

<script>
export default {
  data() {
    return {};
  },

  created() {},

  methods: {},
};
</script>

<style lang="scss" scoped></style>

 src/views/shortmessage/aoprojection/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,230 @@
<template>
  <div class="container">
    <div class="header">
      <div>
        æˆ¿é—´å·:
        <input type="text" id="room" />
        <button @click="createRoom()">创建房间</button>
      </div>
      <div>
        å¯¹æ–¹æˆ¿é—´å·
        <input type="text" id="receive" />
        <button @click="Connect()">连接</button>
      </div>
    </div>
    <div style="margin-top: 20px">
      <video
        src=""
        id="self"
        autoplay
        controls
        muted
        style="width: 500px; object-fit: cover; margin-right: 100px"
      ></video>
      <video
        src=""
        id="other"
        autoplay
        controls
        muted
        style="width: 500px; object-fit: cover"
      ></video>
    </div>
  </div>
</template>

<script>
let PeerConnection =
  window.PeerConnection ||
  window.webkitPeerConnection00 ||
  window.webkitRTCPeerConnection ||
  window.mozRTCPeerConnection;
let nativeRTCIceCandidate = window.mozRTCIceCandidate || window.RTCIceCandidate;
let nativeRTCSessionDescription =
  window.mozRTCSessionDescription || window.RTCSessionDescription;
//ice服务器地址
const iceServer = {
  iceServers: [
    {
      url: "turn:42.192.40.58:3478?transport=udp",
      username: "ddssingsong",
      credential: "123456",
    },
    {
      url: "turn:42.192.40.58:3478?transport=tcp",
      username: "ddssingsong",
      credential: "123456",
    },
  ],
};
let socket = "";
let receiver = "";
let pc;

export default {
  data() {
    return {};
  },

  created() {},

  methods: {
    createRoom() {
      let room = document.getElementById("room");
      if (!room.value) {
        alert("请输入房间号!!!");
        return;
      }
      //建立websocket连接
      socket = new WebSocket(`wss://127.0.0.1:3000/single?room=${room.value}`);
      socket.onopen = async () => {
        alert("连接成功");
        try {
          //获取当前设备的视频流
          let stream = await navigator.mediaDevices.getDisplayMedia({
            video: true,
            audio: false,
          });
          console.log(stream);
          //初始化PC源
          pc = this.initPC(stream);
          console.log(pc);
          //添加音视频流
          pc.addStream(stream);
          console.log(pc);
          let video = document.getElementById("self");
          video.srcObject = stream;
          console.log(video);
        } catch (error) {
          console.log(error);
          alert("获取流失败");
        }
      };
      socket.onmessage = async (message) => {
        let data = JSON.parse(message.data);
        switch (data.name) {
          //接收到邀请
          case "peer":
            receiver = data.receiver;
            this.acceptAudio();
            break;
          /**
           * 1.邀请人将对方的音视频流通过setRemoteDescription函数进行存储
           * 2.存储完后邀请人创建answer来获取自己的音视频流,通过setLocalDescription函数存储自己的音视频流,并发送answer指令(携带自己的音视频)告诉对方要存储邀请人的音视频
           */
          case "offer":
            //当收到对方接收请求后,设置音频源,并发送answer给对方
            pc.setRemoteDescription(
              new nativeRTCSessionDescription(data.data.sdp)
            );
            pc.createAnswer(
              (session_desc) => {
                pc.setLocalDescription(session_desc);
                socket.send(
                  JSON.stringify({
                    name: "answer",
                    data: {
                      sdp: session_desc,
                    },
                    receiver: receiver,
                  })
                );
              },
              (err) => {
                console.log(err);
              }
            );
            break;
          case "answer":
            //设置邀请人发来的音频源
            pc.setRemoteDescription(
              new nativeRTCSessionDescription(data.data.sdp)
            );
            break;
          case "ice_candidate":
            //添加ice源,这一步很重要,如果没有接收ice则查看是否流程有问题
            var candidate = new nativeRTCIceCandidate(data.data);
            pc.addIceCandidate(candidate);
            break;
        }
      };
    },
    //初始化PC源
    initPC() {
      let pc = new PeerConnection(iceServer);
      pc.onicecandidate = (evt) => {
        if (evt.candidate) {
          socket.send(
            JSON.stringify({
              name: `ice_candidate`,
              data: {
                id: evt.candidate.sdpMid,
                label: evt.candidate.sdpMLineIndex,
                sdpMLineIndex: evt.candidate.sdpMLineIndex,
                candidate: evt.candidate.candidate,
              },
              receiver: receiver,
            })
          );
        }
      };
      pc.onaddstream = (evt) => {
        let stream = evt.stream;
        let video = document.getElementById("other");
        video.srcObject = stream;
      };
      return pc;
    },
    //和对方建立连接
    Connect() {
      receiver = document.getElementById("receive").value;
      console.log(receiver);
      if (!socket) {
        alert("先创建自己的房间号!!");
        return;
      }
      if (!receiver) {
        alert("请输入对方房间号");
        return;
      }
      socket.send(JSON.stringify({ name: "createRoom", receiver: receiver }));
      console.log("成功");
    },
    //接收邀请
    async acceptAudio() {
      /**
       * 1.点击同意后
       * 2.获取自己的视频流
       * 3.初始化PC源
       * 4.PC添加音视频流
       * 5.创建offer,获取自己的音视频流,并通过setLocalDescription函数存储自己的音视频流
       * 6.并发送peer指令(携带自己的音视频)告诉邀请人要存储自己的音视频
       */
      try {
        pc.createOffer(
          (session_desc) => {
            pc.setLocalDescription(session_desc);
            socket.send(
              JSON.stringify({
                name: "offer",
                data: {
                  sdp: session_desc,
                },
                receiver: receiver,
              })
            );
          },
          (err) => {
            console.log(err);
          }
        );
      } catch (error) {
        alert("检测到当前设备不支持麦克风,请设置权限后在重试");
        this.socket.close();
      }
    },
  },
};
</script>

<style lang="scss" scoped></style>

 src/views/shortmessage/aovideo/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,239 @@
<template>
  <div class="demo">
    <div class="rtcBox">
      <div>
        <div class="video-box">
          <video src="" id="rtcA" controls autoplay></video>
          <h5>A</h5>
        </div>
        <div class="chat-box" v-show="!allowHangup && messageOpen">
          <h5>收消息</h5>
          <p>{{ receiveText }}</p>
        </div>
      </div>
      <div>
        <div class="video-box">
          <video src="" id="rtcB" controls autoplay></video>
          <h5>B</h5>
          <button @click="call" :disabled="allowCall">发起连接</button>
          <button @click="hangup" :disabled="allowHangup">hangup</button>
        </div>
        <div class="chat-box" v-show="!allowHangup && messageOpen">
          <h5>发消息</h5>
          <textarea v-model="sendText"></textarea>
          <br />
          <button @click="send">发送</button>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "local1",
  data() {
    return {
      peerA: null,
      peerB: null,
      channelA: null,
      channelB: null,
      offerOption: {
        offerToReceiveAudio: 1,
        offerToReceiveVideo: 1,
      },
      allowCall: true,
      allowHangup: true,
      messageOpen: false,
      sendText: "",
      receiveText: "",
    };
  },
  methods: {
    send() {
      this.channelB.send(JSON.stringify({ name: this.sendText }));
      this.sendText = "";
    },
    start() {
      this.state = "2";
      this.newRecognition.start();
    },
    stop() {
      this.state = "1";
      this.newRecognition.stop();
    },
    async call() {
      if (!this.peerA || !this.peerB) {
        // åˆ¤æ–­æ˜¯å¦æœ‰å¯¹åº”实例，没有就重新创建
        this.initPeer();
      }
      try {
        let offer = await this.peerB.createOffer(this.offerOption); // åˆ›å»º offer
        await this.onCreateOffer(offer);
      } catch (e) {
        console.log("createOffer: ", e);
      }

      this.allowCall = true;
      this.allowHangup = false;
    },
    hangup() {
      this.peerA.close();
      this.peerB.close();
      this.channelA.close();
      this.channelB.close();
      this.peerA = null;
      this.peerB = null;
      this.channelA = null;
      this.channelB = null;
      this.sendText = "";
      this.receiveText = "";
      this.allowCall = false;
      this.allowHangup = true;
    },
    async onCreateOffer(desc) {
      try {
        await this.peerB.setLocalDescription(desc); // å‘¼å«ç«¯è®¾ç½®æœ¬åœ° offer æè¿°
      } catch (e) {
        console.log("Offer-setLocalDescription: ", e);
      }
      try {
        await this.peerA.setRemoteDescription(desc); // æŽ¥æ”¶ç«¯è®¾ç½®è¿œç¨‹ offer æè¿°
      } catch (e) {
        console.log("Offer-setRemoteDescription: ", e);
      }
      try {
        let answer = await this.peerA.createAnswer(); // æŽ¥æ”¶ç«¯åˆ›å»º answer
        await this.onCreateAnswer(answer);
      } catch (e) {
        console.log("createAnswer: ", e);
      }
    },
    async onCreateAnswer(desc) {
      try {
        await this.peerA.setLocalDescription(desc); // æŽ¥æ”¶ç«¯è®¾ç½®æœ¬åœ° answer æè¿°
      } catch (e) {
        console.log("answer-setLocalDescription: ", e);
      }
      try {
        await this.peerB.setRemoteDescription(desc); // å‘¼å«ç«¯è®¾ç½®è¿œç¨‹ answer æè¿°
      } catch (e) {
        console.log("answer-setRemoteDescription: ", e);
      }
    },
    initPeer() {
      // åˆ›å»ºè¾“出端 PeerConnection
      let PeerConnection =
        window.RTCPeerConnection ||
        window.mozRTCPeerConnection ||
        window.webkitRTCPeerConnection;
      this.peerA = new PeerConnection();
      this.peerA.addStream(this.localstream); // æ·»åŠ æœ¬åœ°æµ
      // ç›‘听 A çš„ICE候选信息
      // å¦‚果收集到，就添加给 B
      this.peerA.onicecandidate = (event) => {
        if (event.candidate) {
          this.peerB.addIceCandidate(event.candidate);
        }
      };
      this.peerA.ondatachannel = (event) => {
        console.log(event);
        this.channelA = event.channel;
        this.channelA.binaryType = "arraybuffer";
        this.channelA.onopen = (e) => {
          console.log("channelA onopen", e);
        };
        this.channelA.onclose = (e) => {
          console.log("channelA onclose", e);
        };
        this.channelA.onmessage = (e) => {
          this.receiveText = JSON.parse(e.data).name;
          console.log("channelA onmessage", e.data);
        };
      };
      //                this.channelA.send('Hi you!');
      // åˆ›å»ºå‘¼å«ç«¯
      this.peerB = new PeerConnection();
      this.peerB.onaddstream = (event) => {
        // ç›‘听是否有媒体流接入，如果有就赋值给 rtcB çš„ src
        console.log("event-stream", event);
        let video = document.querySelector("#rtcB");
        video.srcObject = event.stream;
      };
      this.channelB = this.peerB.createDataChannel("messagechannel");
      console.log("this.channelB", this.channelB);
      this.channelB.binaryType = "arraybuffer";
      this.channelB.onopen = (event) => {
        console.log(1);
        console.log("channelB onopen", event);
        this.messageOpen = true;
      };
      this.channelB.onclose = function (event) {
        console.log(1);
        console.log("channelB onclose", event);
      };
      // ç›‘听 B çš„ICE候选信息
      // å¦‚果收集到，就添加给 A
      this.peerB.onicecandidate = (event) => {
        if (event.candidate) {
          this.peerA.addIceCandidate(event.candidate);
        }
      };
      this.allowCall = false;
    },
    async createMedia() {
      // ä¿å­˜æœ¬åœ°æµåˆ°å…¨å±€ï¼ˆè§†é¢‘音频都支持）
      this.localstream = await navigator.mediaDevices.getUserMedia({
        audio: true,
        video: true,
      });
      console.log(this.localstream);
      console.log(
        this.localstream.getVideoTracks(),
        this.localstream.getAudioTracks()
      );
      let video = document.querySelector("#rtcA");
      video.srcObject = this.localstream;
      this.initPeer(); // èŽ·å–到媒体流后，调用函数初始化 RTCPeerConnection
    },
  },
  mounted() {
    // èŽ·å–最新视图后获取本地流
    this.$nextTick(() => {
      // {mediaSource: 'screen'}
      this.createMedia();
    });
  },
};
</script>

<style lang="scss">
.rtcBox {
  display: flex;
  justify-content: center;
  .video-box {
    height: 380px;
    border-bottom: 1px solid #1fbeca;
    margin-bottom: 10px;
  }
  video {
    width: 400px;
    height: 300px;
    margin-left: 20px;
    background-color: #ddd;
  }
  .chat-box {
    text-align: center;
    h5 {
      margin-bottom: 10px;
    }
    p,
    textarea {
      width: 240px;
      height: 60px;
      border: 1px solid #000;
      display: inline-block;
    }
  }
}
</style>

 src/views/shortmessage/communication/index.vue

@@ -63,9 +63,13 @@
</template>

<script>
import LemonMessageVoice from "./lemon-message-voice";
import EmojiData from "./database/emoji";
import { sendWebsocket, closeWebsocket } from "@/websocket/websocket.js";
import { chitchatapi } from "@/api/noteapi/chitchat";
import {
  sendWebsocket,
  websocketSend,
  closeWebsocket,
} from "@/websocket/websocket.js";
// Vue.component(LemonMessageVoice.name, LemonMessageVoice);
// èŽ·å–时间
const getTime = () => {
@@ -102,6 +106,9 @@
};
export default {
  name: "communication",
  provide: {
    IMUI: "IMUI value",
  },
  data() {
    return {
      theme: "blue",
@@ -292,19 +299,19 @@
    setTimeout(() => {
      IMUI.changeContact("contact-1");
    }, 500);

    // å·¦ä¾§è”系人最新消息
    IMUI.setLastContentRender("event", (message) => {
      return `[自定义通知内容]`;
    });

    let contactList = [
      { ...contactData1 },
      { ...contactData2 },
      { ...contactData3 },
      //...Array(100).fill(contactData1)
    ];

    // åˆå§‹è”系人
    IMUI.initContacts(contactList);
    // åˆå§‹åŒ–左侧导航
    IMUI.initMenus([
      {
        name: "messages",
@@ -365,7 +372,7 @@
        isBottom: true,
      },
    ]);

    // å·¥å…·æ 
    IMUI.initEditorTools([
      {
        name: "emoji",
@@ -491,6 +498,7 @@
        IMUI.messageViewToBottom();
      }
    },
    // å®šä¹‰æ–°æ¶ˆæ¯
    appendCustomMessage() {
      const { IMUI } = this.$refs;
      const message = {
@@ -581,15 +589,74 @@
      instance.closeDrawer();
    },
    // å»ºç«‹è¿žæŽ¥
    requstWs() {
    requstWs(message, next, file) {
      console.log("连接");
      // é˜²æ­¢ç”¨æˆ·å¤šæ¬¡è¿žç»­ç‚¹å‡»å‘起请求，所以要先关闭上次的ws请求。
      closeWebsocket();
      let formData = new FormData();

      // if (file) {
      //   const reader = new FileReader();
      //   console.log(reader);
      //   console.log(file);
      //   reader.onload = (file) => {
      //     console.log(file);
      //     console.log(reader);
      //     const imageData = reader.result;
      //     //文件字节大小
      //     //  const fileSize = file.loaded;
      //     const fileSize = imageData.length;
      //     console.log("byteLength ï¼š ", fileSize);
      //     const chunkSize = 4096; // è®¾ç½®æ¯ä¸ªæ•°æ®å—的大小
      //     let offset = 0;

      //     // åˆ†å—传输图片数据
      //     while (offset < imageData.length) {
      //       const chunk = imageData.slice(offset, offset + chunkSize);
      //       const obj = {
      //         type: file.type,
      //         userId: "1", //接收数据方
      //         fileSize: fileSize,
      //         image: chunk,
      //       };
      //       console.log(JSON.stringify(obj));
      //       // å‘èµ·ws请求
      //       // sendWebsocket(
      //       //   "ws://192.168.31.121:8080/chat?userId=2",
      //       //   JSON.stringify(obj),
      //       //   this.wsMessage,
      //       //   this.wsError
      //       // );
      //       websocketSend(JSON.stringify(obj));
      //       offset += chunkSize;

      //       console.log("offset ï¼š ", offset);
      //     }

      //     // å‘送完成标记
      //     console.log("message ");
      //   };

      //   return reader.readAsDataURL(file);
      // }

      // è·ŸåŽç«¯åå•†ï¼Œéœ€è¦ä»€ä¹ˆå‚数数据给后台
      if (file) {
        formData.append("files", file);
        console.log(formData.get("files"));
        // img.src = window.URL.createObjectURL(temp);
        chitchatapi(formData).then((response) => {
          console.log(response);
        });

        return console.log(formData);
      }

      const obj = {
        type: "text",
        content: "帝得圣相相曰度",
        type: "object",
        userId: "1", //接收数据方
        fileSize: "1212",
        image: "12",
      };
      // å‘èµ·ws请求
      sendWebsocket(
@@ -625,9 +692,10 @@
    },
    // å‘送新消息触发
    handleSend(message, next, file) {
      console.log(message, file);
      console.log(message);
      console.log(file);
      console.log(next);
      this.requstWs();
      this.requstWs(message, next, file);
      setTimeout(() => {
        next();
      }, 1000);

 src/views/shortmessage/communication/lemon-message-voice.vue

ÎļþÒÑɾ³ý

 src/views/shortmessage/messagebank/compile/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,155 @@
<template>
  <div>
    <div class="headline">
      <div class="basics">问题配置</div>
      <div class="headbottom">
        <el-button type="primary" icon="el-icon-notebook-2" @click="addzbiaofn"
          >健康信息模版</el-button
        >
        <el-button @click="emptyfn" type="primary" icon="el-icon-refresh-right"
          >清空短信内容</el-button
        >
      </div>
    </div>
    <div class="top-text">
      <el-input
        :rows="5"
        placeholder="请输入短信内容或利用模板进行编辑"
        type="textarea"
        v-model="form.desc"
      ></el-input>
    </div>
    <div class="headline">
      <div class="basics">
        æŽ¥æ”¶çŸ­ä¿¡å·ç <span>注：手机号码用英文符号 ';' åˆ†éš”开！</span>
      </div>
      <div class="headbottom">
        <el-button type="primary" icon="el-icon-phone" @click="selectphp"
          >选泽号码</el-button
        >
        <el-button
          type="primary"
          icon="el-icon-refresh-right
"
          >清空号码</el-button
        >
      </div>
    </div>
    <div class="top-text">
      <el-input
        :rows="5"
        placeholder="请输入"
        type="textarea"
        v-model="form.desc"
      ></el-input>
    </div>
    <div class="headlinetwo">
      <div class="basics">
        <el-checkbox v-model="form.checked">预约发送</el-checkbox>
      </div>
      <div class="headbottom">
        <el-button
          type="warning"
          plain
          icon="el-icon-arrow-left"
          @click="addzbiao"
          >返回短信列表</el-button
        >
        <el-button type="success" plain icon="el-icon-position">发送</el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      optionvalue: "不需要、没有、不知道",
      form: {
        name: "",
        region: "",
        date1: "",
        date2: "",
        delivery: false,
        type: [],
        resource: "",
        desc: "",
      },
      deployList: [
        {
          id: 1,
          name: "有",
          valuetop:
            "(?!.*忘|.*不|.*没)^.*(是|有|对|做|作|检|查|复诊|好|参加|复诊|去(过|好|了|完|医院)|来(过|了|医院))|没错|对呀|可能|(已经|早)去了|开了药|腰带|吊带|要的|(?<!没)有的|表带,10;要,5",
        },
        {
          id: 2,
          name: "不知道",
          valuetop:
            "(不|没|谁|鬼|怎么).*(病|可能|知道|了解|清楚|懂|明白|确认|确定|晓得|知晓|认得|识得|印象|熟悉|è®°|会|关心|关注|注意|告诉|通知|听)",
        },
      ],
    };
  },

  created() {},

  methods: {
    onSubmit() {
      console.log("submit!");
    },
    deletei(index) {
      console.log(index);
      this.deployList.splice(index, 1);
    },
    addzbiao() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="scss" scoped>
.top-text {
  margin: 15px;
  margin-top: 0;
  padding: 10px;
  background: #f2f5fc;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}
.basic {
  height: 50px;
  margin: 15px;
  margin-bottom: 0;
  padding: 0 20px 20px 20px;
  line-height: 50px;
  background: #92c5f0;
}
.headline {
  display: flex;
  height: 50px;
  margin: 15px;
  margin-bottom: 0;
  padding: 0 20px 20px 20px;
  line-height: 50px;
  background: #92c5f0;
  justify-content: space-between;
  span {
    margin-left: 20px;
    color: #fa3a3a;
    font-weight: 600;
  }
}
.headlinetwo {
  display: flex;
  height: 50px;
  margin: 15px;
  margin-bottom: 0;
  padding: 0 20px 20px 20px;
  line-height: 50px;
  justify-content: space-between;
}
</style>

 src/views/shortmessage/messagebank/index.vue

@@ -2,38 +2,49 @@
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <div class="notebuttom"><i class="el-icon-chat-dot-square" />发短信</div>
      <div class="notebuttom" @click="handleAdd">
        <i class="el-icon-chat-dot-square" />发短信
      </div>
      <el-divider></el-divider>
      <div class="notestate">
        <div class="state-text">短信状态</div>
        <div class="state-line">
          <div class="value-left">
            <i class="el-icon-chat-dot-square" />全部
          </div>
        <div
          :class="classestag == 1 ? 'state-lines' : 'state-line'"
          @click="completefn"
        >
          <div class="value-left"><i class="el-icon-menu" />全部</div>
          <div class="quantityq">22</div>
        </div>
        <div class="state-line">
        <div
          :class="classestag == 2 ? 'state-lines' : 'state-line'"
          @click="succeedfn"
        >
          <div class="value-left">
            <i class="el-icon-chat-dot-square" />发送成功
            <i class="el-icon-circle-check" />发送成功
          </div>
          <div class="quantitycg">22</div>
        </div>
        <div class="state-line">
        <div
          :class="classestag == 3 ? 'state-lines' : 'state-line'"
          @click="losefn"
        >
          <div class="value-left">
            <i class="el-icon-chat-dot-square" />发送失败
            <i class="el-icon-warning-outline" />发送失败
          </div>
          <div class="quantitysb">22</div>
        </div>
        <div class="state-line">
          <div class="value-left">
            <i class="el-icon-chat-dot-square" />待发送
          </div>
        <div
          :class="classestag == 4 ? 'state-lines' : 'state-line'"
          @click="awaitfn"
        >
          <div class="value-left"><i class="el-icon-s-help" />待发送</div>
          <div class="quantityd">22</div>
        </div>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top">短信详情</div>
      <div class="leftvlue-top">短信详情({{ total }})</div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--用户数据-->
@@ -55,7 +66,7 @@
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="创建时间">
              <el-form-item label="上传日期">
                <el-date-picker
                  v-model="dateRange"
                  style="width: 240px"
@@ -148,63 +159,84 @@
                prop="userId"
              />
              <el-table-column
                label="主旨"
                label="手机号码"
                align="center"
                key="userName"
                prop="userName"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="问题文本"
                label="类型"
                align="center"
                key="nickName"
                prop="nickName"
                width="400"
                :show-overflow-tooltip="true"
              />

              <el-table-column
                label="问题语音"
                label="发送人"
                align="center"
                key="aphonenumber"
                prop="aphonenumber"
                width="400"
                key="transmitleg"
                prop="transmitleg"
              /><el-table-column
                label="关联指标"
                label="接收人"
                align="center"
                key="bphonenumber"
                prop="bphonenumber"
                width="120"
              />
              <el-table-column
                label="指标选项"
                label="上传时间"
                align="center"
                key="bphonenumber"
                prop="bphonenumber"
                width="120"
              />
              <el-table-column
                label="语言"
                align="center"
                key="indicator"
                prop="indicator"
                width="120"
              />
              <el-table-column label="是否启用" align="center" key="status">
                prop="createTime"
                width="160"
              >
                <template slot-scope="scope">
                  <el-switch
                    v-model="scope.row.status"
                    active-value="0"
                    inactive-value="1"
                    @change="handleStatusChange(scope.row)"
                  ></el-switch>
                  <span>{{ parseTime(scope.row.createTime) }}</span>
                </template> </el-table-column
              ><el-table-column
                label="发送时间"
                align="center"
                prop="createTime"
                width="160"
              >
                <template slot-scope="scope">
                  <span>{{ parseTime(scope.row.createTime) }}</span>
                </template>
              </el-table-column>
              <el-table-column
                label="发送内容"
                align="center"
                key="sendvalue"
                prop="sendvalue"
                width="300"
                :show-overflow-tooltip="true"
              />
              <el-table-column
                label="发送状态"
                align="center"
                key="state"
                prop="state"
              >
                <template slot-scope="scope">
                  <div
                    v-if="scope.row.state == 1"
                    style="color: rgb(58, 250, 144)"
                  >
                    <i class="el-icon-check"></i>
                  </div>
                  <div
                    v-else-if="scope.row.state == 2"
                    style="color: rgb(250, 96, 58)"
                  >
                    <i class="el-icon-check"></i>
                  </div>
                </template>
              </el-table-column>

              <el-table-column
                label="操作"
                align="center"
                width="200"
                class-name="small-padding fixed-width"
              >
                <template slot-scope="scope">
@@ -214,25 +246,7 @@
                    @click="handleUpdate(scope.row)"
                    v-hasPermi="['system:user:edit']"
                    ><span class="button-textxg"
                      ><i class="el-icon-edit-outline"></i>修改</span
                    ></el-button
                  >
                  <el-button
                    size="medium"
                    type="text"
                    @click="compileUpdate(scope.row)"
                    v-hasPermi="['system:user:edit']"
                    ><span class="button-bji"
                      ><i class="el-icon-edit"></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-solid"></i>删除</span
                      ><i class="el-icon-edit-outline"></i>再次发送</span
                    ></el-button
                  >
                </template>
@@ -466,7 +480,6 @@
  components: { Treeselect },
  data() {
    return {
      topactiveName: "Local", //顶部选择
      // é®ç½©å±‚
      loading: false,
      // é€‰ä¸­æ•°ç»„
@@ -479,6 +492,7 @@
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      classestag: 1, //类别标识
      namequestionnaire: "",
      haoquestionnaire: "",
      idds: "",
@@ -643,68 +657,9 @@
        console.log(this.userList);
      });
    },
    // æ·»åŠ ã€ä¿®æ”¹ç±»åˆ«
    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.title;
      }
    },
    compileUpdate(row) {
      this.$router.push({
        path: "/repositoryai/verbaltrick/particulars/",
        query: { id: "1" },
      });
    },
    // é¢˜ç›®çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      let text = row.status === "0" ? "启用" : "停用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.userName + '"用户吗？')
        .then(function () {
          return changeUserStatus(row.userId, row.status);
        })
        .then(() => {
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.status = row.status === "0" ? "1" : "0";
        });
    },
    //搜索类别
    sidecolumnss() {},
    // const { pageNum, pageSize, ...params } = this.queryParams;
    submitsidecolumn() {},
    deletefenlei() {},
    // ä¾¿æ·æ ‡ç­¾
    tsgnameto() {},
    // åˆ‡æ¢å…±äº«/本地
@@ -754,9 +709,7 @@
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {
      this.reset();
      this.title = "新增短信";
      this.indexopen = true;
      this.$router.push("/shortmessage/messagebank/compile/");
    },
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate(row) {
@@ -805,6 +758,22 @@
        })
        .catch(() => {});
    },
    // åˆ‡æ¢å…¨éƒ¨ç±»åˆ«
    completefn() {
      this.classestag = 1;
    },
    // åˆ‡æ¢æˆåŠŸç±»åˆ«
    succeedfn() {
      this.classestag = 2;
    },
    // åˆ‡æ¢å¤±è´¥ç±»åˆ«
    losefn() {
      this.classestag = 3;
    },
    // åˆ‡æ¢å¾…发送类别
    awaitfn() {
      this.classestag = 4;
    },
  },
};
</script>
@@ -814,60 +783,95 @@
  display: flex;
}
.sidecolumn {
  width: 300px;
  width: 350px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  padding: 10px;
  padding-top: 20px;
  text-align: center;
  background: #dfeffd;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .sidecolumn-top {
    display: flex;
    justify-content: space-between;
    .top-wj {
      font-size: 20px;
  .notebuttom {
    height: 35px;
    background: #85c046;
    color: #ffff;
    font-size: 20px;
    line-height: 35px;
    cursor: pointer;
    border-radius: 3px;
  }
  .notestate {
    font-size: 20px;
    .state-text {
      height: 40px;
    }
    .top-tj {
      font-size: 18px;

      color: rgb(0, 89, 255);
    .state-line {
      display: flex;
      height: 40px;
      align-items: center;
      padding: 10px 10px;
      cursor: pointer;
      justify-content: space-between;
    }
  }
  .center-ss {
    margin-top: 30px;
    .input-with-select {
      height: 40px !important;
    .state-lines {
      display: flex;
      height: 40px;
      align-items: center;
      padding: 10px 10px;
      background: #88abfc;
      color: #fff;
      cursor: pointer;
      justify-content: space-between;
    }
  }
  .bottom-fl {
    margin-top: 30px;
    display: center !important;
    .state-line:hover {
      background: #88abfc;
    }
    .quantityq {
      height: 30px;
      line-height: 30px;
      padding: 0 5px;
      border-radius: 10px;
      color: #fff;
      background: #9eb8ff;
    }
    .quantitycg {
      height: 30px;
      line-height: 30px;
      padding: 0 5px;
      border-radius: 10px;
      color: #fff;

      background: #48cf2d;
    }
    .quantitysb {
      height: 30px;
      line-height: 30px;
      padding: 0 5px;
      border-radius: 10px;
      color: #fff;

      background: #ce513b;
    }
    .quantityd {
      height: 30px;
      line-height: 30px;
      padding: 0 5px;
      border-radius: 10px;
      color: #fff;

      background: #3fbff1;
    }
  }
}
.qrcode-dialo {
  text-align: center;
  //   display: flex;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .qrcode-text {
    font-size: 20px;
    span {
      margin-left: 20px;
    }
  }
  .qrcode-img {
    width: 300px;
    height: 400px;
  }
[class^="el-icon-"],
[class*=" el-icon-"] {
  font-weight: 600;
  font-size: 20px;
}
.tsgname {
  width: 90px;

 src/views/system/label/index.vue

@@ -637,7 +637,7 @@
    // æ ‡ç­¾çŠ¶æ€ä¿®æ”¹
    handleStatusChange(row) {
      console.log(row.isupload);
      let text = row.isupload === "0" ? "启用" : "停用";
      let text = row.isupload == 0 ? "停用" : "启用";
      this.$modal
        .confirm('确认要"' + text + '""' + row.tagname + '"标签吗？')
        .then(function () {
@@ -647,7 +647,7 @@
          this.$modal.msgSuccess(text + "成功");
        })
        .catch(function () {
          row.isupload = row.isupload === "0" ? "1" : "0";
          row.isupload = row.isupload == 0 ? 1 : 0;
        });
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */

 src/views/tool/module/Editinterface.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,255 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <el-input placeholder="输入关键字进行过滤" v-model="filterText">
      </el-input>

      <el-tree
        class="filter-tree"
        :data="data"
        :props="defaultProps"
        default-expand-all
        :filter-node-method="filterNode"
        ref="tree"
      >
        <span class="custom-tree-node" slot-scope="{ node, data }">
          <span>{{ node.label }}</span>
          <span>
            <el-button type="text" size="mini" @click="() => append(data)">
              æ–°å¢žå­çº§
            </el-button>
            <el-button
              type="text"
              size="mini"
              @click="() => remove(node, data)"
            >
              åˆ é™¤
            </el-button>
          </span>
        </span>
      </el-tree>
    </div>
    <!-- ä¸­éƒ¨æ•°æ® -->
    <div class="leftvlue">
      <div class="compile" v-for="item in list">
        <div class="compile-title">
          {{ item.name }}: <span>{{ item.uapiurl }}</span>
        </div>
        <div class="compile-value">
          <div class="compile-min" v-for="itea in item.value">
            <div>
              <el-input v-model="itea.value" placeholder="入参注解"></el-input>
            </div>
            <div>
              <el-input v-model="itea.name" placeholder="入参名"></el-input>
            </div>
            <div @click="drawer = true">展开下级</div>
          </div>
        </div>
      </div>
    </div>
    <el-drawer
      title="我是二级"
      direction="btt"
      :visible.sync="drawer"
      :with-header="false"
    >
      <div class="compile-value">
        <div class="compile-min" v-for="itea in 6">
          <div>
            <el-input v-model="input" placeholder="入参注解"></el-input>
          </div>
          <div>
            <el-input v-model="inputs" placeholder="入参名"></el-input>
          </div>
        </div>
      </div>
    </el-drawer>
  </div>
</template>

<script>
let id = 1000;
export default {
  name: "Editinterface",

  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
  },

  data() {
    const data = [
      {
        id: 1,
        label: "患者服务中心",
        children: [
          {
            id: 4,
            label: "患者列表",
          },
          {
            id: 21,
            label: "患者服务",
          },
        ],
      },
      {
        id: 2,
        label: "一级 2",
        children: [
          {
            id: 5,
            label: "二级 2-1",
          },
          {
            id: 6,
            label: "二级 2-2",
          },
        ],
      },
      {
        id: 3,
        label: "一级 3",
        children: [
          {
            id: 7,
            label: "二级 3-1",
          },
          {
            id: 8,
            label: "二级 3-2",
          },
        ],
      },
    ];
    return {
      drawer: false,
      input: "",
      inputs: "",
      // æŸ¥è¯¢å‚æ•°
      queryParams: {},
      currentRow: null, //选中行数据
      filterText: "",

      data: JSON.parse(JSON.stringify(data)),
      data: JSON.parse(JSON.stringify(data)),

      defaultProps: {
        children: "children",
        label: "label",
      },
      list: [
        {
          id: "23",
          name: "获取患者列表",
          uapiurl: "http://api",
          value: [
            { name: "children", value: "注解" },
            { name: "childrenone", value: "注解一" },
            { name: "childrentwo", value: "注解二" },
            { name: "childrenthree", value: "注解三" },
          ],
        },
        {
          id: "13",
          name: "获取患者详情",
          uapiurl: "http://api/xqq",
          value: [
            { name: "children", value: "注解" },
            { name: "childrenone", value: "注解一" },
            { name: "childrentwo", value: "注解二" },
            { name: "childrenthree", value: "注解三" },
            { name: "childrenthree", value: "注解四" },
          ],
        },
      ],
    };
  },
  watch: {},
  created() {},

  methods: {
    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },
    append(data) {
      const newChild = { id: id++, label: "子级", children: [] };
      if (!data.children) {
        this.$set(data, "children", []);
      }
      data.children.push(newChild);
    },

    remove(node, data) {
      const parent = node.parent;
      const children = parent.data.children || parent.data;
      const index = children.findIndex((d) => d.id === data.id);
      children.splice(index, 1);
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 300px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 10px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}
::v-deep .sidecolumn .el-tree {
  margin-top: 30px;
  background: none;
}

.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .compile {
    border: 1px solid #dcdfe6;
    padding: 15px;
    margin-top: 10px;
  }
}
.compile-value {
  display: flex;
  margin-top: 10px;

  .compile-min {
    border: 1px solid #dcdfe6;
    width: 150px;
    div {
      padding: 5px;
      text-align: center;
    }
  }
}
.compile-min div:nth-child(3) {
  padding: 0;
  margin: 5px;
  background: bisque;
  border-radius: 3px;
}
</style>

 src/views/tool/module/classifyone.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,631 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn" v-if="Sidecontrol">
      <div v-if="Typecontrol">
        <div class="sidecolumn-top">
          <div class="top-wj">类型</div>
          <div class="top-tj" @click="dialogFormVisible = true">+添加</div>
        </div>
        <div class="center-ss">
          <el-input
            placeholder="请输入内容"
            v-model="sidecolumnval"
            class="input-with-select"
            size="medium "
          >
            <el-button
              @click="sidecolumnss"
              slot="append"
              icon="el-icon-search"
            ></el-button>
          </el-input>
        </div>
      </div>

      <div class="bottom-fl">
        <el-tabs tab-position="right">
          <el-tab-pane :label="`全部 (${numberlb})`"></el-tab-pane>
          <el-tab-pane
            class="tab-paness"
            :key="item.title"
            v-for="(item, index) in editableTabs"
          >
            <span slot="label">
              {{
                item.title + " (" + item.number + ")"
              }}&nbsp&nbsp&nbsp<el-popover
                placement="top-start"
                width="100"
                trigger="hover"
              >
                <div style="text-align: center">
                  <el-button type="text" @click="popoveramend(item)"
                    >修改</el-button
                  ><el-button type="text" @click="deletefenlei(item)"
                    ><span style="color: rgb(173, 55, 55)"
                      >删除</span
                    ></el-button
                  >
                </div>
                <i slot="reference" class="el-icon-share"></i> </el-popover
            ></span>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- ä¸­éƒ¨æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top" v-if="topactiveName">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">本地库 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">共享库 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--用户数据-->
          <el-col :span="24" :xs="24">
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="98px"
            >
              <el-form-item label="名称" prop="userName">
                <el-input
                  v-model="queryParams.userName"
                  placeholder="请输入"
                  clearable
                  style="width: 200px"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="适用疾病" prop="status">
                <el-cascader
                  v-model="queryParams.status"
                  :options="optionss"
                  :props="propss"
                  clearable
                ></el-cascader>
              </el-form-item>

              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="medium"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="medium"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>
            <el-divider></el-divider>
            <el-table
              v-loading="loading"
              :data="userList"
              :border="true"
              highlight-current-row
              @selection-change="handleSelectionChange"
              @current-change="handleCurrentChange"
            >
              <el-table-column type="selection" width="50" align="center" />
              <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"
                key="nickName"
                prop="nickName"
                :show-overflow-tooltip="true"
              />

              <el-table-column
                label="适用疾病"
                align="center"
                key="aphonenumber"
                prop="aphonenumber"
                width="120"
              /><el-table-column
                label="描述"
                align="center"
                key="bphonenumber"
                prop="bphonenumber"
                width="120"
              />
              <el-table-column
                label="最近编辑"
                align="center"
                key="cphonenumber"
                prop="cphonenumber"
                width="120"
              />
            </el-table>

            <pagination
              v-show="total > 0"
              :total="total"
              :page.sync="queryParams.pageNum"
              :limit.sync="queryParams.pageSize"
              @pagination="getList"
            />
          </el-col>
        </el-row>

        <!-- æ·»åŠ æˆ–修改配置对话框 -->
        <el-dialog
          :title="title"
          :visible.sync="open"
          width="900px"
          append-to-body
        >
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">ç¡® å®š</el-button>
            <el-button @click="cancel">取 æ¶ˆ</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="sidecolumn">
      <h3>操作</h3>
      <div>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-plus"
              size="medium"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
              >新增</el-button
            >
          </el-col>

          <el-col :span="1.5">
            <el-button
              type="danger"
              plain
              icon="el-icon-delete"
              size="medium"
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
              >删除</el-button
            >
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="1.5">
            <el-button
              type="success"
              plain
              icon="el-icon-edit"
              size="medium"
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['system:user:remove']"
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-share"
              size="medium"
              :disabled="single"
              @click="ViewQuestionnaire"
              v-hasPermi="['system:user:remove']"
              >查看</el-button
            >
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- æ·»åŠ ç±»åˆ«å¼¹æ¡† -->
    <el-dialog
      :title="amendtag ? '修改类别' : '新增类别'"
      width="30%"
      :visible.sync="dialogFormVisible"
    >
      <el-form :model="classifyform">
        <el-form-item
          :label="amendtag ? '请输入新的类别名称' : '请输入类别名称'"
        >
          <el-input
            v-model="classifyform.categoryname"
            autocomplete="off"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="submitsidecolumn">ç¡® å®š</el-button>
      </div>
    </el-dialog>
    <!-- åˆ é™¤ç±»åˆ«ç¡®è®¤æ¡† -->
    <el-dialog title="警告" :visible.sync="deleteVisible" width="40%">
      <div style="font-size: 20px; color: rgb(247, 76, 76)">
        æ˜¯å¦ç¡®è®¤åˆ é™¤åˆ†ç±»ï¼š[<span>{{ deletefenl }}</span
        >]?
      </div>
      <div style="font-size: 20px">
        æ­¤æ“ä½œä¼šå°†è¯¥ç±»åˆ«ä¸‹æ‰€æœ‰æ¨¡å—转移至[未分类]，是否继续删除此分类？
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="deleteVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="deletefenlei">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { listUser, delUser, addUser, updateUser } from "@/api/system/user";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "", //控制右侧数据顶部tab展示
      loading: false, //遮罩层
      Typecontrol: true, //侧边类型展示控制
      Sidecontrol: true, //侧边树展示控制
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      //   å•ä¸ªé€‰ä¸­
      MultipleC: false,
      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 0,
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®

      userList: [
        {
          userid: 1,
          userName: "三号",
          nickName: "1.2.4",
          aphonenumber: "关节炎症",
          bphonenumber: "重度",
          cphonenumber: "2022-12-12 ",
        },
        {
          userid: 2,
          userName: "一号",
          nickName: "1.2.4",
          aphonenumber: "高血压",
          bphonenumber: "中度",
          cphonenumber: "2022-12-12 ",
        },
        {
          userid: 3,
          userName: "一号",
          nickName: "1.2.4",
          aphonenumber: "高血压",
          bphonenumber: "中度",
          cphonenumber: "2022-12-12 ",
        },
      ],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      numberlb: 22,
      numberlbs: 2,
      sidecolumnform: {}, //添加类别表单
      sidecolumnval: "", //类别搜索
      propss: { multiple: true },
      idds: "",
      amendtag: false, //是否修改类别
      dialogFormVisible: false, //修改添加类别弹框
      deleteVisible: false, //分类删除弹框
      deletefenl: "高血压", //删除项
      //类别表单
      classifyform: {
        categoryname: "",
      },
      //   å¤šé€‰åˆ—表
      optionss: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      //类别列表
      editableTabs: [
        {
          title: "分类一",
          number: "1",
        },
        {
          title: "分类二",
          number: "2",
        },
        {
          title: "分类三",
          number: "2",
        },
        {
          title: "分类四",
          number: "2",
        },
        {
          title: "分类五",
          number: "2",
        },
      ],
      // æŸ¥è¯¢å‚æ•°
      queryParams: {},
      currentRow: null, //选中行数据
    };
  },
  watch: {},
  created() {
    this.getList();
  },

  methods: {
    /** æŸ¥è¯¢ç”¨æˆ·åˆ—表 */
    getList() {
      //   this.loading = true;
      listUser().then((response) => {
        console.log(response);
        // this.userList = response.data;
        // this.total = response.total;
        // this.loading = false;
        console.log(this.userList);
      });
      //   const { rows } = await listUser();
      //   console.log(rows);
      //   this.list = rows;
    },
    // é€‰ä¸­è¡Œè§¦å‘
    handleCurrentChange(val) {
      this.currentRow = val;
      console.log(val);
    },
    // æ·»åŠ ã€ä¿®æ”¹ç±»åˆ«
    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.title;
      }
    },
    //搜索类别
    sidecolumnss() {},
    // åˆ‡æ¢å…±äº«/本地
    tophandleClick() {},
    // ä¿®æ”¹å–消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {};
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {},
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate() {},
    // æŸ¥çœ‹
    ViewQuestionnaire() {},
    /** æ›´æ–°/修改提交按钮 */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          if (this.form.userId != undefined) {
            // updateUser(this.form).then((response) => {
            //   this.$modal.msgSuccess("修改成功");
            //   this.open = false;
            //   this.getList();
            // });
          } else {
            // addUser(this.form).then((response) => {
            //   this.$modal.msgSuccess("新增成功");
            //   this.open = false;
            //   this.getList();
            // });
          }
        }
      });
    },
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 300px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.sidecolumn-top {
  display: flex;
  justify-content: space-between;
  .top-wj {
    font-size: 20px;
  }
  .top-tj {
    font-size: 18px;

    color: rgb(0, 89, 255);
    cursor: pointer;
  }
}
.center-ss {
  margin-top: 30px;
  .input-with-select {
    height: 40px !important;
  }
}
.bottom-fl {
  margin-top: 30px;
  display: center !important;
}

::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  font-size: 20px;
}
.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
</style>

 src/views/tool/module/classifythreea.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,792 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn" v-if="Sidecontrol">
      <div v-if="Typecontrol">
        <div class="sidecolumn-top">
          <div class="top-wj">类型</div>
          <div class="top-tj" @click="dialogFormVisible = true">+添加</div>
        </div>
        <div class="center-ss">
          <el-input
            placeholder="请输入内容"
            v-model="sidecolumnval"
            class="input-with-select"
            size="medium "
          >
            <el-button
              @click="sidecolumnss"
              slot="append"
              icon="el-icon-search"
            ></el-button>
          </el-input>
        </div>
      </div>

      <div class="bottom-fl">
        <el-tabs tab-position="right">
          <el-tab-pane :label="`全部 (${numberlb})`"></el-tab-pane>
          <el-tab-pane
            class="tab-paness"
            :key="item.title"
            v-for="(item, index) in editableTabs"
          >
            <span slot="label">
              {{
                item.title + " (" + item.number + ")"
              }}&nbsp&nbsp&nbsp<el-popover
                placement="top-start"
                width="100"
                trigger="hover"
              >
                <div style="text-align: center">
                  <el-button type="text" @click="popoveramend(item)"
                    >修改</el-button
                  ><el-button type="text" @click="deletefenlei(item)"
                    ><span style="color: rgb(173, 55, 55)"
                      >删除</span
                    ></el-button
                  >
                </div>
                <i slot="reference" class="el-icon-share"></i> </el-popover
            ></span>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
    <!-- ä¸­éƒ¨æ•°æ® -->
    <div class="leftvlue">
      <div class="leftvlue-top" v-if="topactiveName">
        <el-tabs v-model="topactiveName" @tab-click="tophandleClick">
          <el-tab-pane name="Local">
            <span class="mulsz" slot="label">本地库 </span>
          </el-tab-pane>
          <el-tab-pane name="sharing">
            <span class="mulsz" slot="label">共享库 </span>
          </el-tab-pane>
        </el-tabs>
      </div>
      <div class="leftvlue-bg">
        <el-row :gutter="20">
          <!--用户数据-->
          <el-col :span="24" :xs="24">
            <el-form
              :model="queryParams"
              ref="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
              label-width="98px"
            >
              <el-form-item label="名称" prop="userName">
                <el-input
                  v-model="queryParams.userName"
                  placeholder="请输入"
                  clearable
                  style="width: 200px"
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="适用疾病" prop="status">
                <el-cascader
                  v-model="queryParams.status"
                  :options="optionss"
                  :props="propss"
                  clearable
                ></el-cascader>
              </el-form-item>

              <el-form-item>
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="medium"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  icon="el-icon-refresh"
                  size="medium"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>

            <el-collapse v-model="activeNames">
              <el-collapse-item title="一号表格" name="1">
                <el-table
                  v-loading="loading"
                  :data="userList"
                  ref="singone"
                  :border="true"
                  highlight-current-row
                  @selection-change="handleSelectionChange"
                  @current-change="handleCurrentChange"
                >
                  <el-table-column type="selection" width="50" align="center" />
                  <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"
                    key="nickName"
                    prop="nickName"
                    :show-overflow-tooltip="true"
                  />

                  <el-table-column
                    label="适用疾病"
                    align="center"
                    key="aphonenumber"
                    prop="aphonenumber"
                    width="120"
                  /><el-table-column
                    label="描述"
                    align="center"
                    key="bphonenumber"
                    prop="bphonenumber"
                    width="120"
                  />
                  <el-table-column
                    label="最近编辑"
                    align="center"
                    key="cphonenumber"
                    prop="cphonenumber"
                    width="120"
                  />
                </el-table>
                <pagination
                  v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList"
                />
              </el-collapse-item>
              <el-collapse-item title="二号表格" name="2">
                <el-table
                  v-loading="loading"
                  ref="singtwo"
                  :data="userListmax"
                  :border="true"
                  highlight-current-row
                  @selection-change="handleSelectiontwo"
                  @current-change="handleCurrenttwo"
                >
                  <el-table-column type="selection" width="50" align="center" />
                  <el-table-column
                    label="序号"
                    align="center"
                    key="userids"
                    prop="userids"
                  />
                  <el-table-column
                    label="名称"
                    align="center"
                    key="userName"
                    prop="userName"
                    :show-overflow-tooltip="true"
                  />
                  <el-table-column
                    label="版本"
                    align="center"
                    key="nickName"
                    prop="nickName"
                    :show-overflow-tooltip="true"
                  />

                  <el-table-column
                    label="适用疾病"
                    align="center"
                    key="aphonenumber"
                    prop="aphonenumber"
                    width="120"
                  /><el-table-column
                    label="描述"
                    align="center"
                    key="bphonenumber"
                    prop="bphonenumber"
                    width="120"
                  />
                  <el-table-column
                    label="最近编辑"
                    align="center"
                    key="cphonenumber"
                    prop="cphonenumber"
                    width="120"
                  />
                </el-table>
                <pagination
                  v-show="total > 0"
                  :total="total"
                  :page.sync="queryParams.pageNum"
                  :limit.sync="queryParams.pageSize"
                  @pagination="getList"
                />
              </el-collapse-item>
            </el-collapse>
          </el-col>
        </el-row>

        <!-- æ·»åŠ æˆ–修改配置对话框 -->
        <el-dialog
          :title="title"
          :visible.sync="open"
          width="900px"
          append-to-body
        >
          <div slot="footer" class="dialog-footer">
            <el-button type="primary" @click="submitForm">ç¡® å®š</el-button>
            <el-button @click="cancel">取 æ¶ˆ</el-button>
          </div>
        </el-dialog>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="sidecolumn">
      <h3>操作</h3>
      <div>
        <h5>一号表</h5>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-plus"
              size="medium"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
              >新增</el-button
            >
          </el-col>

          <el-col :span="1.5">
            <el-button
              type="danger"
              plain
              icon="el-icon-delete"
              size="medium"
              :disabled="multiple"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
              >删除</el-button
            >
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="1.5">
            <el-button
              type="success"
              plain
              icon="el-icon-edit"
              size="medium"
              :disabled="single"
              @click="handleUpdate"
              v-hasPermi="['system:user:remove']"
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-share"
              size="medium"
              :disabled="single"
              @click="ViewQuestionnaire"
              v-hasPermi="['system:user:remove']"
              >查看</el-button
            >
          </el-col>
        </el-row>
      </div>
      <el-divider></el-divider>

      
      <div>
        <h5>二号表</h5>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-plus"
              size="medium"
              @click="handleAdd"
              v-hasPermi="['system:user:add']"
              >新增</el-button
            >
          </el-col>

          <el-col :span="1.5">
            <el-button
              type="danger"
              plain
              icon="el-icon-delete"
              size="medium"
              :disabled="multipletwo"
              @click="handleDelete"
              v-hasPermi="['system:user:remove']"
              >删除</el-button
            >
          </el-col>
        </el-row>
        <el-row :gutter="10">
          <el-col :span="1.5">
            <el-button
              type="success"
              plain
              icon="el-icon-edit"
              size="medium"
              :disabled="singletwo"
              @click="handleUpdate"
              v-hasPermi="['system:user:remove']"
              >修改</el-button
            >
          </el-col>
          <el-col :span="1.5">
            <el-button
              type="primary"
              plain
              icon="el-icon-share"
              size="medium"
              :disabled="singletwo"
              @click="ViewQuestionnaire"
              v-hasPermi="['system:user:remove']"
              >查看</el-button
            >
          </el-col>
        </el-row>
      </div>
    </div>
    <!-- æ·»åŠ ç±»åˆ«å¼¹æ¡† -->
    <el-dialog
      :title="amendtag ? '修改类别' : '新增类别'"
      width="30%"
      :visible.sync="dialogFormVisible"
    >
      <el-form :model="classifyform">
        <el-form-item
          :label="amendtag ? '请输入新的类别名称' : '请输入类别名称'"
        >
          <el-input
            v-model="classifyform.categoryname"
            autocomplete="off"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="submitsidecolumn">ç¡® å®š</el-button>
      </div>
    </el-dialog>
    <!-- åˆ é™¤ç±»åˆ«ç¡®è®¤æ¡† -->
    <el-dialog title="警告" :visible.sync="deleteVisible" width="40%">
      <div style="font-size: 20px; color: rgb(247, 76, 76)">
        æ˜¯å¦ç¡®è®¤åˆ é™¤åˆ†ç±»ï¼š[<span>{{ deletefenl }}</span
        >]?
      </div>
      <div style="font-size: 20px">
        æ­¤æ“ä½œä¼šå°†è¯¥ç±»åˆ«ä¸‹æ‰€æœ‰æ¨¡å—转移至[未分类]，是否继续删除此分类？
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="deleteVisible = false">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="deletefenlei">ç¡® å®š</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { listUser, delUser, addUser, updateUser } from "@/api/system/user";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  name: "questionnaire",
  dicts: ["sys_normal_disable", "sys_user_sex"],
  components: { Treeselect },
  data() {
    return {
      topactiveName: "", //控制右侧数据顶部tab展示
      loading: false, //遮罩层
      Typecontrol: true, //侧边类型展示控制
      Sidecontrol: true, //侧边树展示控制
      // é€‰ä¸­æ•°ç»„
      ids: [],
      // éžå•ä¸ªç¦ç”¨
      single: true,
      singletwo: true,
      // éžå¤šä¸ªç¦ç”¨
      multiple: true,
      multipletwo: true,

      // æ˜¾ç¤ºæœç´¢æ¡ä»¶
      showSearch: true,
      // æ€»æ¡æ•°
      total: 2,
      activeNames: ["1", "2"],
      // ç”¨æˆ·è¡¨æ ¼æ•°æ®
      userList: [
        {
          userid: 1,
          userName: "三号",
          nickName: "1.2.4",
          aphonenumber: "关节炎症",
          bphonenumber: "重度",
          cphonenumber: "2022-12-12 ",
        },
        {
          userid: 2,
          userName: "一号",
          nickName: "1.2.4",
          aphonenumber: "高血压",
          bphonenumber: "中度",
          cphonenumber: "2022-12-12 ",
        },
      ],
      userListmax: [
        {
          userids: 1,
          userName: "三号",
          nickName: "1.2.4",
          aphonenumber: "关节炎症",
          bphonenumber: "重度",
          cphonenumber: "2022-12-12 ",
        },
        {
          userids: 2,
          userName: "一号",
          nickName: "1.2.4",
          aphonenumber: "高血压",
          bphonenumber: "中度",
          cphonenumber: "2022-12-12 ",
        },
        {
          userids: 2,
          userName: "一号",
          nickName: "1.2.4",
          aphonenumber: "高血压",
          bphonenumber: "中度",
          cphonenumber: "2022-12-12 ",
        },
      ],
      // å¼¹å‡ºå±‚标题
      title: "",
      // æ˜¯å¦æ˜¾ç¤ºå¼¹å‡ºå±‚
      open: false,
      // æ—¥æœŸèŒƒå›´
      dateRange: [],
      // å²—位选项
      postOptions: [],
      // è§’色选项
      roleOptions: [],
      // è¡¨å•å‚æ•°
      form: {},
      numberlb: 22,
      numberlbs: 2,
      sidecolumnform: {}, //添加类别表单
      sidecolumnval: "", //类别搜索
      propss: { multiple: true },
      idds: "",
      amendtag: false, //是否修改类别
      dialogFormVisible: false, //修改添加类别弹框
      deleteVisible: false, //分类删除弹框
      deletefenl: "高血压", //删除项
      //类别表单
      classifyform: {
        categoryname: "",
      },
      //   å¤šé€‰åˆ—表
      optionss: [
        {
          value: 1,
          label: "东南",
        },
        {
          value: 2,
          label: "西北",
        },
        {
          value: 3,
          label: "仨仨仨",
        },
        {
          value: 4,
          label: "六飒飒飒",
        },
      ],
      //类别列表
      editableTabs: [
        {
          title: "分类一",
          number: "1",
        },
        {
          title: "分类二",
          number: "2",
        },
        {
          title: "分类三",
          number: "2",
        },
        {
          title: "分类四",
          number: "2",
        },
        {
          title: "分类五",
          number: "2",
        },
      ],
      // æŸ¥è¯¢å‚æ•°
      queryParams: {},
      currentRow: null, //选中行数据
    };
  },
  watch: {},
  created() {
    this.getList();
  },

  methods: {
    /** æŸ¥è¯¢ç”¨æˆ·åˆ—表 */
    getList() {
      //   this.loading = true;
      listUser().then((response) => {
        console.log(response);
        // this.userList = response.data;
        // this.total = response.total;
        // this.loading = false;
        console.log(this.userList);
      });
      //   const { rows } = await listUser();
      //   console.log(rows);
      //   this.list = rows;
    },
    // ä¸€å·è¡¨é€‰ä¸­è¡Œè§¦å‘
    handleCurrentChange(val) {
      this.currentRow = val;
      this.single = false;
      this.multiple = false;
      //   æ¸…除非当前表单选中状态

      // this.$refs.singtwo.setCurrentRow();
      console.log(this.currentRow);

      console.log(val);
    },
    handleCurrenttwo(val) {
      this.currentRow = val;
      this.singletwo = false;
      this.multipletwo = false;
      //   æ¸…除非当前表单选中状态

      // this.$refs.singone.setCurrentRow();
      console.log(this.currentRow);
      console.log(val);
    },
    // å¤šé€‰æ¡†é€‰ä¸­æ•°æ®
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    handleSelectiontwo(selection) {
      this.ids = selection.map((item) => item.userId);
      this.singletwo = selection.length != 1;
      this.multipletwo = !selection.length;
    },

    // æ·»åŠ ã€ä¿®æ”¹ç±»åˆ«
    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.title;
      }
    },
    //搜索类别
    sidecolumnss() {},
    // åˆ‡æ¢å…±äº«/本地
    tophandleClick() {},
    // ä¿®æ”¹å–消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // è¡¨å•é‡ç½®
    reset() {
      this.form = {};
      this.resetForm("form");
    },
    /** æœç´¢æŒ‰é’®æ“ä½œ */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** é‡ç½®æŒ‰é’®æ“ä½œ */
    resetQuery() {
      this.dateRange = [];
      this.resetForm("queryForm");
      this.queryParams.deptId = undefined;
      this.$refs.tree.setCurrentKey(null);
      this.handleQuery();
    },

    /** æ–°å¢žæŒ‰é’®æ“ä½œ */
    handleAdd() {},
    /** ä¿®æ”¹æŒ‰é’®æ“ä½œ */
    handleUpdate() {},
    // æŸ¥çœ‹
    ViewQuestionnaire() {},
    /** æ›´æ–°/修改提交按钮 */
    submitForm() {},
    /** åˆ é™¤æŒ‰é’®æ“ä½œ */
    handleDelete(row) {
      const userIds = row.userId || this.ids;
      this.$modal
        .confirm('是否确认删除用户编号为"' + userIds + '"的数据项？')
        .then(function () {
          return delUser(userIds);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 300px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  margin-top: 20px;
  margin: 20px;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}

.sidecolumn-top {
  display: flex;
  justify-content: space-between;
  .top-wj {
    font-size: 20px;
  }
  .top-tj {
    font-size: 18px;

    color: rgb(0, 89, 255);
    cursor: pointer;
  }
}
.center-ss {
  margin-top: 30px;
  .input-with-select {
    height: 40px !important;
  }
}
.bottom-fl {
  margin-top: 30px;
  display: center !important;
}

::v-deep.el-tabs--left,
.el-tabs--right {
  overflow: hidden;
  align-items: center;
  display: flex;
}
::v-deep.el-input--medium .el-input__inner {
  height: 40px !important;
}
::v-deep.el-tabs--right .el-tabs__active-bar.is-right {
  height: 40px;
  width: 5px;
  left: 0;
}
::v-deep.el-tabs--right .el-tabs__item.is-right {
  display: block;
  font-size: 20px;
}
.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .mulsz {
    font-size: 20px;
  }
}
.button-text {
  color: rgb(70, 204, 238);
}
.button-textck {
  color: rgb(39, 167, 67);
}
.button-textxg {
  color: rgb(35, 81, 233);
}
.button-textsc {
  color: rgb(235, 23, 23);
}
</style>

 src/views/tool/module/classifytwo.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,177 @@
<template>
  <div class="Questionnairemanagement">
    <!-- å·¦ä¾§æ  -->
    <div class="sidecolumn">
      <div style="height: 400px">
        <el-steps direction="vertical" :active="Editprogress">
          <el-step title="第一步"></el-step>
          <el-step title="第二步"></el-step>
          <el-step
            title="第三步"
            description="这是一段很长很长很长的描述性文字"
          ></el-step>
          <el-step
            title="第四部"
            description="这是一段很长很长很长的描述性文字"
          ></el-step>
        </el-steps>
      </div>
    </div>
    <!-- å³ä¾§æ•°æ® -->
    <div class="leftvlue">
      <!-- åŸºæœ¬ä¿¡æ¯ -->
      <div v-if="Editprogress == 1">
        <div class="leftvlue-jbxx">第一部分</div>
        <el-button type="success" @click="submitForm('ruleForm')"
          >下一步</el-button
        >
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </div>
      <!-- é—®å·è®¾ç½® -->
      <div v-if="Editprogress == 2">
        <div class="leftvlue-jbxx">第二部分</div>
        <el-button type="success" @click="submitForm('ruleForm')"
          >下一步</el-button
        >
        <el-button type="primary" @click="laststep()">上一步</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </div>
      <!-- é—®å·é¢„览 -->
      <div v-if="Editprogress == 3">
        <div class="leftvlue-jbxx">第三部分</div>
        <el-button type="success" @click="submitForm('ruleForm')"
          >下一步</el-button
        >
        <el-button type="primary" @click="laststep()">上一步</el-button>
        <!-- <el-button @click="resetForm('ruleForm')">重置</el-button> -->
      </div>
      <!-- ç»“果反馈 -->
      <div v-if="Editprogress == 4">
        <div class="leftvlue-jbxx">第四部分</div>
        <el-button type="success" @click="submitForm('ruleForm')"
          >立即创建</el-button
        >
        <el-button type="primary" @click="laststep()">上一步</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      Editprogress: 1, //编辑进度
      loading: false, // é®ç½©å±‚
    };
  },

  created() {},

  methods: {
    // ä¸‹ä¸€æ­¥
    submitForm(formName) {
      if (this.Editprogress <= 3) {
        return this.Editprogress++;
      }
      // æäº¤
      // this.$refs[formName].validate((valid, object) => {
      //   if (valid) {
      //     alert("submit!");
      //   } else {
      //     console.log("error submit!!", object);
      //     return false;
      //   }
      // });
    },
    // ä¸Šä¸€æ­¥
    laststep() {
      this.Editprogress--;
    },
    // æäº¤è¡¨å•
    resetForm(formName) {
      this.$refs[formName].resetFields();
    },
  },
};
</script>

<style lang="scss" scoped>
.Questionnairemanagement {
  display: flex;
}
.sidecolumn {
  width: 300px;
  min-height: 100vh;
  text-align: center;
  //   display: flex;
  //   margin-top: 20px;
  margin: 20px;
  margin-bottom: 0;
  padding: 30px;
  background: #edf1f7;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
}
.leftvlue {
  //   display: flex;
  //   flex: 1;
  width: 80%;
  margin-top: 20px;
  //   margin: 20px;
  padding: 30px;
  background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .leftvlue-jbxx {
    margin-bottom: 50px;
    font-size: 20px;
    span {
      position: absolute;
      right: 80px;
    }
  }
}
::v-deep .addtopic-input {
  input {
    background: #02a7f0;
    color: #edf1f7;
    width: 150px;
  }
}
::v-deep.el-step.is-vertical .el-step__title {
  font-size: 25px;
}
::v-deep.el-input--medium {
  font-size: 24px !important;
}
::v-deep.ruleFormaa.el-select {
  display: inline-block;
  position: relative;
  width: 700px;
}
.el-select__tags {
  font-size: 20px;
  max-width: 888px !important;
}
::v-deep.el-radio__inner {
  width: 22px;
  height: 22px;
}
// ::v-deep.topic-dev.el-radio__label {
//   font-size: 24px;
// }
::v-deep.el-radio-group {
  span {
    font-size: 24px;
  }
}
::v-deep.el-checkbox-group {
  span {
    font-size: 24px;
  }
}
</style>

 src/websocket/lemon-message-voice.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,31 @@
<script>
export default {
  name: "lemonMessageVoice",
  inheritAttrs: false,
  inject: ["IMUI"],
  render(h) {
    return h("lemon-message-basic", {
      class: "lemon-message-voice",
      props: { ...this.$attrs, avatar: "default-avatar-url" }, // Provide a default value for avatar
      scopedSlots: {
        content: (props) => {
          return h("span", [props.content, "\u00A0🔈"]);
        },
      },
    });
  },
};
</script>
<style lang="scss">
.lemon-message.lemon-message-voice {
  user-select: none;
  .lemon-message__content {
    border: 2px solid #000;
    font-size: 12px;
    cursor: pointer;
    &::before {
      display: none;
    }
  }
}
</style>

 src/websocket/websocket.js

@@ -16,13 +16,13 @@
 * å‘èµ·websocket连接
 * @param {Object} agentData éœ€è¦å‘后台传递的参数数据
 */
function websocketSend (agentData) {
export function websocketSend (agentData) {
  // åŠ å»¶è¿Ÿæ˜¯ä¸ºäº†å°½é‡è®©ws连接状态变为OPEN   
  setTimeout(() => { 
    // æ·»åŠ çŠ¶æ€åˆ¤æ–­ï¼Œå½“为OPEN时，发送消息
    if (websock.readyState === websock.OPEN) { // websock.OPEN = 1 
      // å‘给后端的数据需要字符串化
      websock.send(JSON.stringify(agentData))
      websock.send(agentData)
      console.log('连接成功');
    }
    if (websock.readyState === websock.CLOSED) { // websock.CLOSED = 3 

 vue.config.js

@@ -37,6 +37,7 @@
      [process.env.VUE_APP_BASE_API]: {
        target1: `http://192.168.1.4:8080`,
        target: `http://192.168.1.4:8080`,
        // target: `http://www.hxsoft.com:8080`,
        changeOrigin: true,
        pathRewrite: {
          ['^' + process.env.VUE_APP_BASE_API]: ''
@@ -129,7 +130,7 @@
          config.optimization.runtimeChunk('single'),
          {
             from: path.resolve(__dirname, './public/robots.txt'), //防爬虫文件
             to: './' //到根目录下
             to: '/' //到根目录下
          }
        }
      )