提交

src/api/system/app.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询【请填写功能名称】列表
+export function listApp(query) {
+  return request({
+    url: '/system/app/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询【请填写功能名称】详细
+export function getApp(id) {
+  return request({
+    url: '/system/app/' + id,
+    method: 'get'
+  })
+}
+
+// 新增【请填写功能名称】
+export function addApp(data) {
+  return request({
+    url: '/system/app',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改【请填写功能名称】
+export function updateApp(data) {
+  return request({
+    url: '/system/app/put',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除【请填写功能名称】
+export function delApp(id) {
+  return request({
+    url: '/system/app/delete/' + id,
+    method: 'get'
+  })
+}

src/api/system/box.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询包厢菜单列表
+export function listBox(query) {
+  return request({
+    url: '/system/box/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询包厢菜单详细
+export function getBox(menuBoxId) {
+  return request({
+    url: '/system/box/' + menuBoxId,
+    method: 'get'
+  })
+}
+
+// 新增包厢菜单
+export function addBox(data) {
+  return request({
+    url: '/system/box',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改包厢菜单
+export function updateBox(data) {
+  return request({
+    url: '/system/box/put',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除包厢菜单
+export function delBox(menuBoxId) {
+  return request({
+    url: '/system/box/delete/' + menuBoxId,
+    method: 'get'
+  })
+}

src/api/system/channelNumber.js

@@ -0,0 +1,64 @@
+import request from '@/utils/request'
+
+// 查询通道管理列表
+export function listChannelNumber(query) {
+  return request({
+    url: '/manage/channelNumber/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询通道管理列表
+export function listChannelNumbernopa(query) {
+  return request({
+    url: '/manage/channelNumber/listNoPage',
+    method: 'get',
+    params: query
+  })
+}
+
+
+
+// 查询通道管理详细
+export function getChannelNumber(channelId) {
+  return request({
+    url: '/manage/channelNumber/' + channelId,
+    method: 'get'
+  })
+}
+
+// 新增通道管理
+export function addChannelNumber(data) {
+  return request({
+    url: '/manage/channelNumber',
+    method: 'post',
+    data: data
+  })
+}
+// 查询通道管理详细
+export function deptTreec(query) {
+  return request({
+    url: '/manage/channelNumber/deptTree' ,
+    method: 'get',
+     params: query
+  })
+}
+
+
+// 修改通道管理
+export function updateChannelNumber(data) {
+  return request({
+    url: '/manage/channelNumber/put',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除通道管理
+export function delChannelNumber(channelId) {
+  return request({
+    url: '/manage/channelNumber/delete/' + channelId,
+    method: 'get'
+  })
+}

src/api/system/configuration.js

@@ -0,0 +1,54 @@
+import request from '@/utils/request'
+
+// 查询设备配置（控制抓拍一体机）列表
+export function listConfiguration(query) {
+  return request({
+    url: '/system/configuration/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询设备配置（控制抓拍一体机）详细
+export function getConfiguration(equipmentId) {
+  return request({
+    url: '/system/configuration/' + equipmentId,
+    method: 'get'
+  })
+}
+
+// 新增设备配置（控制抓拍一体机）
+export function addConfiguration(data) {
+  return request({
+    url: '/system/configuration',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改设备配置（控制抓拍一体机）
+export function updateConfiguration(data) {
+  return request({
+    url: '/system/configuration/put',
+    method: 'post',
+    data: data
+  })
+}
+
+// 删除设备配置（控制抓拍一体机）
+export function delConfiguration(equipmentId) {
+  return request({
+    url: '/system/configuration/delete/' + equipmentId,
+    method: 'get'
+  })
+}
+
+
+export function boolean(query) {
+  return request({
+    url: '/system/config/configKey/boolean',
+    method: 'get',
+    params: query
+  })
+}
+

src/components/Paginations/index.vue

@@ -0,0 +1,154 @@
+<template>
+  <div class="daba">
+    <div :class="{'hidden':hidden}" class="pagination-container ike">
+      <el-pagination
+        :current-page.sync="currentPage"
+          :page-size.sync="pageSize"
+          :layout="layout"
+        :small="true"
+          :page-sizes="pageSizes"
+          :pager-count="pagerCount"
+          :total="total"
+          v-bind="$attrs"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { scrollTo } from '@/utils/scroll-to'
+
+export default {
+  name: 'Pagination',
+  props: {
+    total: {
+      required: true,
+      type: Number
+    },
+    page: {
+      type: Number,
+      default: 1
+    },
+    limit: {
+      type: Number,
+      default: 20
+    },
+    pageSizes: {
+      type: Array,
+      default() {
+        return [10, 20, 30, 50]
+      }
+    },
+    // 移动端页码按钮的数量端默认值5
+    pagerCount: {
+      type: Number,
+      default: document.body.clientWidth < 992 ? 5 : 7
+    },
+    layout: {
+      type: String,
+      default: 'total,  prev, pager, next'
+    },
+    background: {
+      type: Boolean,
+      default: true
+    },
+    autoScroll: {
+      type: Boolean,
+      default: true
+    },
+    hidden: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+    }
+  },
+  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)
+      }
+    }
+  },
+  methods: {
+    handleSizeChange(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.$emit('pagination', { page: val, limit: this.pageSize })
+      if (this.autoScroll) {
+        scrollTo(0, 800)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.ike {
+  /* background: #fff; */
+  text-align: center;
+  height: 50px;
+}
+.daba{
+  .pagination-container .el-pagination{
+    left: 50%;
+    transform: translateX(-50%);
+  }
+  .el-input__inner{
+    border: 0;
+    background: #E1E1E1;
+  }
+  .el-pagination button:disabled{
+    background-color:#E1E1E1;
+    color: #4B5A6D;
+
+
+  }
+  .el-pagination .btn-prev, .el-pagination .btn-next{
+    background-color:#E1E1E1;
+    color: #4B5A6D;
+  }
+  .el-pager li{
+    /* margin-right: 5px; */
+    background-color:#E1E1E1;
+    color: #4B5A6D;
+  }
+  .el-pagination.is-background .el-pager li:not(.disabled).active{
+    background-color:#03BF8A;
+    color: #fff;
+  }
+  .el-pager li.active{
+    background-color:#1890FF;
+    color: #fff;
+  }
+  .el-pager li:nth-child(1){
+    /* margin-left: 5px; */
+  }
+}
+
+.pagination-container.hidden {
+  display: none;
+}
+</style>

src/views/zhaoshang/touzf/index.vue

@@ -0,0 +1,629 @@
+<template>
+  <div class="app-container">
+    <el-form style="background-color: #fff;border-radius: 4px; padding-top: 10px;" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
+      <el-form-item label="入库时间" prop="noticeTitle">
+        <el-input
+          v-model="queryParams.noticeTitle"
+          placeholder="请输入公告标题"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="投资方名称" prop="createBy">
+        <el-input  
+          v-model="queryParams.createBy"
+          placeholder="请输入操作人员"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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>
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['system:notice:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['system:notice:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:notice:remove']"
+        >删除</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row> -->
+    <div style="margin-top: 15px;">
+		<div class=" infinite-list" :style="dynamicStyle"  >
+		  <div     :class=" ishsouetan == false? 'imghse hyeg' : 'hyeg'"   style="display: flex;flex-wrap: wrap;justify-content: space-between; " >
+		    <div    :class=" ishsouetan == false? 'box_3dr zuihsoue flex-col' : 'box_3dr  flex-col'"   v-for="(item,index ) in 4" :key="index" >
+		                  <div :class=" index == 0?'nshge box_4 flex-row' : 'box_4 flex-row'" style="justify-content: space-between;margin: 0;">
+		                    <div  @click="handleSelectionChange(item)" style="display: flex;align-items: center; cursor: pointer;" >
+		                      <img
+		                        class="thumbnail_21"
+		                        referrerpolicy="no-referrer"
+		                        src="../../../assets/images/icon_tzfk_mp_qy_white.png"
+								v-if="index == 0"
+		                      />
+							  <img
+							    class="thumbnail_21"
+							    referrerpolicy="no-referrer"
+							    src="../../../assets/images/icon_tzfk_mp_qy_blue.png"
+							  	v-else
+							  />
+		                      <span class="text_19">华能新能源科技有限公司</span>
+		                    </div>
+		                    <div>
+		                      <img
+		                        class="image_1"
+		                        referrerpolicy="no-referrer"
+		                        @click="handleUpdate(item)"
+		                        v-hasPermi="['manage:equipmentManage:edit']"
+		                        src="../../../assets/images/icon_tzfk_mp_gx_selected.png"
+								v-if="index == 0"
+		                      />
+							  <img
+							    class="image_1"
+							    referrerpolicy="no-referrer"
+							    @click="handleUpdate(item)"
+							    v-hasPermi="['manage:equipmentManage:edit']"
+							    src="../../../assets/images/icon_tzfk_mp_gx_normal.png"
+								v-else
+							  />
+		                      <img
+		                        class="thumbnail_22"
+		                        @click="handleDelete(item)"
+		                        v-hasPermi="['manage:equipmentManage:remove']"
+		                        referrerpolicy="no-referrer"
+		                         src="../../../assets/images/icon_tzfk_mp_gd_white.png"
+								 v-if="index == 0"
+								 />
+								 <img
+								   class="thumbnail_22"
+								   @click="handleDelete(item)"
+								   v-hasPermi="['manage:equipmentManage:remove']"
+								   referrerpolicy="no-referrer"
+								    src="../../../assets/images/icon_tzfk_mp_gd_black.png"
+									v-else
+									/>
+		                    </div>
+		                  </div>
+		                  <div style="padding: 10px;">
+		                    <span class="text_20">联系人：王敏溪 </span>
+		                    <div class="box_6 flex-row " style="align-items: center;">
+		                      <span class="text_21">联系方式： </span>
+		                      <div style="margin-left: 12px;">
+		                        15855355431
+		                      </div>
+		                    </div>
+		                    <div class="box_6 flex-row " style=" margin-bottom: 5px; margin-top: 0; align-items: center;">
+		                      <span class="text_21" style="width: 88px;">企业注册时间：</span>
+		                      <div style=" margin-left: 12px; font-weight: 500;font-size: 14px;color: #666666; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+		                           2018 年 7 月 23 日
+		                      </div>
+		                    </div>
+		                    <!-- <span class="text_20">设备地址：192.168.1.1</span> -->
+		                    <span class="text_20" >注册资金：500万元</span>
+		                  </div>
+						  <div class="xnhse">
+						  	<div>
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_bj.png"/>
+						  		   <span>编辑信息</span>
+						  	</div>
+						  	<div style="margin: 10px 0;">
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_ls.png"/>
+						  		   <span>历史投资</span>
+						  	</div>
+						  	<div>
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_del.png"/>
+						  		   <span>删除名片</span>
+						  	</div>
+						  </div>
+		                </div>
+						
+						
+		
+		  </div>
+		  <!-- <div v-if='equipmentManageList == 0'>
+		    <el-empty :image-size="200"></el-empty>
+		  </div> -->
+		</div>
+	</div>
+    <paginations
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改公告对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="公告标题" prop="noticeTitle">
+              <el-input v-model="form.noticeTitle" placeholder="请输入公告标题" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="公告类型" prop="noticeType">
+              <el-select v-model="form.noticeType" placeholder="请选择公告类型">
+                <el-option
+                  v-for="dict in dict.type.sys_notice_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="状态">
+              <el-radio-group v-model="form.status">
+                <el-radio
+                  v-for="dict in dict.type.sys_notice_status"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{dict.label}}</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="内容">
+              <editor v-model="form.noticeContent" :min-height="192"/>
+            </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 { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice"
+
+export default {
+  name: "Notice",
+  dicts: ['sys_notice_status', 'sys_notice_type'],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+	  ishsouetan:false,
+      // 总条数
+      total: 0,
+      // 公告表格数据
+      noticeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        noticeTitle: undefined,
+        createBy: undefined,
+        status: undefined
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        noticeTitle: [
+          { required: true, message: "公告标题不能为空", trigger: "blur" }
+        ],
+        noticeType: [
+          { required: true, message: "公告类型不能为空", trigger: "change" }
+        ]
+      },
+	  tableMaxHeight:380
+    }
+  },
+  created() {
+    this.getList()
+  },
+  computed: {
+    dynamicStyle() {
+      return {
+        overflow:'auto',
+        height:  this.tableMaxHeight + 'px',
+      }
+    }
+    },
+  methods: {
+    /** 查询公告列表 */
+    getList() {
+      this.loading = true
+      listNotice(this.queryParams).then(response => {
+        this.noticeList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        noticeId: undefined,
+        noticeTitle: undefined,
+        noticeType: undefined,
+        noticeContent: undefined,
+        status: "0"
+      }
+      this.resetForm("form")
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm")
+      this.handleQuery()
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.noticeId)
+      this.single = selection.length!=1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = "添加公告"
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset()
+      const noticeId = row.noticeId || this.ids
+      getNotice(noticeId).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = "修改公告"
+      })
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.noticeId != undefined) {
+            updateNotice(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功")
+              this.open = false
+              this.getList()
+            })
+          } else {
+            addNotice(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功")
+              this.open = false
+              this.getList()
+            })
+          }
+        }
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const noticeIds = row.noticeId || this.ids
+      this.$modal.confirm('是否确认删除公告编号为"' + noticeIds + '"的数据项？').then(function() {
+        return delNotice(noticeIds)
+      }).then(() => {
+        this.getList()
+        this.$modal.msgSuccess("删除成功")
+      }).catch(() => {})
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+	.flex-col {
+	  display: flex;
+	  flex-direction: column;
+	}
+	.flex-row {
+	  display: flex;
+	  flex-direction: row;
+	}
+	.justify-between {
+	  display: flex;
+	  justify-content: space-between;
+	}
+	
+	.box_3dr {
+	  background-color: rgba(255, 255, 255, 1);
+	  border-radius: 10px;
+	  position: relative;
+	  width: 49%;
+	  // height: 100%;
+	  /* padding-bottom: 15px; */
+	  /* margin-left: 5px ;
+	  margin-right: 5px; */
+	  margin-bottom: 10px !important;
+	}
+	.box_4 {
+	  width: 100%;
+	  /* height: 18px; */
+	  padding: 11px 10px 11px 10px;
+	  border-bottom: 1px solid #E6E6E6;
+	}
+	.thumbnail_21 {
+	  width: 18px;
+	  height: 18px;
+	}
+	.text_19 {
+	  /* width: 97px; */
+	  height: 13px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 16px;
+	  font-family: PingFang-SC-Bold;
+	  font-weight: 700;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 13px;
+	  margin: 0 0 0 11px;
+	}
+	.image_1 {
+	  width:14px;
+	  height: 14px;
+	  /* margin-left: 51px; */
+	}
+	.thumbnail_22 {
+	  // width: 14px;
+	  // height: 14px;
+	  margin: 3px 0 0 10px;
+	}
+	.image_2 {
+	  width: 248px;
+	  height: 1px;
+	  margin-top: 9px;
+	}
+	.box_5 {
+	  background-color: rgba(255, 255, 255, 1);
+	 /* width: 220px; */
+	  height: 118px;
+	  padding: 10px;
+	  /* margin: 12px 0 0 14px; */
+	}
+	.text_20 {
+	  /* width: 139px; */
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 8px;
+	  margin: 0 0 14px 0;
+	}
+	.box_6 {
+	  /* width: 126px; */
+	  height: 24px;
+	  margin: 5px 0 0 0;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	}
+	.text_21 {
+	  width: 60px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 8px;
+	  margin-top: 5px;
+	}
+	.text-wrapper_7 {
+	  background-color: rgba(255, 244, 235, 1);
+	  border-radius: 4px;
+	  height: 24px;
+	  border: 1px solid rgba(253, 127, 16, 1);
+	  width: 58px;
+	}
+	.text_22 {
+	  width: 42px;
+	  height: 13px;
+	  overflow-wrap: break-word;
+	  color: rgba(253, 127, 16, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 6px 0 0 8px;
+	}
+	.text_23 {
+	  width: 145px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 8px 0 0 14px;
+	}
+	.text_24 {
+	  width: 152px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 13px 0 0 14px;
+	}
+	.text_25 {
+	  width: 154px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 13px 0 15px 15px;
+	}
+	.box_7 {
+	  box-shadow: 0px 0px 10px 0px rgba(209, 209, 209, 1);
+	  background-color: rgba(255, 255, 255, 1);
+	  border-radius: 8px;
+	  position: absolute;
+	  left: 159px;
+	  top: 35px;
+	  width: 88px;
+	  height: 70px;
+	}
+	.image-text_2 {
+	  width: 58px;
+	  height: 15px;
+	  margin: 13px 0 0 16px;
+	}
+	.thumbnail_23 {
+	  width: 15px;
+	  height: 15px;
+	}
+	.text-group_2 {
+	  width: 27px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(61, 69, 91, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 80px;
+	  margin-top: 1px;
+	}
+	.image-text_3 {
+	  width: 59px;
+	  height: 17px;
+	  margin: 11px 0 14px 15px;
+	}
+	.thumbnail_24 {
+	  width: 16px;
+	  height: 17px;
+	}
+	.text-group_3 {
+	  width: 27px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(61, 69, 91, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 80px;
+	  margin-top: 2px;
+	}
+	.zuihsoue{
+	  width: 32.2%;
+	  margin: 0 5px;
+	  justify-content: flex-start !important;
+	  height: 155px;
+	}
+	.imghse{
+	  justify-content: flex-start !important;
+	}
+	.hyeg{
+	  // height: 100% !important;
+	}
+	.xnhse{
+		width: 110px;
+		height: 102px;
+		background: #FFFFFF;
+		box-shadow: 0px 0px 10px 0px #D1D1D1;
+		border-radius: 8px;
+		padding: 15px;
+		position: absolute;
+		right: 0;
+		top:40px;
+		div{
+			
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			span{
+				font-family: PingFang SC;
+				font-weight: 500;
+				font-size: 14px;
+				color: #3D455B;
+			}
+		}
+	}
+	.nshge{
+		background-color: #1890FF;
+		span{
+			color: #fff;
+		}
+	}
+</style>

src/views/zhaoshang/wanchxq/index.vue

@@ -0,0 +1,629 @@
+<template>
+  <div class="app-container">
+    <el-form style="background-color: #fff;border-radius: 4px; padding-top: 10px;" :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="88px">
+      <el-form-item label="入库时间" prop="noticeTitle">
+        <el-input
+          v-model="queryParams.noticeTitle"
+          placeholder="请输入公告标题"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="投资方名称" prop="createBy">
+        <el-input  
+          v-model="queryParams.createBy"
+          placeholder="请输入操作人员"
+          clearable
+          @keyup.enter.native="handleQuery"
+        />
+      </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>
+
+    <!-- <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['system:notice:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          plain
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['system:notice:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          plain
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['system:notice:remove']"
+        >删除</el-button>
+      </el-col>
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row> -->
+    <div style="margin-top: 15px;">
+		<div class=" infinite-list" :style="dynamicStyle"  >
+		  <div     :class=" ishsouetan == false? 'imghse hyeg' : 'hyeg'"   style="display: flex;flex-wrap: wrap;justify-content: space-between; " >
+		    <div    :class=" ishsouetan == false? 'box_3dr zuihsoue flex-col' : 'box_3dr  flex-col'"   v-for="(item,index ) in 4" :key="index" >
+		                  <div :class=" index == 0?'nshge box_4 flex-row' : 'box_4 flex-row'" style="justify-content: space-between;margin: 0;">
+		                    <div  @click="handleSelectionChange(item)" style="display: flex;align-items: center; cursor: pointer;" >
+		                      <img
+		                        class="thumbnail_21"
+		                        referrerpolicy="no-referrer"
+		                        src="../../../assets/images/icon_tzfk_mp_qy_white.png"
+								v-if="index == 0"
+		                      />
+							  <img
+							    class="thumbnail_21"
+							    referrerpolicy="no-referrer"
+							    src="../../../assets/images/icon_tzfk_mp_qy_blue.png"
+							  	v-else
+							  />
+		                      <span class="text_19">华能新能源科技有限公司</span>
+		                    </div>
+		                    <div>
+		                      <img
+		                        class="image_1"
+		                        referrerpolicy="no-referrer"
+		                        @click="handleUpdate(item)"
+		                        v-hasPermi="['manage:equipmentManage:edit']"
+		                        src="../../../assets/images/icon_tzfk_mp_gx_selected.png"
+								v-if="index == 0"
+		                      />
+							  <img
+							    class="image_1"
+							    referrerpolicy="no-referrer"
+							    @click="handleUpdate(item)"
+							    v-hasPermi="['manage:equipmentManage:edit']"
+							    src="../../../assets/images/icon_tzfk_mp_gx_normal.png"
+								v-else
+							  />
+		                      <img
+		                        class="thumbnail_22"
+		                        @click="handleDelete(item)"
+		                        v-hasPermi="['manage:equipmentManage:remove']"
+		                        referrerpolicy="no-referrer"
+		                         src="../../../assets/images/icon_tzfk_mp_gd_white.png"
+								 v-if="index == 0"
+								 />
+								 <img
+								   class="thumbnail_22"
+								   @click="handleDelete(item)"
+								   v-hasPermi="['manage:equipmentManage:remove']"
+								   referrerpolicy="no-referrer"
+								    src="../../../assets/images/icon_tzfk_mp_gd_black.png"
+									v-else
+									/>
+		                    </div>
+		                  </div>
+		                  <div style="padding: 10px;">
+		                    <span class="text_20">联系人：王敏溪 </span>
+		                    <div class="box_6 flex-row " style="align-items: center;">
+		                      <span class="text_21">联系方式： </span>
+		                      <div style="margin-left: 12px;">
+		                        15855355431
+		                      </div>
+		                    </div>
+		                    <div class="box_6 flex-row " style=" margin-bottom: 5px; margin-top: 0; align-items: center;">
+		                      <span class="text_21" style="width: 88px;">企业注册时间：</span>
+		                      <div style=" margin-left: 12px; font-weight: 500;font-size: 14px;color: #666666; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
+		                           2018 年 7 月 23 日
+		                      </div>
+		                    </div>
+		                    <!-- <span class="text_20">设备地址：192.168.1.1</span> -->
+		                    <span class="text_20" >注册资金：500万元</span>
+		                  </div>
+						  <div class="xnhse">
+						  	<div>
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_bj.png"/>
+						  		   <span>编辑信息</span>
+						  	</div>
+						  	<div style="margin: 10px 0;">
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_ls.png"/>
+						  		   <span>历史投资</span>
+						  	</div>
+						  	<div>
+						  		<img
+						  		  referrerpolicy="no-referrer"
+						  		   src="../../../assets/images/icon_tzfk_mp_gd_del.png"/>
+						  		   <span>删除名片</span>
+						  	</div>
+						  </div>
+		                </div>
+						
+						
+		
+		  </div>
+		  <!-- <div v-if='equipmentManageList == 0'>
+		    <el-empty :image-size="200"></el-empty>
+		  </div> -->
+		</div>
+	</div>
+    <paginations
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改公告对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="780px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="公告标题" prop="noticeTitle">
+              <el-input v-model="form.noticeTitle" placeholder="请输入公告标题" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="公告类型" prop="noticeType">
+              <el-select v-model="form.noticeType" placeholder="请选择公告类型">
+                <el-option
+                  v-for="dict in dict.type.sys_notice_type"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                ></el-option>
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="状态">
+              <el-radio-group v-model="form.status">
+                <el-radio
+                  v-for="dict in dict.type.sys_notice_status"
+                  :key="dict.value"
+                  :label="dict.value"
+                >{{dict.label}}</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="内容">
+              <editor v-model="form.noticeContent" :min-height="192"/>
+            </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 { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice"
+
+export default {
+  name: "Notice",
+  dicts: ['sys_notice_status', 'sys_notice_type'],
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中数组
+      ids: [],
+      // 非单个禁用
+      single: true,
+      // 非多个禁用
+      multiple: true,
+      // 显示搜索条件
+      showSearch: true,
+	  ishsouetan:false,
+      // 总条数
+      total: 0,
+      // 公告表格数据
+      noticeList: [],
+      // 弹出层标题
+      title: "",
+      // 是否显示弹出层
+      open: false,
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        noticeTitle: undefined,
+        createBy: undefined,
+        status: undefined
+      },
+      // 表单参数
+      form: {},
+      // 表单校验
+      rules: {
+        noticeTitle: [
+          { required: true, message: "公告标题不能为空", trigger: "blur" }
+        ],
+        noticeType: [
+          { required: true, message: "公告类型不能为空", trigger: "change" }
+        ]
+      },
+	  tableMaxHeight:380
+    }
+  },
+  created() {
+    this.getList()
+  },
+  computed: {
+    dynamicStyle() {
+      return {
+        overflow:'auto',
+        height:  this.tableMaxHeight + 'px',
+      }
+    }
+    },
+  methods: {
+    /** 查询公告列表 */
+    getList() {
+      this.loading = true
+      listNotice(this.queryParams).then(response => {
+        this.noticeList = response.rows
+        this.total = response.total
+        this.loading = false
+      })
+    },
+    // 取消按钮
+    cancel() {
+      this.open = false
+      this.reset()
+    },
+    // 表单重置
+    reset() {
+      this.form = {
+        noticeId: undefined,
+        noticeTitle: undefined,
+        noticeType: undefined,
+        noticeContent: undefined,
+        status: "0"
+      }
+      this.resetForm("form")
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.resetForm("queryForm")
+      this.handleQuery()
+    },
+    // 多选框选中数据
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.noticeId)
+      this.single = selection.length!=1
+      this.multiple = !selection.length
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+      this.reset()
+      this.open = true
+      this.title = "添加公告"
+    },
+    /** 修改按钮操作 */
+    handleUpdate(row) {
+      this.reset()
+      const noticeId = row.noticeId || this.ids
+      getNotice(noticeId).then(response => {
+        this.form = response.data
+        this.open = true
+        this.title = "修改公告"
+      })
+    },
+    /** 提交按钮 */
+    submitForm: function() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.form.noticeId != undefined) {
+            updateNotice(this.form).then(response => {
+              this.$modal.msgSuccess("修改成功")
+              this.open = false
+              this.getList()
+            })
+          } else {
+            addNotice(this.form).then(response => {
+              this.$modal.msgSuccess("新增成功")
+              this.open = false
+              this.getList()
+            })
+          }
+        }
+      })
+    },
+    /** 删除按钮操作 */
+    handleDelete(row) {
+      const noticeIds = row.noticeId || this.ids
+      this.$modal.confirm('是否确认删除公告编号为"' + noticeIds + '"的数据项？').then(function() {
+        return delNotice(noticeIds)
+      }).then(() => {
+        this.getList()
+        this.$modal.msgSuccess("删除成功")
+      }).catch(() => {})
+    }
+  }
+}
+</script>
+<style scoped lang="scss">
+	.flex-col {
+	  display: flex;
+	  flex-direction: column;
+	}
+	.flex-row {
+	  display: flex;
+	  flex-direction: row;
+	}
+	.justify-between {
+	  display: flex;
+	  justify-content: space-between;
+	}
+	
+	.box_3dr {
+	  background-color: rgba(255, 255, 255, 1);
+	  border-radius: 10px;
+	  position: relative;
+	  width: 49%;
+	  // height: 100%;
+	  /* padding-bottom: 15px; */
+	  /* margin-left: 5px ;
+	  margin-right: 5px; */
+	  margin-bottom: 10px !important;
+	}
+	.box_4 {
+	  width: 100%;
+	  /* height: 18px; */
+	  padding: 11px 10px 11px 10px;
+	  border-bottom: 1px solid #E6E6E6;
+	}
+	.thumbnail_21 {
+	  width: 18px;
+	  height: 18px;
+	}
+	.text_19 {
+	  /* width: 97px; */
+	  height: 13px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 16px;
+	  font-family: PingFang-SC-Bold;
+	  font-weight: 700;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 13px;
+	  margin: 0 0 0 11px;
+	}
+	.image_1 {
+	  width:14px;
+	  height: 14px;
+	  /* margin-left: 51px; */
+	}
+	.thumbnail_22 {
+	  // width: 14px;
+	  // height: 14px;
+	  margin: 3px 0 0 10px;
+	}
+	.image_2 {
+	  width: 248px;
+	  height: 1px;
+	  margin-top: 9px;
+	}
+	.box_5 {
+	  background-color: rgba(255, 255, 255, 1);
+	 /* width: 220px; */
+	  height: 118px;
+	  padding: 10px;
+	  /* margin: 12px 0 0 14px; */
+	}
+	.text_20 {
+	  /* width: 139px; */
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 8px;
+	  margin: 0 0 14px 0;
+	}
+	.box_6 {
+	  /* width: 126px; */
+	  height: 24px;
+	  margin: 5px 0 0 0;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	}
+	.text_21 {
+	  width: 60px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  font-family: PingFang SC;
+	  font-weight: 500;
+	  font-size: 14px;
+	  color: #666666;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 8px;
+	  margin-top: 5px;
+	}
+	.text-wrapper_7 {
+	  background-color: rgba(255, 244, 235, 1);
+	  border-radius: 4px;
+	  height: 24px;
+	  border: 1px solid rgba(253, 127, 16, 1);
+	  width: 58px;
+	}
+	.text_22 {
+	  width: 42px;
+	  height: 13px;
+	  overflow-wrap: break-word;
+	  color: rgba(253, 127, 16, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 6px 0 0 8px;
+	}
+	.text_23 {
+	  width: 145px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 8px 0 0 14px;
+	}
+	.text_24 {
+	  width: 152px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 13px 0 0 14px;
+	}
+	.text_25 {
+	  width: 154px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(34, 35, 39, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 46px;
+	  margin: 13px 0 15px 15px;
+	}
+	.box_7 {
+	  box-shadow: 0px 0px 10px 0px rgba(209, 209, 209, 1);
+	  background-color: rgba(255, 255, 255, 1);
+	  border-radius: 8px;
+	  position: absolute;
+	  left: 159px;
+	  top: 35px;
+	  width: 88px;
+	  height: 70px;
+	}
+	.image-text_2 {
+	  width: 58px;
+	  height: 15px;
+	  margin: 13px 0 0 16px;
+	}
+	.thumbnail_23 {
+	  width: 15px;
+	  height: 15px;
+	}
+	.text-group_2 {
+	  width: 27px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(61, 69, 91, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 80px;
+	  margin-top: 1px;
+	}
+	.image-text_3 {
+	  width: 59px;
+	  height: 17px;
+	  margin: 11px 0 14px 15px;
+	}
+	.thumbnail_24 {
+	  width: 16px;
+	  height: 17px;
+	}
+	.text-group_3 {
+	  width: 27px;
+	  height: 14px;
+	  overflow-wrap: break-word;
+	  color: rgba(61, 69, 91, 1);
+	  font-size: 14px;
+	  font-family: PingFang-SC-Medium;
+	  font-weight: 500;
+	  text-align: left;
+	  white-space: nowrap;
+	  line-height: 80px;
+	  margin-top: 2px;
+	}
+	.zuihsoue{
+	  width: 32.2%;
+	  margin: 0 5px;
+	  justify-content: flex-start !important;
+	  height: 155px;
+	}
+	.imghse{
+	  justify-content: flex-start !important;
+	}
+	.hyeg{
+	  // height: 100% !important;
+	}
+	.xnhse{
+		width: 110px;
+		height: 102px;
+		background: #FFFFFF;
+		box-shadow: 0px 0px 10px 0px #D1D1D1;
+		border-radius: 8px;
+		padding: 15px;
+		position: absolute;
+		right: 0;
+		top:40px;
+		div{
+			
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			span{
+				font-family: PingFang SC;
+				font-weight: 500;
+				font-size: 14px;
+				color: #3D455B;
+			}
+		}
+	}
+	.nshge{
+		background-color: #1890FF;
+		span{
+			color: #fff;
+		}
+	}
+</style>