Merge branch 'all-v4' into 'all-v4-qindao'

# Conflicts:
#   src/views/message/systemNotifications/systemNotifications.vue

src/views/message/questionNotifications/components/problemHandleTable.vue

@@ -0,0 +1,242 @@
+<template>
+  <div>
+    <div style="padding-bottom: 24px; border-top: 1px solid rgba(0, 0, 0, 0.06)">
+      <div class="pushWorkShopBar">
+        <span class="pushiWorkShopSpan">选择推送范围：</span>
+        <el-select
+          v-model="cameraChosen"
+          multiple
+          collapse-tags
+          collapse-tags-tooltip
+          placeholder="请选择相机"
+          style="width: 258px"
+          @click="handleWorkShopEdit"
+          @change="handleWorkShopEdit"
+        >
+          <el-option
+            v-for="item in options"
+            :key="item.value"
+            :label="item.label"
+            :value="item.value"
+          />
+        </el-select>
+        <!-- <img src="../img/edit.png" @click="handleWorkShopEdit()" /> -->
+      </div>
+      <div class="descriptionSpan"
+        >当所选相机下发生违规问题并需要闭环处理时，系统将依据下方各阶段配置（开关启用后）自动发送待办消息！</div
+      >
+    </div>
+
+    <el-scrollbar>
+      <ManageContent />
+    </el-scrollbar>
+
+    <el-dialog
+      v-model="workDialog"
+      title="选择相机范围"
+      align-center
+      :close-on-click-modal="false"
+      style="height: 583px"
+      :width="731"
+      :destroy-on-close="true"
+      class="workShopDialog"
+    >
+      <!-- <WorkShopTree @cancel="handleCancle" @submit="handleSubmit" :selectedUser="selectedUser" /> -->
+      <WorkShopTree
+        @cancel="handleCancle"
+        :selectedUser="selectedUser"
+        :re-fresh-camera="setCameraChosen"
+      />
+    </el-dialog>
+    <el-dialog
+      v-model="showDialog"
+      title="编辑推送文案"
+      align-center="true"
+      width="400"
+      @close="closeDialog()"
+      :close-on-click-modal="false"
+      class="contentDialog"
+    >
+      <el-input
+        v-model="content"
+        style="width: 370px"
+        :autosize="{ minRows: 4, maxRows: 5 }"
+        maxlength="100"
+        show-word-limit
+        type="textarea"
+        placeholder="请输入推送文案"
+      />
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="closeDialog()">取消</el-button>
+          <el-button type="primary" @click="submitDialog()">确认</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { ref, onMounted, computed } from 'vue';
+  import {
+    queryIssueProcessMessage,
+    modifyContent,
+    modifyWorkshopList,
+    queryWorkshopNamebyIds,
+    getPushRange,
+  } from '@/api/message/question-notifications';
+
+  import WorkShopTree from './WorkShopTree.vue';
+  import ManageContent from './ManageContent.vue';
+  import { ElMessage } from 'element-plus';
+  import { treeSelected } from '../type';
+
+  const cameraChosen = ref<any>([]);
+
+  const options = computed(() => {
+    return cameraChosen.value.map((item: any) => {
+      return {
+        value: item,
+        label: item,
+      };
+    });
+  });
+
+  const setCameraChosen = (arr: treeSelected[]) => {
+    cameraChosen.value = arr.map((arr) => arr.name);
+    workDialog.value = false;
+  };
+  const workDialog = ref<boolean>(false);
+  const showDialog = ref<boolean>(false);
+  const content = ref<string>('');
+
+  const editId = ref<number>(0);
+  const handleWorkShopEdit = () => {
+    workDialog.value = true;
+  };
+
+  const submitDialog = () => {
+    modifyContent(content.value, editId.value)
+      .then(() => {
+        ElMessage({
+          message: '修改成功',
+          type: 'success',
+          plain: true,
+        });
+        closeDialog();
+      })
+      .catch((error) => {
+        console.error(error);
+      });
+  };
+
+  const closeDialog = () => {
+    showDialog.value = false;
+  };
+  interface UserList {
+    code: number | string;
+    name: string;
+    id: number;
+  }
+  const selectedUser = ref<UserList[]>([]);
+
+  const handleCancle = () => {
+    workDialog.value = false;
+  };
+
+  const handleSubmit = (selectedData: UserList[]) => {
+    const params = selectedData.map((item) => item.id);
+    modifyWorkshopList(params).then(() => {
+      ElMessage({
+        message: '添加成功',
+        type: 'success',
+        plain: true,
+      });
+      workDialog.value = false;
+      // queryIssueData();
+    });
+  };
+
+  const initCameraChosen = () => {
+    getPushRange().then((res) => {
+      cameraChosen.value = res.map((res) => res.name);
+    });
+  };
+  onMounted(() => {
+    initCameraChosen();
+  });
+</script>
+<style lang="scss" scoped>
+  .pushWorkShopBar {
+    margin: 11px 0 8px 0;
+    display: flex;
+    img {
+      cursor: pointer;
+    }
+    // :nth-of-type(1) {
+    //   margin-right: 12px;
+    //   margin-bottom: 16px;
+    // }
+    .pushiWorkShopSpan {
+      // width: 56px;
+      height: 32px;
+      font-weight: 600;
+      font-size: 14px;
+      color: rgba(0, 0, 0, 0.85);
+      line-height: 32px;
+    }
+  }
+  .descriptionSpan {
+    // width: 300px;
+    margin-left: 100px;
+    height: 10px;
+    font-weight: 400;
+    font-size: 10px;
+    color: #a8abb2;
+    line-height: 10px;
+  }
+  .workshopList {
+    display: flex;
+    .left {
+      display: flex;
+      flex-wrap: wrap;
+      width: 95%;
+      max-height: 24px;
+      overflow-y: hidden;
+      gap: 20px;
+    }
+    .right {
+      flex: 1;
+      cursor: pointer;
+      span {
+        font-weight: 400;
+        font-size: 12px;
+        color: #303133;
+        line-height: 17px;
+      }
+      img {
+        margin-left: 4px;
+      }
+    }
+  }
+  .emptyDiv {
+    margin-top: 78px;
+    margin: auto;
+    width: 396px;
+    .emptyImg {
+      height: 257px;
+    }
+    .emptySpan {
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 400;
+      font-size: 18px;
+      color: rgba(0, 0, 0, 0.45);
+      text-align: left;
+      font-style: normal;
+    }
+  }
+  .operation {
+    display: flex;
+    justify-content: center;
+    width: 100%;
+  }
+</style>