{"remainingRequest":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\style-vw-loader\\index.js??ref--0-2!C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\src\\components\\common\\dymic_table.vue?vue&type=style&index=0&id=6d0d2c4d&lang=scss&scoped=true&","dependencies":[{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\src\\components\\common\\dymic_table.vue","mtime":1663828782925},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000},{"path":"C:\\Users\\100zone\\Desktop\\baizong\\community\\SmartCommunity\\videoSurveillance\\node_modules\\style-vw-loader\\index.js","mtime":1540864632000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\r\n/deep/.dymic-table .el-table .el-table__body td p{\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\r\n}\r\n/deep/.dymic-table .el-table--enable-row-transition .el-table__body td{\r\n  border:none;\r\n}\r\n.dymic-table .el-table {\r\n  border-radius: 6px;\r\n}\r\n/deep/ .el-table{\r\n  .el-table__header-wrapper thead tr th:nth-child(-n+2){\r\n        .cell{\r\n           width: max-content;\r\n        }\r\n        \r\n    }\r\n}\r\n",{"version":3,"sources":["dymic_table.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2TA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA","file":"dymic_table.vue","sourceRoot":"src/components/common","sourcesContent":["<template>\r\n  <div class=\"dymic-table scrollbar\">\r\n    <el-table\r\n      :height=\"height\"\r\n      class=\"no-scrollbar\"\r\n      :summary-method=\"getSummaries\"\r\n      style=\"width: 100%\"\r\n      :data=\"data\"\r\n      :show-header=\"settings.showHeader\"\r\n      size=\"small\"\r\n      lazy\r\n      v-loading=\"loading\"\r\n      :row-class-name=\"setRowClassName\"\r\n      :show-summary=\"!!(settings.summaryCol && settings.summaryCol.length)\"\r\n      @selection-change=\"selectionChange\"\r\n      :empty-text=\"emptyText\"\r\n    >\r\n      <el-table-column\r\n        type=\"selection\"\r\n        width=\"50\"\r\n        align=\"center\"\r\n        v-if=\"settings.showCheckbox\"\r\n        :selectable=\"selectable\"\r\n      ></el-table-column>\r\n      <el-table-column\r\n        label=\"No.\"\r\n        type=\"index\"\r\n        align=\"center\"\r\n        v-if=\"settings.showIndex\"\r\n      ></el-table-column>\r\n      <el-table-column\r\n        v-for=\"(item, index) in cols\"\r\n        :key=\"index\"\r\n        :width=\"item.width\"\r\n        :min-width=\"item.minWidth\"\r\n        :label=\"item.label\"\r\n        :prop=\"item.prop\"\r\n        align=\"center\"\r\n      >\r\n        <template v-if=\"item.children\" :label=\"item.label\">\r\n          <el-table-column\r\n            v-for=\"(item1, index1) in item.children\"\r\n            :prop=\"item1.prop\"\r\n            :key=\"index1\"\r\n            :width=\"item.width\"\r\n            :min-width=\"item.minWidth\"\r\n            :label=\"item1.label\"\r\n            align=\"center\"\r\n          >\r\n            <template slot-scope=\"scope\">\r\n              <!-- 插槽 -->\r\n              <slotItem v-if=\"item1.slot\" :row=\"scope.row\" :index=\"scope.$index\" :slots=\"$scopedSlots[item1.slot]\"></slotItem>\r\n              <!-- 过滤方法 -->\r\n              <p v-else-if=\"item1.format\" v-tip\r\n              :data-txt=\"item1.format(scope.row[item1.prop],scope.row)\"\r\n              @click=\"item1.click?item1.click():null\">\r\n                {{\r\n                  item1.format(scope.row[item1.prop],scope.row)||\r\n                  (item1.format(scope.row[item1.prop],scope.row)===0?0:item1.empty?'':'-')\r\n                }}\r\n              </p>\r\n              <!-- 默认显示 -->\r\n              <p v-else-if=\"item1.fixToolTip\" v-tip.same :data-txt=\"scope.row[item1.prop]\" @click=\"item1.click?item1.click():null\">\r\n                {{scope.row[item1.prop]||(scope.row[item1.prop]===0?0:item1.empty?'':'-')}}\r\n              </p>\r\n              <p v-else v-tip :data-txt=\"scope.row[item1.prop]\" @click=\"item1.click?item1.click():null\">\r\n                {{scope.row[item1.prop]||(scope.row[item1.prop]===0?0:item1.empty?'':'-')}}\r\n              </p>\r\n            </template>\r\n            <template v-if=\"item1.children\" :label=\"item1.label\">\r\n              <el-table-column\r\n              v-for=\"(item2,index2) in item1.children\" :prop=\"item2.prop\"\r\n              :key=\"index2\"\r\n              :width=\"item1.width\"\r\n              :min-width=\"item1.minWidth\"\r\n              :label=\"item2.label\"\r\n              align=\"center\">\r\n                <template slot-scope=\"scope\">\r\n                  <p v-if=\"item2.format\" v-tip\r\n                  :data-txt=\"item2.format(scope.row[item2.prop],scope.row)\"\r\n                  @click=\"item2.click?item2.click():null\">\r\n                    {{\r\n                      item2.format(scope.row[item2.prop],scope.row)||\r\n                      (item2.format(scope.row[item2.prop],scope.row)===0?0:item2.empty?'':'-')\r\n                    }}\r\n                  </p>\r\n                </template>\r\n              </el-table-column>\r\n            </template>\r\n          </el-table-column>\r\n        </template>\r\n        <template slot-scope=\"scope\">\r\n          <!-- 插槽 -->\r\n          <slotItem v-if=\"item.slot\" :row=\"scope.row\" :index=\"scope.$index\" :slots=\"$scopedSlots[item.slot]\"></slotItem>\r\n          <!-- 过滤方法 -->\r\n          <p v-else-if=\"item.format\" v-tip\r\n          :data-txt=\"item.format(scope.row[item.prop],scope.row)\"\r\n          @click=\"item.click?item.click():null\">\r\n            {{\r\n              item.format(scope.row[item.prop],scope.row)||\r\n              (item.format(scope.row[item.prop],scope.row)===0?0:item.empty?'':'-')\r\n            }}\r\n          </p>\r\n          <!-- 默认显示 -->\r\n          <p v-else-if=\"item.fixToolTip\" v-tip.same :data-txt=\"scope.row[item.prop]\" @click=\"item.click?item.click():null\">\r\n            {{scope.row[item.prop]||(scope.row[item.prop]===0?0:item.empty?'':'-')}}\r\n          </p>\r\n          <p v-tip v-else :data-txt=\"scope.row[item.prop]\" @click=\"item.click?item.click():null\">\r\n            {{scope.row[item.prop]||(scope.row[item.prop]===0?0:item.empty?'':'-')}}\r\n          </p>\r\n        </template>\r\n      </el-table-column>\r\n    </el-table>\r\n    <div class=\"foot\">\r\n      <!-- 手动全选及操作 -->\r\n      <el-pagination\r\n        class=\"pagination\"\r\n        background\r\n        @size-change=\"sizeChange\"\r\n        @current-change=\"currentChange\"\r\n        :current-page=\"currentPage\"\r\n        :page-sizes=\"pageset.pageSizes || [15, 30, 60, 120]\"\r\n        :page-size=\"pageset.pageSize || 15\"\r\n        :total=\"pageset.total || 0\"\r\n        layout=\"total, sizes, prev, pager, next, jumper\"\r\n      >\r\n      </el-pagination>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: \"dymic-table\",\r\n  props: {\r\n    /** 列数据*/\r\n    cols: {\r\n      type: Array,\r\n      default() {\r\n        return [];\r\n      },\r\n    },\r\n    /**table数据*/\r\n    data: {\r\n      type: Array,\r\n      default() {\r\n        return [];\r\n      },\r\n    },\r\n    /**table表格设置 */\r\n    settings: {\r\n      type: Object,\r\n      default() {\r\n        return {\r\n          // 是否显示表头\r\n          showHeader: false,\r\n          // 是否显示序号\r\n          showIndex: false,\r\n          // 是否显示多选框\r\n          showCheckbox: false,\r\n          hideAllCheckbox: false,\r\n          // 是否显示单选框\r\n          showRadio: false,\r\n          // 需要统计列的prop集合，从0开始\r\n          summaryCol: [],\r\n        };\r\n      },\r\n    },\r\n    /**分页设置*/\r\n    pageset: {\r\n      type: Object,\r\n      default() {\r\n        return {\r\n          total: 0,\r\n          pageSize: 10,\r\n          pageNum: 1,\r\n          pageSizes: [15, 30, 60, 120],\r\n        };\r\n      },\r\n    },\r\n    loading: {\r\n      type: Boolean,\r\n      default() {\r\n        return false;\r\n      }\r\n    },\r\n    height: 0,\r\n    /**数据为空的显示 */\r\n    emptyText: {\r\n      type: String,\r\n      default() {\r\n        return \"暂无相关结果\";\r\n      },\r\n    },\r\n    /**判断多选框是否可以勾选*/\r\n    selectable: {\r\n      type: Function,\r\n      default() {\r\n        return (row, index) => {\r\n          return true;\r\n        };\r\n      },\r\n    },\r\n  },\r\n  watch: {\r\n    radioSelect(n) {\r\n      this.$emit(\"radio-change\", this.data[n]);\r\n    },\r\n    pageset: {\r\n      deep: true,\r\n      handler(n) {\r\n        this.currentPage = n.pageNum;\r\n      },\r\n    },\r\n  },\r\n  components:{\r\n    slotItem:{\r\n      props:['slots','row','index'],\r\n      render(h){\r\n        let vnode = this.slots({\r\n          row:this.row,\r\n          index:this.index\r\n        })\r\n        return h('div',vnode)\r\n      }\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      currentPage: 1,\r\n    };\r\n  },\r\n  methods: {\r\n    // 多选派发事件selection-change\r\n    selectionChange(val) {\r\n      this.isSelectAll = val.length == this.data.length;\r\n      this.$emit(\"selection-change\", val);\r\n    },\r\n    currentChange(page) {\r\n      this.currentPage = page;\r\n      this.$emit(\"page-change\", {\r\n        page: page,\r\n      });\r\n    },\r\n    sizeChange(pageSize) {\r\n      this.$emit(\"page-change\", {\r\n        pageSize: pageSize,\r\n      });\r\n    },\r\n    currentChange(page) {\r\n      this.currentPage = page;\r\n      this.$emit(\"page-change\", {\r\n        page: page,\r\n      });\r\n    },\r\n    // 合计\r\n    getSummaries(params) {\r\n      let { data } = params;\r\n      if (\"{}\" != JSON.stringify(this.summaryData)) {\r\n        data = [this.summaryData];\r\n      }\r\n      let sums = [];\r\n      sums[0] = \"合计\";\r\n      let cols = JSON.parse(JSON.stringify(this.settings.summaryCol));\r\n      let i = cols.length;\r\n      while (i--) {\r\n        // 计算当前列的prop字段\r\n        let index = cols[i];\r\n        if (this.settings.showIndex) {\r\n          index -= 1;\r\n        }\r\n        if (this.settings.showCheckbox) {\r\n          index -= 1;\r\n        }\r\n        if (this.settings.showRadio) {\r\n          index -= 1;\r\n        }\r\n        let prop = this.cols[index].prop;\r\n        const values = data.map((item) => Number(item[prop]));\r\n        if (!values.every((value) => isNaN(value))) {\r\n          sums[cols[i]] = values.reduce((prev, curr) => {\r\n            const value = Number(curr);\r\n            if (!isNaN(value)) {\r\n              return prev + curr;\r\n            } else {\r\n              return prev;\r\n            }\r\n          }, 0);\r\n          sums[cols[i]];\r\n        }\r\n      }\r\n\r\n      return sums;\r\n    },\r\n    checkAllChange(val) {\r\n      if (val) {\r\n        this.$refs.table.toggleAllSelection();\r\n      } else {\r\n        this.$refs.table.clearSelection();\r\n      }\r\n    },\r\n    //自定义表头斑马线\r\n    setRowClassName({ row, rowIndex }) {\r\n      let index = rowIndex;\r\n      if (index % 2 == 0) {\r\n        return \"warning-row\";\r\n      }\r\n    },\r\n  },\r\n  created() {\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n/deep/.dymic-table .el-table .el-table__body td p{\r\n    overflow: hidden;\r\n    text-overflow: ellipsis;\r\n    white-space: nowrap;\r\n}\r\n/deep/.dymic-table .el-table--enable-row-transition .el-table__body td{\r\n  border:none;\r\n}\r\n.dymic-table .el-table {\r\n  border-radius: 6px;\r\n}\r\n/deep/ .el-table{\r\n  .el-table__header-wrapper thead tr th:nth-child(-n+2){\r\n        .cell{\r\n           width: max-content;\r\n        }\r\n        \r\n    }\r\n}\r\n</style>\r\n"]}]}