资产管理->web资产表格部分

src/App.vue

@@ -13,7 +13,7 @@ export default {
   components: { ThemePicker },
   mounted() {
     autofit.init({
-      dh: 1080,
+      dh: 998,
       dw: 1920,
       el: "body",
       resize: true,

src/api/auditPagesApi/index.js

@@ -0,0 +1,455 @@
+import request from '@/utils/request'
+
+// 新增单位
+export function postUnit(method,data) {
+  return request({
+    url: '/tc/unit',
+    method: method,
+    data,
+  })
+}
+// 查询单位列表
+export function listUnit(query) {
+  return request({
+    url: '/tc/unit/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询单位列表
+export function listUnitdw(query) {
+  return request({
+    url: '/tc/unit/dwList',
+    method: 'get',
+    params: query
+  })
+}
+
+// 新增资产查询单位列表
+export function unitAllList(params){
+  return request({
+    url: '/tc/unit/allList',
+    method: 'get',
+    params
+  })
+}
+
+// 删除单位
+export function delUnit(unitId) {
+  return request({
+    url: '/tc/unit/' + unitId,
+    method: 'delete'
+  })
+}
+
+// 单位详情
+export function lookUnit(unitId) {
+  return request({
+    url: '/tc/unit/' + unitId,
+    method: 'get'
+  })
+}
+
+// 查询/新增/修改 资产列表
+export function assetUnit(method,query) {
+  return request({
+    url: '/tc/assetCurrent',
+    method: method,
+    params: query
+  })
+}
+// 新增/修改 资产列表
+export function assetUnitData(method,data) {
+  return request({
+    url: '/tc/assetCurrent',
+    method: method,
+    data
+  })
+}
+
+// 查询详情
+export function assetInfo(id) {
+  return request({
+    url: '/tc/assetCurrent/' + id,
+    method: 'get',
+  })
+}
+
+// 删除资产
+export function deleteAssetInfo(id) {
+  return request({
+    url: '/tc/assetCurrent/' + id,
+    method: 'delete',
+
+  })
+}
+
+// 小程序资产
+
+// 分页查询
+export function miniProgramsList(params){
+  return request({
+    url: '/tc/miniPrograms',
+    method: 'get',
+    params
+  })
+}
+
+// 新增/修改 资产列表
+export function assetMiniPrograms(method,data) {
+  return request({
+    url: '/tc/miniPrograms',
+    method: method,
+    data
+  })
+}
+
+// 查询详情
+export function miniProgramsInfo(id) {
+  return request({
+    url: '/tc/miniPrograms/' + id,
+    method: 'get',
+  })
+}
+// 删除
+export function deleteMiniPrograms(id) {
+  return request({
+    url: '/tc/miniPrograms/delete/' + id,
+    method: 'delete',
+  })
+}
+
+// 公众号资产
+
+// 分页查询
+export function assetOfficialAccountList(params){
+  return request({
+    url: '/tc/assetOfficialAccount',
+    method: 'get',
+    params
+  })
+}
+
+// 新增/修改 资产列表
+export function assetOfficialAccount(method,data) {
+  return request({
+    url: '/tc/assetOfficialAccount',
+    method: method,
+    data
+  })
+}
+
+// 查询详情
+export function assetOfficialAccountInfo(id) {
+  return request({
+    url: '/tc/assetOfficialAccount/' + id,
+    method: 'get',
+  })
+}
+// 删除
+export function deleteAssetOfficialAccount(id) {
+  return request({
+    url: '/tc/assetOfficialAccount/delete/' + id,
+    method: 'delete',
+  })
+}
+
+// 电子邮件资产
+
+// 分页查询
+export function assetEmailList(params){
+  return request({
+    url: '/tc/assetEmail',
+    method: 'get',
+    params
+  })
+}
+
+// 新增/修改 资产列表
+export function assetEmail(method,data) {
+  return request({
+    url: '/tc/assetEmail',
+    method: method,
+    data
+  })
+}
+
+// 查询详情
+export function assetEmailInfo(id) {
+  return request({
+    url: '/tc/assetEmail/' + id,
+    method: 'get',
+  })
+}
+// 删除
+export function deleteAssetEmail(id) {
+  return request({
+    url: '/tc/assetEmail/delete/' + id,
+    method: 'delete',
+  })
+}
+
+// 移动应用程序资产
+
+// 分页查询
+export function assetAppList(params){
+  return request({
+    url: '/tc/assetApp',
+    method: 'get',
+    params
+  })
+}
+
+// 新增/修改 资产列表
+export function assetApp(method,data) {
+  return request({
+    url: '/tc/assetApp',
+    method: method,
+    data
+  })
+}
+
+// 查询详情
+export function assetAppInfo(id) {
+  return request({
+    url: '/tc/assetApp/' + id,
+    method: 'get',
+  })
+}
+// 删除
+export function deleteAssetApp(id) {
+  return request({
+    url: '/tc/assetApp/delete/' + id,
+    method: 'delete',
+  })
+}
+
+
+// 领导端admin修改密码
+export function editPassword(id) {
+  return request({
+    url:"/tc/unit/edit/" + id,
+    method:"get"
+  })
+}
+
+// 根据资产类型获取组织架构
+export function schema(type){
+  return request({
+    url:"/tc/schema",
+    method:"get",
+    params:type
+  })
+}
+
+// -----------------------------------------
+
+// web资产--单位端资产编辑
+export function unitEdit(data){
+  return request({
+    url:"/tc/assetCurrent/unitEdit",
+    method:"post",
+    data
+  })
+}
+
+
+// web资产--管理端资产审核
+export function assetAudit(data){
+  return request({
+    url:"/tc/assetCurrent/audit",
+    method:"post",
+    data
+  })
+}
+
+// web资产--分页查询管理端/单位端审核列表
+export function getAuditList(params){
+  return request({
+    url:"/tc/assetCurrent/getAuditList",
+    method:"get",
+    params
+  })
+}
+
+// web资产--单位端查看中间数据详情
+export function lookInfo(id){
+  return request({
+    url:"/tc/assetCurrent/lookInfo/" + id,
+    method:"get",
+  })
+}
+
+// ------------------------------------------
+
+// 小程序资产--单位端资产编辑
+export function miniProgramsUnitEdit(data){
+  return request({
+    url:"/tc/miniPrograms/unitEdit",
+    method:"post",
+    data
+  })
+}
+
+
+// 小程序资产--管理端资产审核
+export function miniProgramsAudit(data){
+  return request({
+    url:"/tc/miniPrograms/audit",
+    method:"post",
+    data
+  })
+}
+
+// 小程序资产--分页查询管理端/单位端审核列表
+export function miniProgramsGetAuditList(params){
+  return request({
+    url:"/tc/miniPrograms/getAuditList",
+    method:"get",
+    params
+  })
+}
+
+// 小程序资产--单位端查看中间数据详情
+export function miniProgramsLookInfo(id){
+  return request({
+    url:"/tc/miniPrograms/lookInfo/" + id,
+    method:"get",
+  })
+}
+
+
+// ------------------------------------------
+
+// 公众号资产--单位端资产编辑
+export function gzhUnitEdit(data){
+  return request({
+    url:"/tc/assetOfficialAccount/unitEdit",
+    method:"post",
+    data
+  })
+}
+
+
+// 公众号资产--管理端资产审核
+export function gzhAudit(data){
+  return request({
+    url:"/tc/assetOfficialAccount/audit",
+    method:"post",
+    data
+  })
+}
+
+// 公众号资产--分页查询管理端/单位端审核列表
+export function gzhGetAuditList(params){
+  return request({
+    url:"/tc/assetOfficialAccount/getAuditList",
+    method:"get",
+    params
+  })
+}
+
+// 公众号资产--单位端查看中间数据详情
+export function gzhLookInfo(id){
+  return request({
+    url:"/tc/assetOfficialAccount/lookInfo/" + id,
+    method:"get",
+  })
+}
+
+
+// ------------------------------------------
+
+// 电子邮件资产--单位端资产编辑
+export function EmailUnitEdit(data){
+  return request({
+    url:"/tc/assetEmail/unitEdit",
+    method:"post",
+    data
+  })
+}
+
+
+// 电子邮件资产--管理端资产审核
+export function EmailAudit(data){
+  return request({
+    url:"/tc/assetEmail/audit",
+    method:"post",
+    data
+  })
+}
+
+// 电子邮件资产--分页查询管理端/单位端审核列表
+export function EmailList(params){
+  return request({
+    url:"/tc/assetEmail/getAuditList",
+    method:"get",
+    params
+  })
+}
+
+// 电子邮件资产--单位端查看中间数据详情
+export function EmailLookInfo(id){
+  return request({
+    url:"/tc/assetEmail/lookInfo/" + id,
+    method:"get",
+  })
+}
+
+
+// ------------------------------------------
+
+// 移动应用系统资产--单位端资产编辑
+export function assetAppUnitEdit(data){
+  return request({
+    url:"/tc/assetApp/unitEdit",
+    method:"post",
+    data
+  })
+}
+
+
+// 移动应用系统资产--管理端资产审核
+export function AppAudit(data){
+  return request({
+    url:"/tc/assetApp/audit",
+    method:"post",
+    data
+  })
+}
+
+// 移动应用系统资产--分页查询管理端/单位端审核列表
+export function AppList(params){
+  return request({
+    url:"/tc/assetApp/getAuditList",
+    method:"get",
+    params
+  })
+}
+
+// 移动应用系统资产--单位端查看中间数据详情
+export function AppLookInfo(id){
+  return request({
+    url:"/tc/assetApp/lookInfo/" + id,
+    method:"get",
+  })
+}
+
+
+// 单位查看自己单位具体信息
+export function unitOwnInfo(){
+  return request({
+    url:"/tc/schema/unitOwnInfo",
+    method:"get",
+  })
+}
+
+// 单位修改自己单位具体信息
+export function unitEditOwn(data){
+  return request({
+    url:"/tc/schema/unitEditOwn",
+    method:"post",
+    data
+  })
+}

src/api/login.js

@@ -1,4 +1,4 @@
-import request from "@/utils/request";
+import request from '@/utils/request'
 
 // 登录方法
 export function login(username, password, code, uuid) {
@@ -6,55 +6,55 @@ export function login(username, password, code, uuid) {
     username,
     password,
     code,
-    uuid,
+    uuid
-  };
+  }
   return request({
-    url: "/login",
+    url: '/login',
     headers: {
       isToken: false,
-      repeatSubmit: false,
+      repeatSubmit: false
     },
-    method: "post",
+    method: 'post',
-    data: data,
+    data: data
-  });
+  })
 }
 
 // 注册方法
 export function register(data) {
   return request({
-    url: "/register",
+    url: '/register',
     headers: {
-      isToken: false,
+      isToken: false
     },
-    method: "post",
+    method: 'post',
-    data: data,
+    data: data
-  });
+  })
 }
 
 // 获取用户详细信息
 export function getInfo() {
   return request({
-    url: "/getInfo",
+    url: '/getInfo',
-    method: "get",
+    method: 'get'
-  });
+  })
 }
 
 // 退出方法
 export function logout() {
   return request({
-    url: "/logout",
+    url: '/logout',
-    method: "post",
+    method: 'post'
-  });
+  })
 }
 
 // 获取验证码
 export function getCodeImg() {
   return request({
-    url: "/captchaImage",
+    url: '/captchaImage',
     headers: {
-      isToken: false,
+      isToken: false
     },
-    method: "get",
+    method: 'get',
-    timeout: 20000,
+    timeout: 20000
-  });
+  })
-}
+}

