【ID1000410】后台管理系统-情况说明管理页面研发完成35%

src/api/PartyBuildingMgr/SituationDesc.js

@@ -1,12 +1,44 @@
 import request from '@/utils/request'
 
-/**
- * 文件预览
- */
-export function viewPdfFile(query) {
+// 查询列表
+export function listSituationDesc(query) {
   return request({
-    url: '/file/viewfile',
+    url: '/town/partymemberconditionlog/list',
     method: 'get',
     params: query
   })
-}
+}
+
+// 查询详细
+export function viewSituationDesc(id) {
+  return request({
+    url: '/town/partymemberconditionlog/' + id,
+    method: 'get'
+  })
+}
+
+// 新增
+export function addSituationDesc(data) {
+  return request({
+    url: '/town/partymemberconditionlog',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改
+export function updateSituationDesc(data) {
+  return request({
+    url: '/town/partymemberconditionlog',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除
+export function delSituationDesc(id) {
+  return request({
+    url: '/town/partymemberconditionlog/' + id,
+    method: 'delete'
+  })
+}

src/views/PartyBuildingMgr/SituationDesc/SituationDescIndex.vue

@@ -3,7 +3,7 @@
  * @Author: Rockery
  * @Date: 2021-12-10 10:45:58
  * @LastEditors: Rockery
- * @LastEditTime: 2021-12-28 18:04:54
+ * @LastEditTime: 2021-12-29 15:23:58
  * @FilePath: \party_construct_web\src\views\PartyBuildingMgr\SituationDesc\SituationDescIndex.vue
  * @Copyright: Copyright (c) 2016~2021 Rockery(1113269755@qq.com)
 -->
@@ -36,6 +36,7 @@
                     type="date"
                     size="small"
                     clearable
+                    format="yyyy年MM月dd日"
                     value-format="yyyy-MM-dd"
                     style="width: 100%;"
                     placeholder="请选择开始时间"
@@ -47,6 +48,7 @@
                     type="date"
                     size="small"
                     clearable
+                    format="yyyy年MM月dd日"
                     value-format="yyyy-MM-dd"
                     style="width: 100%;"
                     placeholder="请选择结束时间"
@@ -176,6 +178,7 @@
                   v-model="addPageFormObj.formModel.name"
                   type="date"
                   clearable
+                  format="yyyy年MM月dd日"
                   value-format="yyyy-MM-dd"
                   style="width: 100%;"
                   placeholder="请选择情况说明时间"
@@ -186,9 +189,10 @@
               <el-form-item label="情况说明人:" prop="explainer">
                 <el-select
                   v-model="addPageFormObj.formModel.explainer"
-                  placeholder="请选择情况说明人"
                   clearable
+                  filterable
                   style="width: 100%;"
+                  placeholder="请选择情况说明人"
                 >
                   <el-option
                     v-for="situationExplainerOption in situationExplainerOptions"
@@ -200,47 +204,12 @@
               </el-form-item>
             </el-col>
             <el-col :span="24">
-              <el-form-item label="情况说明：" prop="phone" class="formitem-attachment">
-                <el-upload
-                  ref="descFileMaterialsUploadRef"
-                  :limit="1"
-                  accept=".pdf"
-                  :auto-upload="false"
-                  :show-file-list="true"
-                  :action="descFileMaterialsUpload.url"
-                  :headers="descFileMaterialsUpload.headers"
-                  :before-upload="handleBeforeUpload"
-                  :on-success="handleUploadOnsuccess"
-                  :on-change="handleUploadOnchange"
-                  :on-remove="handleUploadOnRemove"
-                  :on-exceed="handleUploadOnExceed"
-                  class="formitem-attachment-fileupload"
-                >
-                  <div class="formitem-attachment-fileupload-content">
-                    <i class="el-icon-plus" />
-                    上传文件，格式：PDF
-                  </div>
-                </el-upload>
-                <div
-                  v-if="descFileMaterialsUpload.isUploadSuccess"
-                  class="fl formitem-attachment-addr"
-                  @click="handleDescFileMaterialsUploadUrlClick"
-                >
-                  <div>文件上传成功地址：</div>
-                  <div>{{ addPageFormObj.formModel.bannerUrl }}</div>
-                </div>
-                <el-button
-                  v-if="descFileMaterialsUpload.isSelect && !descFileMaterialsUpload.isUploadSuccess"
-                  type="primary"
-                  size="small"
-                  @click="submitDescFileMaterialsUpload"
-                >上传文件</el-button>
-                <el-button
-                  v-if="descFileMaterialsUpload.isSelect"
-                  type="info"
-                  size="small"
-                  @click="removeDescFileMaterialsUpload"
-                >移除文件</el-button>
+              <el-form-item label="情况说明：" prop="conditionFile">
+                <roc-pdf-file-upload
+                  key="ROCPDFFILEUPLOADSITUATIONDESCCONDITIONFILEKEY"
+                  v-model="addPageFormObj.formModel.conditionFile"
+                  upload-file-title="情况说明"
+                ></roc-pdf-file-upload>
               </el-form-item>
             </el-col>
             <el-col :span="24">
@@ -377,14 +346,6 @@
         </div>
       </div>
     </template>
-    <template v-else-if="pageType === 'VIEWPDF'">
-      <div class="situationdesc-viewpdfpage">
-        <roc-vue-pdf-page
-          pdf-url="/file-api/statics/2021/12/13/6085efe9-74e1-4444-b47a-5c3533ec6901.pdf"
-          @close="handleViewPdfPageCloseClick"
-        ></roc-vue-pdf-page>
-      </div>
-    </template>
     <template v-else>
       <div>&nbsp;</div>
     </template>
@@ -392,12 +353,19 @@
 </template>
 
 <script>
-import { viewPdfFile } from "@/api/PartyBuildingMgr/SituationDesc";
+import {
+  listSituationDesc,
+  viewSituationDesc,
+  addSituationDesc
+} from "@/api/PartyBuildingMgr/SituationDesc";
+import {
+  getFullPartyMemberOptions
+} from "@/api/PartyBuildingMgr/FullPartyMember";
 
 export default {
   name: "Situationdesc",
   components: {
-    'roc-vue-pdf-page': () => import('@/components/RocVuePdfPage')
+    'roc-pdf-file-upload': () => import('@/components/RocPdfFileUpload')
   },
   data() {
     return {
@@ -422,33 +390,13 @@ export default {
       /** 新增或编辑弹框 */
       addPageFormObj: {
         formModel: {
-          bannerType: '0', // APP首页轮播图
-          name: undefined, // 名称
-          explainer: undefined, // 链接
-          sort: 0, // 排序
-          author: undefined, // 文章主体
-          bannerUrl: undefined, // 封面图片
-          content: undefined, // 内容
-          fileName: undefined, // 附件名称
-          fileUrl: undefined, // 附件地址
           checkList: []
         },
         formRules: {
-          name: [{ required: true, message: '名称不能为空！', trigger: 'blur' }],
-          linkUrl: [{ required: true, message: '链接不能为空！', trigger: 'blur' }],
           sort: [{ required: true, message: '排序不能为空！', trigger: ['blur', 'change'] }],
-          author: [{ required: true, message: '文章主体不能为空！', trigger: 'blur' }],
-          bannerUrl: [{ required: true, message: '封面图片不能为空！', trigger: 'change' }],
-          content: [{ required: true, message: '内容不能为空！', trigger: 'blur' }]
+          bannerUrl: [{ required: true, message: '封面图片不能为空！', trigger: 'change' }]
         }
       },
-      descFileMaterialsUpload: {
-        isSelect: false,
-        isUploadSuccess: false,
-        isOnProgress: false,
-        url: `${this.baseApiUrl}/file/upload`,
-        headers: { Authorization: 'Bearer ' + this.getToken() }
-      },
       viewPageFormObj: {
         formModel: {
           checkList: []
@@ -471,30 +419,44 @@ export default {
     * 获取表格数据
     */
     getList() {
-      this.loading = false;
+      this.loading = true;
+      listSituationDesc(this.queryParams).then(
+        response => {
+          this.list = response.rows || [];
+          this.total = response.total ?? 0;
+          this.loading = false;
+        }
+      );
+    },
+    /**
+     * 获取情况说明人选项列表
+     */
+    async getSituationExplainerOptions() {
+      await getFullPartyMemberOptions().then(
+        response => {
+          this.situationExplainerOptions = response.rows || [];
+        }
+      );
     },
     /**
     * 搜索按钮事件
     */
     handleQueryClick() {
-
+      this.initData();
     },
     /**
     * 重置按钮事件
     */
     resetQueryClick() {
-
+      this.resetForm("queryForm");
+      this.handleQueryClick();
     },
     /**
     * 新增按钮事件
     */
-    handleAddClick() {
+    async handleAddClick() {
+      await this.getSituationExplainerOptions();
       this.pageType = 'ADD';
-      this.descFileMaterialsUpload = {
-        ...this.descFileMaterialsUpload,
-        isSelect: false,
-        isUploadSuccess: false
-      };
     },
     /**
     * 详情按钮事件
@@ -512,129 +474,14 @@ export default {
     * 新增页面取消按钮事件
     */
     handleAddpageCloseClick() {
+      this.addPageFormObj.formModel = {};
+      this.resetForm('situationDescAddpageFormRef');
       this.pageType = 'LIST';
-      this.descFileMaterialsUpload = {
-        ...this.descFileMaterialsUpload,
-        isSelect: false,
-        isUploadSuccess: false,
-        isOnProgress: false
-      };
-    },
-    /**
-     * 相关材料PDF文件上传url点击事件
-     */
-    handleDescFileMaterialsUploadUrlClick() {
-      this.pdfDialogVisible = true;
-    },
-    /**
-     * 相关材料PDF文件上传预处理
-     */
-    handleBeforeUpload(file) {
-      if (file.type.indexOf('application/pdf') === -1) {
-        this.$refs.descFileMaterialsUploadRef.clearFiles();
-        this.msgError('文件格式错误，请上传类型格式为PDF的文件！');
-        return;
-      }
-    },
-    /**
-     * 相关材料PDF文件上传成功处理
-     */
-    handleUploadOnsuccess(response, file, fileList) {
-      // 校验封面图片是否上传成功
-      if (response.code !== 200) {
-        this.$refs.descFileMaterialsUploadRef?.clearFiles?.();
-        this.descFileMaterialsUpload.isSelect = false;
-        this.descFileMaterialsUpload.isUploadSuccess = false;
-        this.msgError('上传PDF文件失败，请重新选择PDF文件上传！');
-        return;
-      }
-
-      // 绑定封面图片数据
-      this.addPageFormObj.formModel.bannerUrl = response?.data?.url;
-      this.descFileMaterialsUpload.isUploadSuccess = true;
-
-      // 判断是否继续操作
-      if (this.descFileMaterialsUpload.isOnProgress) {
-        this.descFileMaterialsUpload.isOnProgress = false;
-        this.$confirm(`封面图片上传成功，是否继续${(this.operationTypeByForm === 'SAVE') ? '保存' : ((this.operationTypeByForm === 'RELEASE') ? '发布' : '预览')}数据操作？`, '提示', {
-          confirmButtonText: '确定 ',
-          cancelButtonText: '取消 ',
-          type: 'info'
-        }).then(() => {
-          this.handleBannerSubmitAddEditClick(this.operationTypeByForm);
-        }).catch(() => {
-          this.msgInfo('取消了继续保存数据操作！');
-        });
-      } else {
-        this.$alert('上传成功！', '上传结果', { dangerouslyUseHTMLString: true });
-      }
-    },
-    /**
-     * 相关材料PDF文件状态改变
-     */
-    handleUploadOnchange(file, fileList) {
-      if (file.status === 'ready') {
-        if (((file.raw || {}).type || '').indexOf('application/pdf') === -1) {
-          this.$refs.descFileMaterialsUploadRef.clearFiles();
-          this.descFileMaterialsUpload.isSelect = false;
-          this.msgError('文件格式错误，请上传类型格式为PDF的文件！');
-          return;
-        }
-        this.descFileMaterialsUpload.isSelect = true;
-        this.descFileMaterialsUpload.isUploadSuccess = false;
-      }
-    },
-    /**
-     * 提交上传相关材料PDF文件
-     */
-    submitDescFileMaterialsUpload() {
-      if (!this.descFileMaterialsUpload.isSelect) { return; }
-      this.$confirm('确定上传操作吗？', '提示', {
-        confirmButtonText: '确定 ',
-        cancelButtonText: '取消 ',
-        type: 'info'
-      }).then(() => {
-        this.$refs.descFileMaterialsUploadRef?.submit?.();
-      }).catch(() => {
-        this.msgInfo('您已取消上传操作！');
-      });
-    },
-    /**
-     * 移除选择相关材料PDF文件
-     */
-    removeDescFileMaterialsUpload() {
-      this.addPageFormObj.formModel.bannerUrl = '';
-      this.$refs.descFileMaterialsUploadRef.clearFiles();
-      this.descFileMaterialsUpload.isUploadSuccess = false;
-      this.descFileMaterialsUpload.isSelect = false;
-    },
-    /**
-     * 相关材料PDF文件列表移除文件时的钩子
-     */
-    handleUploadOnRemove(file, fileList) {
-      this.addPageFormObj.formModel.bannerUrl = '';
-      this.descFileMaterialsUpload.isUploadSuccess = false;
-      this.descFileMaterialsUpload.isSelect = false;
-    },
-    /**
-     * 相关材料PDF文件超出个数限制时的钩子
-     */
-    handleUploadOnExceed(files, fileList) {
-      this.msgWarning(`只允许上传单个相关材料PDF文件`);
-    },
-    /**
-     * PDF文件预览对话框关闭事件
-     */
-    handlePdfCloseClick(visible = false) {
-      this.pdfDialogVisible = visible;
     },
     /**
      * 详情页面查看按钮事件
      */
     handleViewPageCheckClick() {
-      viewPdfFile({ filename: '1f30fcfd-0d34-4127-a1cc-fad68fc27c7d.pdf' }).then(response => {
-        this.pageType = 'VIEWPDF';
-      });
     },
     /**
      * 详情页面下载按钮事件
@@ -646,12 +493,6 @@ export default {
      */
     handleViewPageCloseClick() {
       this.pageType = 'LIST';
-    },
-    /**
-     * 预览PDF页面关闭按钮事件
-     */
-    handleViewPdfPageCloseClick() {
-      this.pageType = 'VIEW';
     }
   }
 };