Compare commits
	
		
			9 Commits
		
	
	
		
	
	| Author | SHA1 | Date | |
|---|---|---|---|
| 
						 | 
					3a98b7ceea | ||
| a6060b5a3b | |||
| 6955d75dd6 | |||
| db5e8db835 | |||
| 0d9b39d920 | |||
| a438469c6b | |||
| a78c20ec59 | |||
| 63d8a33994 | |||
| 43c75e5d8f | 
@@ -1,6 +1,6 @@
 | 
			
		||||
{
 | 
			
		||||
  "name": "code-brick-zj",
 | 
			
		||||
  "version": "0.0.3",
 | 
			
		||||
  "version": "0.0.7",
 | 
			
		||||
  "private": false,
 | 
			
		||||
  "description": "组件封装",
 | 
			
		||||
  "main": "index.js"
 | 
			
		||||
 
 | 
			
		||||
@@ -66,34 +66,32 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="scss">
 | 
			
		||||
.baseDialog {
 | 
			
		||||
  .el-dialog__header {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
    font-weight: 500;
 | 
			
		||||
    padding: 13px 24px;
 | 
			
		||||
    border-bottom: 1px solid #e9e9e9;
 | 
			
		||||
    .titleStyle::before{
 | 
			
		||||
      content: '';
 | 
			
		||||
      display: inline-block;
 | 
			
		||||
      width: 4px;
 | 
			
		||||
      height: 16px;
 | 
			
		||||
      background-color: #0B58FF;
 | 
			
		||||
      border-radius: 1px;
 | 
			
		||||
      margin-right: 8px;
 | 
			
		||||
      position: relative;
 | 
			
		||||
      top: 2px;
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
  .el-dialog__body {
 | 
			
		||||
    padding-left: 24px;
 | 
			
		||||
    padding-right: 24px;
 | 
			
		||||
  }
 | 
			
		||||
  .btnTextStyle {
 | 
			
		||||
    letter-spacing:6px;
 | 
			
		||||
    padding: 9px 10px 9px 16px;
 | 
			
		||||
    font-size: 14px;
 | 
			
		||||
  }
 | 
			
		||||
<style>
 | 
			
		||||
.baseDialog .el-dialog__header {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
  font-weight: 500;
 | 
			
		||||
  padding: 13px 24px;
 | 
			
		||||
  border-bottom: 1px solid #e9e9e9;
 | 
			
		||||
}
 | 
			
		||||
.baseDialog .el-dialog__header .titleStyle::before{
 | 
			
		||||
  content: '';
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 16px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  position: relative;
 | 
			
		||||
  top: 2px;
 | 
			
		||||
}
 | 
			
		||||
.baseDialog .el-dialog__body {
 | 
			
		||||
  padding-left: 24px;
 | 
			
		||||
  padding-right: 24px;
 | 
			
		||||
}
 | 
			
		||||
.baseDialog .btnTextStyle {
 | 
			
		||||
  letter-spacing:6px;
 | 
			
		||||
  padding: 9px 10px 9px 16px;
 | 
			
		||||
  font-size: 14px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,10 @@
 | 
			
		||||
<template>
 | 
			
		||||
  <div class="baseTable">
 | 
			
		||||
    <el-table
 | 
			
		||||
      :ref="id"
 | 
			
		||||
      :data="renderData"
 | 
			
		||||
      v-bind="$attrs"
 | 
			
		||||
      :border="cancelBorder ? false : true"
 | 
			
		||||
      @current-change="currentChange"
 | 
			
		||||
      @selection-change="handleSelectionChange"
 | 
			
		||||
      style="width: 100%"
 | 
			
		||||
@@ -23,7 +25,7 @@
 | 
			
		||||
        prop="_pageIndex"
 | 
			
		||||
        :width="pageWidth"
 | 
			
		||||
        align="center"
 | 
			
		||||
        fixed
 | 
			
		||||
        :fixed="cancelPageFixed ? false : true"
 | 
			
		||||
      >
 | 
			
		||||
        <template slot="header">
 | 
			
		||||
          <el-popover placement="bottom-start" width="300" trigger="click">
 | 
			
		||||
@@ -115,6 +117,14 @@ export default {
 | 
			
		||||
    }
 | 
			
		||||
  },
 | 
			
		||||
  props: {
 | 
			
		||||
    cancelBorder: {
 | 
			
		||||
      type: Boolean,
 | 
			
		||||
      default: false
 | 
			
		||||
    },
 | 
			
		||||
    cancelPageFixed: {
 | 
			
		||||
      type: Boolean,
 | 
			
		||||
      default: false
 | 
			
		||||
    },
 | 
			
		||||
    tableData: {
 | 
			
		||||
      type: Array,
 | 
			
		||||
      required: true,
 | 
			
		||||
@@ -128,6 +138,11 @@ export default {
 | 
			
		||||
        return []
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    id: {
 | 
			
		||||
      type: String,
 | 
			
		||||
      required: false,
 | 
			
		||||
      default: ''
 | 
			
		||||
    },
 | 
			
		||||
    page: {
 | 
			
		||||
      type: Number,
 | 
			
		||||
      required: false,
 | 
			
		||||
@@ -189,49 +204,54 @@ export default {
 | 
			
		||||
    },
 | 
			
		||||
    emitButtonClick() {
 | 
			
		||||
      this.$emit('emitButtonClick')
 | 
			
		||||
    },
 | 
			
		||||
    setCurrent(name, index) {
 | 
			
		||||
      let _this = this
 | 
			
		||||
      let obj = _this.$refs[name].data[index]
 | 
			
		||||
      _this.$refs[name].setCurrentRow(obj)
 | 
			
		||||
    },
 | 
			
		||||
    doLayout(name) {
 | 
			
		||||
      this.$refs[name].doLayout()
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
.baseTable {
 | 
			
		||||
  .show-col-btn {
 | 
			
		||||
    margin-right: 5px;
 | 
			
		||||
    line-height: inherit;
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
  }
 | 
			
		||||
  .el-icon-refresh {
 | 
			
		||||
    cursor: pointer;
 | 
			
		||||
  }
 | 
			
		||||
<style scoped>
 | 
			
		||||
.baseTable .show-col-btn {
 | 
			
		||||
  margin-right: 5px;
 | 
			
		||||
  line-height: inherit;
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
.baseTable .el-icon-refresh {
 | 
			
		||||
  cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang="scss">
 | 
			
		||||
.baseTable {
 | 
			
		||||
  .el-table__body tr.current-row>td.el-table__cell {
 | 
			
		||||
      background-color: #EAF1FC;
 | 
			
		||||
  }
 | 
			
		||||
  .el-table .el-table__cell {
 | 
			
		||||
    padding: 0;
 | 
			
		||||
    height: 35px;
 | 
			
		||||
  }
 | 
			
		||||
  .addButton {
 | 
			
		||||
    width: 100%;
 | 
			
		||||
    height: 35px;
 | 
			
		||||
    border-top: none;
 | 
			
		||||
    color: #0b58ff;
 | 
			
		||||
    border-color: #ebeef5;
 | 
			
		||||
    border-radius: 0;
 | 
			
		||||
  }
 | 
			
		||||
  .addButton:hover {
 | 
			
		||||
    color: #0b58ff;
 | 
			
		||||
    border-color: #ebeef5;
 | 
			
		||||
    background-color: #fff;
 | 
			
		||||
  }
 | 
			
		||||
  .addButton:focus {
 | 
			
		||||
    border-color: #ebeef5;
 | 
			
		||||
    background-color: #fff;
 | 
			
		||||
  }
 | 
			
		||||
<style>
 | 
			
		||||
.baseTable .el-table__body tr.current-row>td.el-table__cell {
 | 
			
		||||
    background-color: #EAF1FC;
 | 
			
		||||
}
 | 
			
		||||
.baseTable .el-table .el-table__cell {
 | 
			
		||||
  padding: 0;
 | 
			
		||||
  height: 35px;
 | 
			
		||||
}
 | 
			
		||||
.baseTable .addButton {
 | 
			
		||||
  width: 100%;
 | 
			
		||||
  height: 35px;
 | 
			
		||||
  border-top: none;
 | 
			
		||||
  color: #0b58ff;
 | 
			
		||||
  border-color: #ebeef5;
 | 
			
		||||
  border-radius: 0;
 | 
			
		||||
}
 | 
			
		||||
.baseTable .addButton:hover {
 | 
			
		||||
  color: #0b58ff;
 | 
			
		||||
  border-color: #ebeef5;
 | 
			
		||||
  background-color: #fff;
 | 
			
		||||
}
 | 
			
		||||
.baseTable .addButton:focus {
 | 
			
		||||
  border-color: #ebeef5;
 | 
			
		||||
  background-color: #fff;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.el-tooltip__popper.is-dark {
 | 
			
		||||
  background: rgba(0, 0, 0, 0.6) !important;
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -28,7 +28,7 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="css">
 | 
			
		||||
<style>
 | 
			
		||||
.tableInner .el-input__inner {
 | 
			
		||||
  border: none;
 | 
			
		||||
  padding: 0;
 | 
			
		||||
 
 | 
			
		||||
@@ -95,6 +95,13 @@ export default {
 | 
			
		||||
      let showStatus = true
 | 
			
		||||
      const showStatusArr = showParam.data.map((item) => {
 | 
			
		||||
        let showStatusItem = true
 | 
			
		||||
        if (item.type === 'have') {
 | 
			
		||||
          if (row[item.name] !== item.value) {
 | 
			
		||||
            showStatusItem = true
 | 
			
		||||
          } else {
 | 
			
		||||
            showStatusItem = false
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        if (item.type === 'unequal') {
 | 
			
		||||
          if (row[item.name] !== item.value) {
 | 
			
		||||
            showStatusItem = true
 | 
			
		||||
@@ -123,6 +130,13 @@ export default {
 | 
			
		||||
            showStatusItem = false
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        if (item.type === 'have') {
 | 
			
		||||
          if (row[item.name] !== item.value) {
 | 
			
		||||
            showStatusItem = true
 | 
			
		||||
          } else {
 | 
			
		||||
            showStatusItem = false
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        if (item.type === 'indexof') {
 | 
			
		||||
          if (item.value.indexOf(row[item.name]) >= 0) {
 | 
			
		||||
            showStatusItem = true
 | 
			
		||||
 
 | 
			
		||||
@@ -77,28 +77,26 @@ export default {
 | 
			
		||||
  text-align: right;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
<style lang='scss'>
 | 
			
		||||
.pagination-container {
 | 
			
		||||
  .el-pagination {
 | 
			
		||||
    position: relative;
 | 
			
		||||
  }
 | 
			
		||||
<style>
 | 
			
		||||
.pagination-container .el-pagination {
 | 
			
		||||
  position: relative;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
  .el-pagination__jump {
 | 
			
		||||
    margin-left: 125px;
 | 
			
		||||
  }
 | 
			
		||||
.pagination-container .el-pagination__jump {
 | 
			
		||||
  margin-left: 125px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
  .el-pagination__sizes {
 | 
			
		||||
    position: absolute;
 | 
			
		||||
    right: 100px;
 | 
			
		||||
  }
 | 
			
		||||
.pagination-container .el-pagination__sizes {
 | 
			
		||||
  position: absolute;
 | 
			
		||||
  right: 100px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
  .el-pager li.active {
 | 
			
		||||
    background-color: #0b58ff;
 | 
			
		||||
    color: #fff;
 | 
			
		||||
  }
 | 
			
		||||
.pagination-container .el-pager li.active {
 | 
			
		||||
  background-color: #0b58ff;
 | 
			
		||||
  color: #fff;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
  .el-input--mini .el-input__inner {
 | 
			
		||||
    height: 22px;
 | 
			
		||||
  }
 | 
			
		||||
.pagination-container .el-input--mini .el-input__inner {
 | 
			
		||||
  height: 22px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
@@ -101,6 +101,7 @@
 | 
			
		||||
          @click="headBtnClick(item.name)"
 | 
			
		||||
          >{{ item.btnName }}</el-button
 | 
			
		||||
        >
 | 
			
		||||
        <span v-if="item.type === 'separate'" class="separateStyle"></span>
 | 
			
		||||
        <!-- 可用于显示其他按钮 -->
 | 
			
		||||
      </el-form-item>
 | 
			
		||||
    </template>
 | 
			
		||||
@@ -231,28 +232,37 @@ export default {
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
<style lang="scss">
 | 
			
		||||
.searchBar {
 | 
			
		||||
  .blue-block {
 | 
			
		||||
    float: left;
 | 
			
		||||
    display: inline-block;
 | 
			
		||||
    width: 4px;
 | 
			
		||||
    height: 16px;
 | 
			
		||||
    background-color: #0B58FF;
 | 
			
		||||
    border-radius: 1px;
 | 
			
		||||
    margin-right: 8px;
 | 
			
		||||
    margin-top: 12px;
 | 
			
		||||
  }
 | 
			
		||||
  .el-form-item {
 | 
			
		||||
    margin-bottom: 10px;
 | 
			
		||||
  }
 | 
			
		||||
  .el-date-editor .el-range__icon {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color:#0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
  .el-input__prefix .el-icon-date {
 | 
			
		||||
    font-size: 16px;
 | 
			
		||||
    color:#0B58FF;
 | 
			
		||||
  }
 | 
			
		||||
<style>
 | 
			
		||||
.searchBar .blue-block {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  float: left;
 | 
			
		||||
  width: 4px;
 | 
			
		||||
  height: 16px;
 | 
			
		||||
  background-color: #0B58FF;
 | 
			
		||||
  border-radius: 1px;
 | 
			
		||||
  margin-right: 8px;
 | 
			
		||||
  margin-top: 12px;
 | 
			
		||||
}
 | 
			
		||||
.searchBar .el-form-item {
 | 
			
		||||
  margin-bottom: 10px;
 | 
			
		||||
}
 | 
			
		||||
.searchBar .el-date-editor .el-range__icon {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color:#0B58FF;
 | 
			
		||||
}
 | 
			
		||||
.searchBar .el-input__prefix .el-icon-date {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color:#0B58FF;
 | 
			
		||||
}
 | 
			
		||||
.searchBar .el-input__prefix .el-icon-time {
 | 
			
		||||
  font-size: 16px;
 | 
			
		||||
  color:#0B58FF;
 | 
			
		||||
}
 | 
			
		||||
.searchBar .separateStyle {
 | 
			
		||||
  display: inline-block;
 | 
			
		||||
  width: 1px;
 | 
			
		||||
  height: 24px;
 | 
			
		||||
  background: #E8E8E8;
 | 
			
		||||
  vertical-align: middle;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user