src/api/renwuApi/index.js

@@ -0,0 +1,216 @@
+import request from '@/utils/request'
+
+export function addassetTaskadd(data) {
+    return request({
+      url: '/unit/assetTask/add',
+      method: "post",
+      data,
+    })
+  }
+
+  export function getassetTask(params) {
+    return request({
+      url: '/unit/assetTask/page',
+      method: "get",
+      params,
+    })
+  }
+
+  export function getassetTaskid(params) {
+    return request({
+      url: `/unit/assetTask/${params}`,
+      method: "get",
+      // params,
+    })
+  }
+
+  export function geassetTaskcHc(params) {
+    return request({
+      url: `/unit/assetTask/zcHc`,
+      method: "get",
+      params,
+    })
+  }
+
+  export function assetTasktaskSh(params) {
+    return request({
+      url: `/unit/assetTask/taskSh`,
+      method: "get",
+      params,
+    })
+  }
+
+  export function assetTasksh(data) {
+    return request({
+      url: `/unit/assetTask/sh`,
+      method: "post",
+      data,
+    })
+  }
+
+  export function assetTaskzc(data) {
+    return request({
+      url: `/unit/assetTask/zc`,
+      method: "post",
+      data,
+    })
+  }
+
+  export function assetTaskjyTj(data) {
+    return request({
+      url: `/unit/assetTask/jyTj`,
+      method: "post",
+      data,
+    })
+  }
+
+  export function assetTaskdwHc(params) {
+    return request({
+      url: `/unit/assetTask/dwHc`,
+      method: "get",
+      params,
+    })
+  }
+
+  export function assetLcpage(params) {
+    return request({
+      url: `/unit/assetLc/page`,
+      method: "get",
+      params,
+    })
+  }
+//小程序详情
+  export function assetTaskminitaskSh(params) {
+    return request({
+      url: `/unit/assetTask/minitaskSh`,
+      method: "get",
+      params,
+    })
+  }
+
+  //公众号资产任务审核详情信息
+  export function assetTaskofficetaskSh(params) {
+    return request({
+      url: `/unit/assetTask/officetaskSh`,
+      method: "get",
+      params,
+    })
+  }
+       //移动应用程序资产
+    export function assetTaskapptaskSh(params) {
+      return request({
+        url: `/unit/assetTask/apptaskSh`,
+        method: "get",
+        params,
+      })
+    }
+
+        //电子邮件资产任务审核详情信息
+       export function assetTaskemailtaskSh(params) {
+        return request({
+          url: `/unit/assetTask/emailtaskSh`,
+          method: "get",
+          params,
+        })
+      }
+
+       //小程序审核报废
+       export function assetTaskxcxzc(data) {
+        return request({
+          url: `/unit/assetTask/xcxzc`,
+          method: "post",
+          data,
+        })
+      }
+         //公众号审核报废
+         export function assetTaskgzhzc(data) {
+          return request({
+            url: `/unit/assetTask/gzhzc`,
+            method: "post",
+            data,
+          })
+        }
+
+         //电子邮件审核报废
+         export function assetTaskemailzc(data) {
+          return request({
+            url: `/unit/assetTask/emailzc`,
+            method: "post",
+            data,
+          })
+        }
+ //电子邮件tijiao
+ export function assetTaskemailjyTj(data) {
+  return request({
+    url: `/unit/assetTask/emailjyTj`,
+    method: "post",
+    data,
+  })
+}
+             //移动应用审核报废
+             export function assetTaskappzc(data) {
+              return request({
+                url: `/unit/assetTask/appzc`,
+                method: "post",
+                data,
+              })
+            }
+            //移动应用审核报废
+            export function assetTaskappjyTj(data) {
+              return request({
+                url: `/unit/assetTask/appjyTj`,
+                method: "post",
+                data,
+              })
+            }
+  //小程序单位端校验提交
+export function assetTaskxcxjyTj(data) {
+    return request({
+      url: `/unit/assetTask/xcxjyTj`,
+      method: "post",
+      data,
+    })
+ }
+
+   //小程序单位端校验提交
+export function assetTaskgzhjyTj(data) {
+  return request({
+    url: `/unit/assetTask/gzhjyTj`,
+    method: "post",
+    data,
+  })
+}
+//关闭任务
+export function assetTaskclose(params) {
+  return request({
+    url: `/unit/assetTask/close`,
+    method: "get",
+    params,
+  })
+}
+
+//管理端-单位核查比例图
+export function assetTaskdwHcBl(data) {
+  return request({
+    url: `/unit/assetTask/dwHcBl`,
+    method: "post",
+    data,
+  })
+}
+
+export function assetTaskzcTj(data) {
+  return request({
+    url: `/unit/assetTask/zcTj`,
+    method: "post",
+    data,
+  })
+}
+
+
+export function assetTaskhistory(params) {
+  return request({
+    url: `/unit/assetTask/history`,
+    method: "get",
+    params,
+  })
+}

src/api/system/user.js

@@ -96,7 +96,7 @@ export function updateUserPwd(oldPassword, newPassword) {
   return request({
     url: '/system/user/profile/updatePwd',
     method: 'put',
-    data: data
+    params: data
   })
 }
 

src/assets/styles/element-ui.scss

@@ -69,7 +69,7 @@
 // dropdown
 .el-dropdown-menu {
   a {
-    display: block
+    display: block;
   }
 }
 
@@ -89,4 +89,4 @@
   > .el-submenu__title
   .el-submenu__icon-arrow {
   display: none;
-}
+}

src/assets/styles/index.scss

@@ -189,3 +189,11 @@ aside {
     margin-bottom: 10px;
   }
 }
+.has-gutter {
+  background-color: red;
+}
+.el-table {
+  .evenNumber-row {
+    background-color: #f6f9fd;
+  }
+}

src/components/DictTag/index.vue

@@ -3,21 +3,24 @@
     <template v-for="(item, index) in options">
       <template v-if="values.includes(item.value)">
         <span
-          v-if="(item.raw.listClass == 'default' || item.raw.listClass == '') && (item.raw.cssClass == '' || item.raw.cssClass == null)"
+          v-if="
+            (item.raw.listClass == 'default' || item.raw.listClass == '') &&
+            (item.raw.cssClass == '' || item.raw.cssClass == null)
+          "
           :key="item.value"
           :index="index"
           :class="item.raw.cssClass"
-          >{{ item.label + ' ' }}</span
+          >{{ item.label + " " }}</span
         >
         <el-tag
           v-else
           :disable-transitions="true"
           :key="item.value"
           :index="index"
-          :type="item.raw.listClass == 'primary' ? '' : item.raw.listClass"
+          type="text"
           :class="item.raw.cssClass"
         >
-          {{ item.label + ' ' }}
+          {{ item.label + " " }}
         </el-tag>
       </template>
     </template>
@@ -43,47 +46,72 @@ export default {
     },
     separator: {
       type: String,
-      default: ","
+      default: ",",
-    }
+    },
   },
   data() {
     return {
       unmatchArray: [], // 记录未匹配的项
-    }
+    };
   },
   computed: {
     values() {
-      if (this.value === null || typeof this.value === 'undefined' || this.value === '') return []
+      if (
-      return Array.isArray(this.value) ? this.value.map(item => '' + item) : String(this.value).split(this.separator)
+        this.value === null ||
+        typeof this.value === "undefined" ||
+        this.value === ""
+      )
+        return [];
+      return Array.isArray(this.value)
+        ? this.value.map((item) => "" + item)
+        : String(this.value).split(this.separator);
     },
     unmatch() {
-      this.unmatchArray = []
+      this.unmatchArray = [];
       // 没有value不显示
-      if (this.value === null || typeof this.value === 'undefined' || this.value === '' || this.options.length === 0) return false
+      if (
+        this.value === null ||
+        typeof this.value === "undefined" ||
+        this.value === "" ||
+        this.options.length === 0
+      )
+        return false;
       // 传入值为数组
-      let unmatch = false // 添加一个标志来判断是否有未匹配项
+      let unmatch = false; // 添加一个标志来判断是否有未匹配项
-      this.values.forEach(item => {
+      this.values.forEach((item) => {
-        if (!this.options.some(v => v.value === item)) {
+        if (!this.options.some((v) => v.value === item)) {
-          this.unmatchArray.push(item)
+          this.unmatchArray.push(item);
-          unmatch = true // 如果有未匹配项，将标志设置为true
+          unmatch = true; // 如果有未匹配项，将标志设置为true
         }
-      })
+      });
-      return unmatch // 返回标志的值
+      return unmatch; // 返回标志的值
     },
-
   },
   filters: {
     handleArray(array) {
-      if (array.length === 0) return '';
+      if (array.length === 0) return "";
       return array.reduce((pre, cur) => {
-        return pre + ' ' + cur;
+        return pre + " " + cur;
-      })
+      });
     },
-  }
+  },
 };
 </script>
 <style scoped>
 .el-tag + .el-tag {
   margin-left: 10px;
 }
+/* .tagHaveCss {
+  border: 0;
+  background: transparent;
+} */
+.greenColor {
+  color: rgb(41, 160, 122);
+}
+.orangeColor {
+  color: orange;
+}
+.redColor {
+  color: red;
+}
 </style>

src/components/MainApp/TopTitle.vue

@@ -0,0 +1,58 @@
+<template>
+  <div class="top-title">
+    <div class="title-box">
+      <div class="title-line" :style="{ background: theme }"></div>
+      <div class="title-text">{{ title }}</div>
+    </div>
+    <div class="table-c">
+      <slot></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    title: {
+      type: String,
+      default: "默认标题",
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    theme() {
+      return this.$store.state.settings.theme;
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.top-title {
+  height: 50px;
+  border-bottom: 1px solid #f2f4f6;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.title-box {
+  display: flex;
+  align-items: center;
+}
+.table-c {
+  padding-right: 15px;
+}
+.title-line {
+  height: 17px;
+  width: 4px;
+  margin-right: 10px;
+}
+.title-text {
+  font-size: 17px;
+  color: #192734;
+  font-family: "Alibaba PuHuiTi";
+  font-weight: bold;
+}
+</style>

src/components/MainApp/index.vue

@@ -1,9 +1,90 @@
 <template>
-  <div>1111</div>
+  <div class="table-container">
+    <div
+      class="table-left"
+      v-if="showTree"
+      :style="{ width: showTree ? '10%' : '0%' }"
+    >
+      <div class="content" style="height: 100%">
+        <slot name="tree"></slot>
+      </div>
+    </div>
+    <div class="table-right" :style="{ width: showTree ? '90%' : '100%' }">
+      <div class="filter-box" ref="targetElement">
+        <top-title title="查询条件"></top-title>
+        <div class="content">
+          <slot name="search"></slot>
+        </div>
+      </div>
+      <div class="table-box">
+        <top-title title="资产列表">
+          <slot name="tablec"></slot>
+        </top-title>
+        <div class="content">
+          <slot name="table"></slot>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
-export default {};
+import TopTitle from "./TopTitle.vue";
+export default {
+  components: {
+    TopTitle,
+  },
+  props: {
+    //是否显示左侧的树菜单
+    showTree: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      tableboxHeight: 0,
+    };
+  },
+  mounted() {},
+};
 </script>
 
-<style></style>
+<style lang="scss" scoped>
+.table-container {
+  height: 100%;
+  padding: 20px;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+}
+.table-left {
+  margin-right: 20px;
+  background: #ffffff;
+}
+.table-left,
+.table-right {
+  height: 100%;
+  border-radius: 6px;
+}
+.table-right {
+  display: flex;
+  flex-direction: column;
+}
+.filter-box {
+  min-height: 200px;
+}
+.filter-box,
+.table-box {
+  background: #ffffff;
+  border-radius: 6px;
+}
+.table-box {
+  flex: 1;
+  margin-top: 20px;
+}
+.content {
+  height: calc(100% - 50px);
+  padding: 10px;
+}
+</style>

src/components/MyPagination/index.vue

@@ -0,0 +1,204 @@
+<template>
+  <div :class="{'hidden':hidden}" class="my-pagination-container">
+    <div class="leftTotal">
+      <span class="custom"
+        >总共 <span class="number">{{ total }}</span> 条：显示{{
+          total == 0
+            ? "0"
+            : mypageNum == 1
+            ? "1"
+            : mypageSize * (mypageNum - 1) + 1
+        }}-{{ numberMap }}条</span
+      >
+    </div>
+    <el-pagination
+      prev-text="上一页"
+      next-text="下一页"
+      :background="background"
+      :current-page.sync="currentPage"
+      :page-size.sync="pageSize"
+      :page-sizes="[10,20,40,80,100]"
+      :layout="layout"
+      :pager-count="pagerCount"
+      :total="total"
+      v-bind="$attrs"
+      @size-change="handleSizeChange"
+      @current-change="handleCurrentChange"
+    />
+    <!-- <div class="pagination-right">
+      <div class="pagination-inputNumber">到第<el-input-number v-model="num" :controls="false" @change="handleChange" :min="1" :max="Math.ceil(total)"></el-input-number>页</div>
+      <div class="pagination-confirm" :class="num ? 'pagination-cconfirm-two': ''" @click="handleConfirm">确定</div>
+    </div> -->
+  </div>
+</template>
+
+<script>
+import { scrollTo } from '@/utils/scroll-to'
+
+export default {
+  name: 'myPagination',
+  props: {
+    total: {
+      required: true,
+      type: Number
+    },
+    page: {
+      type: Number,
+      default: 1
+    },
+    limit: {
+      type: Number,
+      default: 20
+    },
+    // 移动端页码按钮的数量端默认值5
+    pagerCount: {
+      type: Number,
+      default: document.body.clientWidth < 992 ? 5 : 7
+    },
+    layout: {
+      type: String,
+      default: 'prev, pager, next, sizes, jumper'
+    },
+    background: {
+      type: Boolean,
+      default: true
+    },
+    autoScroll: {
+      type: Boolean,
+      default: true
+    },
+    hidden: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      mypageNum:1,
+      mypageSize:10,
+      num:undefined,
+    };
+  },
+  computed: {
+    currentPage: {
+      get() {
+        return this.page
+      },
+      set(val) {
+        this.$emit('update:page', val)
+      }
+    },
+    pageSize: {
+      get() {
+        return this.limit
+      },
+      set(val) {
+        this.$emit('update:limit', val)
+      }
+    },
+    //算数
+    numberMap() {
+      // if (this.total == this.tableData.length) {
+      //   return this.total;
+      // } else 
+      if (
+        this.total >
+        this.mypageNum * this.mypageSize
+      ) {
+        return this.mypageNum * this.mypageSize;
+      } else if (
+        this.total < this.mypageNum * this.mypageSize ||
+        this.total == this.mypageNum * this.mypageSize
+      ) {
+        return this.total;
+      }
+    },
+  },
+  watch:{
+    page:{
+      handler(newPage){
+        this.mypageNum = newPage;
+        this.mypageSize = this.limit;
+        
+      },
+    }
+  },
+  methods: {
+    handleSizeChange(val) {
+      this.mypageSize = val;
+      
+      if (this.currentPage * val > this.total) {
+        this.currentPage = 1
+      }
+      this.$emit('pagination', { page: this.currentPage, limit: val })
+      if (this.autoScroll) {
+        scrollTo(0, 800)
+      }
+    },
+    handleCurrentChange(val) {
+      this.mypageNum = val;
+      // console.log(68 / 10);
+      this.$emit('pagination', { page: val, limit: this.pageSize })
+      if (this.autoScroll) {
+        scrollTo(0, 800)
+      }
+    },
+    // handleChange(val){
+    //   this.$emit('pagination', { page: val, limit: this.pageSize })
+    // },
+    
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.leftTotal {
+  flex: 1;
+  .custom {
+    font-size: 14px;
+    font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+    font-weight: 400;
+    color: #292F38;
+    line-height: 18px; 
+    // span {
+    //   margin: 0 3px;
+    // }
+  }
+}
+.pagination-right {
+  display: flex;
+  .pagination-inputNumber {
+    .el-input-number {
+      margin: 0 5px;
+      width: 50px;
+    }
+  }
+  .pagination-confirm {
+    margin-left: 10px;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 52px;
+    background: #F6F6F6;
+    border-radius: 2px 2px 2px 2px;
+    border: 1px solid #CCCCCC;
+  }
+  .pagination-cconfirm-two {
+    background: #192a92;
+    color: #f6f6f6;
+    border: 1px solid #192a92;
+  }
+}
+.my-pagination-container {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: #fff;
+  width: 100%;
+  // padding: 0 20px;
+}
+.my-pagination-container.hidden {
+  display: none;
+}
+</style>

src/layout/components/AppMain.vue

@@ -1,12 +1,12 @@
 <template>
-  <section class="app-main">
+  <div class="app-main">
     <transition name="fade-transform" mode="out-in">
       <keep-alive :include="cachedViews">
         <router-view v-if="!$route.meta.link" :key="key" />
       </keep-alive>
     </transition>
     <iframe-toggle />
-  </section>
+  </div>
 </template>
 
 <script>
@@ -46,7 +46,7 @@ export default {
 .app-main {
   /* 50= navbar  50  */
   // min-height: calc(100vh - 50px);
-  min-height: 100%;
+  height: 100%;
   width: 100%;
   position: relative;
   overflow: hidden;

src/main.js

@@ -46,6 +46,8 @@ import VueMeta from "vue-meta";
 import DictData from "@/components/DictData";
 //通用表格页面
 import MainApp from "@/components/MainApp";
+//分页器自定义
+import MyPagination from "@/components/MyPagination";
 
 // 全局方法挂载
 Vue.prototype.getDicts = getDicts;
@@ -67,6 +69,7 @@ Vue.component("FileUpload", FileUpload);
 Vue.component("ImageUpload", ImageUpload);
 Vue.component("ImagePreview", ImagePreview);
 Vue.component("MainApp", MainApp);
+Vue.component("MyPagination", MyPagination);
 
 Vue.use(directive);
 Vue.use(plugins);

src/views/auditPages/assetsManagement.vue

@@ -1,9 +1,288 @@
 <template>
-  <main-app></main-app>
+  <main-app :showTree="true">
+    <template v-slot:tree>
+      <el-tree
+        :data="deptOptions"
+        :props="defaultProps"
+        :expand-on-click-node="false"
+        :filter-node-method="filterNode"
+        ref="tree"
+        node-key="id"
+        default-expand-all
+        highlight-current
+        @node-click="handleNodeClick"
+      />
+    </template>
+    <template v-slot:tablec>
+      <el-button
+        type="info"
+        plain
+        icon="el-icon-upload2"
+        size="mini"
+        @click="handleImport"
+        >导入</el-button
+      >
+
+      <el-button
+        type="warning"
+        plain
+        icon="el-icon-download"
+        size="mini"
+        @click="handleExport"
+        >导出</el-button
+      >
+
+      <el-button
+        type="primary"
+        plain
+        icon="el-icon-plus"
+        size="mini"
+        @click="handleAdd"
+        >新增资产</el-button
+      >
+    </template>
+    <template v-slot:search>
+      <el-form
+        :model="formInline"
+        ref="queryForm"
+        size="small"
+        :inline="true"
+        label-width="88px"
+      >
+        <el-form-item label="系统名称：" prop="xtmc">
+          <el-input
+            v-model="formInline.xtmc"
+            placeholder="请输入系统名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="系统类型：" prop="xtlx">
+          <el-select v-model="formInline.xtlx" placeholder="请选择系统类型">
+            <el-option
+              v-for="dict in dict.type.zc_xtlx"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="新增时间：" prop="time">
+          <el-date-picker
+            v-model="formInline.time"
+            format="yyyy-MM-dd HH:mm:ss"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            placeholder="请选择"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="单位名称：" prop="dwmc">
+          <el-input
+            v-model="formInline.dwmc"
+            placeholder="请输入单位名称"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="系统状态：" prop="xtzt">
+          <el-select v-model="formInline.xtzt" placeholder="请选择系统状态">
+            <el-option
+              v-for="dict in dict.type.zc_xtzt"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button
+            type="primary"
+            icon="el-icon-search"
+            size="mini"
+            @click="handleQuery"
+            >搜索</el-button
+          >
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
+            >重置</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </template>
+    <template v-slot:table>
+      <el-table
+        v-loading="loading"
+        :data="tableData"
+        :height="tabHeader"
+        :row-class-name="tableRowClassName"
+      >
+        <el-table-column type="index" width="50" label="序号" align="center" />
+        <el-table-column
+          label="系统名称"
+          prop="xtmc"
+          align="center"
+          show-overflow-tooltip
+        />
+        <el-table-column label="系统类型" prop="xtlx" align="center">
+          <template slot-scope="scope">
+            <dict-tag :options="dict.type.zc_xtlx" :value="scope.row.xtlx" />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="单位名称"
+          prop="dwmc"
+          align="center"
+          show-overflow-tooltip
+        />
+
+        <el-table-column label="新增时间" prop="createTime" align="center" />
+        <el-table-column label="系统状态" prop="xtzt" align="center">
+          <template slot-scope="scope">
+            <dict-tag
+              :options="dict.type.tc_sys_stste"
+              :value="scope.row.xtzt"
+            />
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          prop="userId"
+          class-name="table-operation"
+          align="center"
+        >
+          <template slot-scope="scope">
+            <el-button type="primary" size="mini" plain icon="el-icon-view"
+              >查看</el-button
+            >
+            <el-button
+              type="warning"
+              size="mini"
+              plain
+              icon="el-icon-edit-outline"
+              >修改</el-button
+            >
+            <el-button type="danger" size="mini" plain icon="el-icon-delete"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        prev-text="上页"
+        next-text="下页"
+        v-show="total > 0"
+        :total="total"
+        :page-sizes="[10, 20, 40, 80, 100]"
+        :page.sync="formInline.current"
+        :limit.sync="formInline.size"
+        @pagination="getList"
+      />
+    </template>
+  </main-app>
 </template>
 
 <script>
-export default {};
+import { getToken } from "@/utils/auth";
+import { assetUnit, deleteAssetInfo, schema } from "@/api/auditPagesApi/index";
+export default {
+  dicts: ["zc_xtzt", "zc_xtlx", "tc_sys_stste"],
+  data() {
+    return {
+      deptOptions: undefined,
+      defaultProps: {
+        children: "children",
+        label: "label",
+      },
+      loading: false,
+      tableData: [],
+      tabHeader: 585,
+      total: 0,
+      formInline: {
+        xtmc: "",
+        xtlx: "",
+        time: [],
+        startTime: "",
+        endTime: "",
+        dwmc: "",
+        xtzt: "",
+        current: 1,
+        size: 20,
+      },
+    };
+  },
+  created() {
+    this.getList();
+    this.getDeptTree();
+  },
+  methods: {
+    // 修改table背景色
+    tableRowClassName({ row, rowIndex }) {
+      if (rowIndex % 2 !== 0) {
+        return "evenNumber-row";
+      }
+      return "";
+    },
+
+    /** 查询部门下拉树结构 */
+    getDeptTree() {
+      schema({ type: 0 }).then((response) => {
+        this.deptOptions = response.data;
+      });
+    },
+
+    /**
+     * 重置
+     */
+    resetQuery() {
+      this.resetForm("queryForm");
+      this.formInline.deptId = undefined;
+      this.$refs.tree.setCurrentKey(null);
+      this.handleQuery();
+    },
+    // 筛选节点
+    filterNode(value, data) {
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+    },
+    // 节点单击事件
+    handleNodeClick(data) {
+      this.formInline.deptId = data.id;
+      this.handleQuery();
+    },
+    /**
+     * 搜索
+     */
+    handleQuery() {
+      this.formInline.current = 1;
+      this.formInline.size = 20;
+      if (this.formInline.time) {
+        this.formInline.startTime = this.formInline.time[0];
+        this.formInline.endTime = this.formInline.time[1];
+      }
+      // this.formInline.time = [];
+      this.getList();
+    },
+    /**
+     * 获取列表
+     */
+    getList() {
+      this.loading = true;
+      assetUnit("get", this.formInline).then((res) => {
+        this.loading = false;
+        this.total = res.data.total;
+        this.tableData = res.data.records;
+      });
+    },
+  },
+};
 </script>
 
-<style></style>
+<style lang="scss" scoped>
+::v-deep .el-form-item__content {
+  width: 250px;
+  .el-select,
+  .el-date-editor {
+    width: 100%;
+  }
+}
+</style>