Skip to content

V
vue-gic-member-group
Commit 5ad2019a by xiaohai
Options

样式调整

parent 871b8cd2
Showing with 133 additions and 97 deletions
README.md
...@@ -30,10 +30,30 @@ Vue.use(vueGicMemberGroup) ...@@ -30,10 +30,30 @@ Vue.use(vueGicMemberGroup)
data() { data() {
return { return {
// 可传参数 // 可传参数
defaltSelected: [], // 默认穿梭窗已选入数据 defaltSelected: [{
appStatus: null,
createTime: 1543980512000,
describle: "所属服务门店",
effectiveDate: "2019-12-05 23:59:59",
effectiveDateTmp: null,
effectiveStatus: 1,
enterpriseId: "ff8080815dacd3a2015dacd3ef5c0000",
groupName: "所属服务门店",
isRealTime: 1,
latestUpdateTime: null,
latestUpdateTimeTmp: null,
memberCount: 38,
memberTagGroupId: "1b2fedcf46884c4d99c0d21565d6c149",
sortColName: "update_time",
sortType: "desc",
status: 1,
updateDay: null,
updateTime: 1544010117000,
updateType: null
}], // 默认穿梭窗已选入数据 groupName, isRealTime必传， 其他若无需求可不传
height： 200, // 穿梭窗高度， 默认是543 height： 200, // 穿梭窗高度， 默认是543
projectName： 'memberTag', // 默认是memberTag projectName： 'memberTag', // 默认是memberTag
headerList: ['isRealTime', 'latestUpdateTime', 'updateType', 'effectiveStatus', 'effectiveDate', 'handle'] // 表头配置，默认全部，分组名称默认显示不可配置 headerList: ['isRealTime', 'latestUpdateTime', 'updateType', 'effectiveStatus', 'effectiveDate'] // 表头配置，默认全部，分组名称默认显示不可配置
} }
} }
......
dist/vue-gic-member-group.js
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("vue-gic-member-group",[],t):"object"==typeof exports?exports["vue-gic-member-group"]=t():e["vue-gic-member-group"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(n){if(r[n])return r[n].exports;var a=r[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var r={};return t.m=e,t.c=r,t.d=function(e,r,n){t.o(e,r)||Object.defineProperty(e,r,{configurable:!1,enumerable:!0,get:n})},t.n=function(e){var r=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(r,"a",r),r},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/dist/",t(t.s=1)}([function(e,t,r){"use strict";t.a={name:"vue-gic-member-group",props:{defaltSelected:{type:Array,default:function(){return[]}},height:{type:Number,default:543},projectName:{type:String,default:"memberTag"},headerList:{type:Array,default:function(){return["isRealTime","latestUpdateTime","updateType","effectiveStatus","effectiveDate","handle"]}}},data:function(){return{tableData:[],pageSize:20,currentPage:1,dataSearch:"",baseUrl:"",dataSearchSelected:"",selectedData:[],selectionToTransfer:[],selectionToRemove:[],countOfCoverTotal:0,totalPage:1,loading:!1}},directives:{loadmore:{bind:function(e,t){e.querySelector(".el-table__body-wrapper").addEventListener("scroll",function(){var e=1,r=this.scrollHeight-this.scrollTop===this.clientHeight&&this.scrollTop>e;this.scrollTop>e&&(e=this.scrollTop),this.scrollTop<e&&(e=this.scrollTop),r&&t.value()})}}},methods:{loadmore:function(){this.currentPage<this.totalPage&&(this.currentPage+=1,this.getGroupList())},getGroupList:function(){console.log(this.headerList);var e=this;e.loading=!0,e.axios.get(e.baseUrl+"/gic-member-tag-web/member-tag-group/findList.json?requestProject="+e.projectName+"&pageSize="+e.pageSize+"&pageNum="+e.currentPage+"&groupName="+e.dataSearch+"&effectiveStatus=1").then(function(t){if(1==t.data.errorCode)return e.tableData=e.tableData.concat(t.data.result.result),e.totalPage=t.data.result.totalPage,void(e.loading=!1);e.loading=!1,e.$message.error({duration:1e3,message:t.data.message})}).catch(function(t){e.loading=!1,e.$message.error({duration:1e3,message:t.message})})},searchEnterFun:function(){this.tableData=[],this.getGroupList()},clearSearch:function(e){this[e]="","dataSearch"==e&&this.getGroupList()},handleSelectionChange:function(e){this.selectionToTransfer=e},selectToTransfer:function(){if(this.selectionToTransfer.length<1)return this.$message.error({duration:1e3,message:"请选择分组!"}),!1;this.selectedData=this.uniqueByGroupId(this.selectedData.concat(this.selectionToTransfer)),this.getMemberCountByGroups(),this.$emit("handleDataTransferred",this.selectedData,this.selectionToTransfer),this.$refs.originTable.clearSelection()},uniqueByGroupId:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"memberTagGroupId",r=[e[0]],n=1;n<e.length;n++)if(void 0===t)-1==r.indexOf(e[n])&&r.push(e[n]);else{e:for(var a=!1,o=0;o<r.length;o++)if(e[n][t]==r[o][t]){a=!0;break e}a||r.push(e[n])}return r},handleSelectedSelectionChange:function(e){this.selectionToRemove=e},selectToRemove:function(){if(this.selectionToRemove.length<1)return this.$message.error({duration:1e3,message:"请选择分组!"}),!1;var e=this.selectedData,t=this.selectionToRemove,r=new Set(e),n=new Set(t);this.selectedData=e.concat(t).filter(function(e){return!r.has(e)||!n.has(e)}),this.getMemberCountByGroups(),this.$emit("handleDataLeft",this.selectedData,this.selectionToRemove),this.$refs.selectedTable.clearSelection()},getMemberCountByGroups:function(){var e=this,t=e.selectedData;if(t.length<1)return e.countOfCoverTotal=0,!1;var r=[];t.forEach(function(e){r.push(e.memberTagGroupId)});var n=r.join(",");e.axios.get(e.baseUrl+"/gic-member-tag-web/member-tag-member/findMemberListByGroupIds.json?requestProject="+e.projectName+"&memberTagGroupIds="+n+"&pageName=memberSign").then(function(t){1==t.data.errorCode&&(e.countOfCoverTotal=t.data.result.page.totalCount)})}},filters:{formatTimeYMD:function(e){return e&&"- -"!=e?e.split(" ")[0]:"--"},formatTimeHMS:function(e){return e&&"- -"!=e?e.split(" ")[1]:"--"},formatNum:function(e){return(e+"").replace(/\d{1,3}(?=(\d{3})+$)/g,"$&,")},formatUpdateFrequency:function(e,t){switch(e){case 1:return"每天一次";case 2:var r=["一","二","三","四","五","六","日"];return t?"每周"+r[t-1]:"每周一次";case 3:return t?"每月"+t+"号":"每月一次";default:return"--"}}},beforeMount:function(){var e=this,t=window.location.origin;"-1"!=t.indexOf("localhost")?e.baseUrl="http://gicdev.demogic.com":e.baseUrl=t},mounted:function(){this.getGroupList(),this.defaltSelected.length>0&&(this.selectedData=this.uniqueByGroupId(this.selectedData.concat(this.defaltSelected))),this.getMemberCountByGroups()}}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=r(2),a={install:function(e,t){e.component(n.a.name,n.a)}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(a),t.default=a},function(e,t,r){"use strict";function n(e){r(3)}var a=r(0),o=r(9),i=r(8),s=n,l=i(a.a,o.a,!1,s,null,null);t.a=l.exports},function(e,t,r){var n=r(4);"string"==typeof n&&(n=[[e.i,n,""]]),n.locals&&(e.exports=n.locals);r(6)("5322ee8c",n,!0,{})},function(e,t,r){t=e.exports=r(5)(!1),t.push([e.i,".group-set-transfer{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;background:#fff;padding:30px;box-sizing:border-box}.group-set-transfer a{color:#606266}.group-set-transfer .flex-1{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.group-set-transfer .w_100{width:100%}.group-set-transfer .m-b-26{margin-block-start:26px}.group-set-transfer .input-div{padding:20px 14px}.group-set-transfer>.table-container{height:100%;border:1px solid #dcdfe6;border-radius:4px}.group-set-transfer>.table-container .cover-count{height:42px;line-height:42px;text-align:center;border:none;color:#7e8c8d;font-size:14px}.group-set-transfer>.table-container .cover-count .count{color:#606266;margin:0 5px}.group-set-transfer .btn-box{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;width:80px;text-align:center}.group-set-transfer .btn-box .icon-container .transfer-icon{display:inline-block;width:43px;height:43px;line-height:44px;border-radius:100%;text-align:center;border:1px solid #dcdfe6;color:#dcdfe6;font-size:20px;cursor:pointer}.group-set-transfer .btn-box .icon-container .transfer-icon:hover{border:none;background:#409eff;color:#fff}.group-set-transfer .selected-list{width:356px;height:100%}",""])},function(e,t){function r(e,t){var r=e[1]||"",a=e[3];if(!a)return r;if(t&&"function"==typeof btoa){var o=n(a);return[r].concat(a.sources.map(function(e){return"/*# sourceURL="+a.sourceRoot+e+" */"})).concat([o]).join("\n")}return[r].join("\n")}function n(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var n=r(t,e);return t[2]?"@media "+t[2]+"{"+n+"}":n}).join("")},t.i=function(e,r){"string"==typeof e&&(e=[[null,e,""]]);for(var n={},a=0;a<this.length;a++){var o=this[a][0];"number"==typeof o&&(n[o]=!0)}for(a=0;a<e.length;a++){var i=e[a];"number"==typeof i[0]&&n[i[0]]||(r&&!i[2]?i[2]=r:r&&(i[2]="("+i[2]+") and ("+r+")"),t.push(i))}},t}},function(e,t,r){function n(e){for(var t=0;t<e.length;t++){var r=e[t],n=u[r.id];if(n){n.refs++;for(var a=0;a<n.parts.length;a++)n.parts[a](r.parts[a]);for(;a<r.parts.length;a++)n.parts.push(o(r.parts[a]));n.parts.length>r.parts.length&&(n.parts.length=r.parts.length)}else{for(var i=[],a=0;a<r.parts.length;a++)i.push(o(r.parts[a]));u[r.id]={id:r.id,refs:1,parts:i}}}}function a(){var e=document.createElement("style");return e.type="text/css",d.appendChild(e),e}function o(e){var t,r,n=document.querySelector("style["+v+'~="'+e.id+'"]');if(n){if(h)return m;n.parentNode.removeChild(n)}if(b){var o=p++;n=f||(f=a()),t=i.bind(null,n,o,!1),r=i.bind(null,n,o,!0)}else n=a(),t=s.bind(null,n),r=function(){n.parentNode.removeChild(n)};return t(e),function(n){if(n){if(n.css===e.css&&n.media===e.media&&n.sourceMap===e.sourceMap)return;t(e=n)}else r()}}function i(e,t,r,n){var a=r?"":n.css;if(e.styleSheet)e.styleSheet.cssText=_(t,a);else{var o=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(o,i[t]):e.appendChild(o)}}function s(e,t){var r=t.css,n=t.media,a=t.sourceMap;if(n&&e.setAttribute("media",n),g.ssrId&&e.setAttribute(v,t.id),a&&(r+="\n/*# sourceURL="+a.sources[0]+" */",r+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a))))+" */"),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}var l="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!l)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var c=r(7),u={},d=l&&(document.head||document.getElementsByTagName("head")[0]),f=null,p=0,h=!1,m=function(){},g=null,v="data-vue-ssr-id",b="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,r,a){h=r,g=a||{};var o=c(e,t);return n(o),function(t){for(var r=[],a=0;a<o.length;a++){var i=o[a],s=u[i.id];s.refs--,r.push(s)}t?(o=c(e,t),n(o)):o=[];for(var a=0;a<r.length;a++){var s=r[a];if(0===s.refs){for(var l=0;l<s.parts.length;l++)s.parts[l]();delete u[s.id]}}}};var _=function(){var e=[];return function(t,r){return e[t]=r,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var r=[],n={},a=0;a<t.length;a++){var o=t[a],i=o[0],s=o[1],l=o[2],c=o[3],u={id:e+":"+a,css:s,media:l,sourceMap:c};n[i]?n[i].parts.push(u):r.push(n[i]={id:i,parts:[u]})}return r}},function(e,t){e.exports=function(e,t,r,n,a,o){var i,s=e=e||{},l=typeof e.default;"object"!==l&&"function"!==l||(i=e,s=e.default);var c="function"==typeof s?s.options:s;t&&(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0),r&&(c.functional=!0),a&&(c._scopeId=a);var u;if(o?(u=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},c._ssrRegister=u):n&&(u=n),u){var d=c.functional,f=d?c.render:c.beforeCreate;d?(c._injectStyles=u,c.render=function(e,t){return u.call(t),f(e,t)}):c.beforeCreate=f?[].concat(f,u):[u]}return{esModule:i,exports:s,options:c}}},function(e,t,r){"use strict";var n=function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("div",{staticClass:"group-set-transfer"},[r("div",{staticClass:"flex-1 table-container"},[r("div",{staticClass:"input-div"},[r("el-input",{staticClass:"w_100",attrs:{placeholder:"请输入关键字搜索人群","prefix-icon":"el-icon-search",clearable:""},on:{clear:function(t){e.clearSearch("dataSearch")}},nativeOn:{keyup:function(t){return"button"in t||!e._k(t.keyCode,"enter",13,t.key,"Enter")?e.searchEnterFun(t):null}},model:{value:e.dataSearch,callback:function(t){e.dataSearch=t},expression:"dataSearch"}})],1),e._v(" "),r("el-table",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"},{name:"loadmore",rawName:"v-loadmore",value:e.loadmore,expression:"loadmore"}],ref:"originTable",attrs:{data:e.tableData,"tooltip-effect":"dark",height:e.height-72},on:{"selection-change":e.handleSelectionChange}},[r("el-table-column",{attrs:{type:"selection",width:"55"}}),e._v(" "),r("el-table-column",{attrs:{label:"分组名称","min-width":"170","show-overflow-tooltip":""},scopedSlots:e._u([{key:"default",fn:function(t){return[r("el-popover",{attrs:{placement:"top-start",trigger:"hover"}},[r("span",[e._v(e._s(t.row.describle))]),e._v(" "),r("a",{staticClass:"pointer",attrs:{slot:"reference",href:"#/memberGroupDetail?memberTagGroupId="+t.row.memberTagGroupId},slot:"reference"},[e._v(e._s(t.row.groupName))])])]}}])}),e._v(" "),e.headerList.indexOf("isRealTime")>-1?r("el-table-column",{attrs:{label:"是否实时","min-width":"80px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.isRealTime?"实时":"非实时")+"\n ")]}}])}):e._e(),e._v(" "),e.headerList.indexOf("latestUpdateTime")>-1?r("el-table-column",{attrs:{label:"最近更新时间","min-width":"120px","show-overflow-tooltip":""},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(e._f("formatTimeYMD")(t.row.latestUpdateTime))+"\n "),r("p",[e._v(e._s(e._f("formatTimeHMS")(t.row.latestUpdateTime)))])]}}])}):e._e(),e._v(" "),e.headerList.indexOf("updateType")>-1?r("el-table-column",{attrs:{label:"更新频率","min-width":"100px","show-overflow-tooltip":""},scopedSlots:e._u([{key:"default",fn:function(t){return[0==t.row.isRealTime?[e._v("\n "+e._s(e._f("formatUpdateFrequency")(t.row.updateType,t.row.updateDay))+"\n ")]:[e._v("\n --\n ")]]}}])}):e._e(),e._v(" "),e.headerList.indexOf("effectiveStatus")>-1?r("el-table-column",{attrs:{prop:"state",label:"状态","min-width":"60px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.effectiveStatus?"有效":"失效")+"\n ")]}}])}):e._e(),e._v(" "),e.headerList.indexOf("effectiveDate")>-1?r("el-table-column",{attrs:{prop:"recentUpdateDate",label:"到期时间","min-width":"100px","show-overflow-tooltip":""},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(e._f("formatTimeYMD")(t.row.effectiveDate))+"\n "),r("p",[e._v(e._s(e._f("formatTimeHMS")(t.row.effectiveDate)))])]}}])}):e._e(),e._v(" "),e.headerList.indexOf("handle")>-1?r("el-table-column",{attrs:{"min-width":"60px",label:"操作"},scopedSlots:e._u([{key:"default",fn:function(t){return[r("router-link",{staticClass:"edit-btn el-button--text",attrs:{to:{path:"/memberGroupDetail",query:{memberTagGroupId:t.row.memberTagGroupId}}}},[e._v("详情")])]}}])}):e._e()],1)],1),e._v(" "),r("div",{staticClass:"btn-box",style:"height:"+e.height+"px"},[r("div",{staticClass:"icon-container"},[r("span",{staticClass:"transfer-icon el-icon-arrow-right m-b-26",on:{click:e.selectToTransfer}}),e._v(" "),r("span",{staticClass:"transfer-icon el-icon-arrow-left",on:{click:e.selectToRemove}})])]),e._v(" "),r("div",{staticClass:"selected-list table-container"},[r("div",{staticClass:"input-div"},[r("el-input",{staticClass:"w_100",attrs:{placeholder:"请输入关键字搜索人群","prefix-icon":"el-icon-search",clearable:""},on:{clear:function(t){e.clearSearch("dataSearchSelected")}},model:{value:e.dataSearchSelected,callback:function(t){e.dataSearchSelected=t},expression:"dataSearchSelected"}})],1),e._v(" "),r("el-table",{ref:"selectedTable",attrs:{data:e.selectedData.filter(function(t){return!e.dataSearchSelected||t.groupName.toLowerCase().includes(e.dataSearchSelected.toLowerCase())}),"tooltip-effect":"dark",height:e.height-114},on:{"selection-change":e.handleSelectedSelectionChange}},[r("el-table-column",{attrs:{type:"selection",width:"55"}}),e._v(" "),r("el-table-column",{attrs:{label:"分组名称","show-overflow-tooltip":""},scopedSlots:e._u([{key:"default",fn:function(t){return[r("el-popover",{attrs:{placement:"top-start",trigger:"hover"}},[r("span",[e._v(e._s(t.row.describle))]),e._v(" "),r("a",{staticClass:"pointer",attrs:{slot:"reference",href:"/memberGroupDetail?memberTagGroupId="+t.row.memberTagGroupId},slot:"reference"},[e._v(e._s(t.row.groupName))])])]}}])}),e._v(" "),r("el-table-column",{attrs:{label:"是否实时",width:"116px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.isRealTime?"实时":"非实时")+"\n ")]}}])})],1),e._v(" "),r("p",{staticClass:"cover-count"},[e._v("已选中"),r("span",{staticClass:"count"},[e._v(e._s(e.countOfCoverTotal))]),e._v("人")])],1)])},a=[],o={render:n,staticRenderFns:a};t.a=o}])}); !function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("vue-gic-member-group",[],t):"object"==typeof exports?exports["vue-gic-member-group"]=t():e["vue-gic-member-group"]=t()}("undefined"!=typeof self?self:this,function(){return function(e){function t(r){if(n[r])return n[r].exports;var a=n[r]={i:r,l:!1,exports:{}};return e[r].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var n={};return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="/dist/",t(t.s=1)}([function(e,t,n){"use strict";t.a={name:"vue-gic-member-group",props:{defaltSelected:{type:Array,default:function(){return[]}},height:{type:Number,default:543},projectName:{type:String,default:"memberTag"},headerList:{type:Array,default:function(){return["isRealTime","latestUpdateTime","updateType","effectiveStatus","effectiveDate"]}}},data:function(){return{tableData:[],pageSize:20,currentPage:1,dataSearch:"",baseUrl:"",dataSearchSelected:"",selectedData:[],staticSelectedData:[],selectionToTransfer:[],selectionToRemove:[],canClick:!1,countOfCoverTotal:0,totalPage:1,loading:!1}},directives:{loadmore:{bind:function(e,t){e.querySelector(".el-table__body-wrapper").addEventListener("scroll",function(){var e=1,n=this.scrollHeight-this.scrollTop===this.clientHeight&&this.scrollTop>e;this.scrollTop>e&&(e=this.scrollTop),this.scrollTop<e&&(e=this.scrollTop),n&&t.value()})}}},methods:{loadmore:function(){this.currentPage<this.totalPage&&(this.currentPage+=1,this.getGroupList())},selectRow:function(e,t,n){this.$refs.originTable.toggleRowSelection(e)},selectRowToMove:function(e,t,n){this.$refs.selectedTable.toggleRowSelection(e)},getGroupList:function(){var e=this;e.loading=!0,e.axios.get(e.baseUrl+"/gic-member-tag-web/member-tag-group/findList.json?requestProject="+e.projectName+"&pageSize="+e.pageSize+"&pageNum="+e.currentPage+"&groupName="+e.dataSearch+"&effectiveStatus=1").then(function(t){if(1==t.data.errorCode)return e.tableData=e.tableData.concat(t.data.result.result),e.totalPage=t.data.result.totalPage,void(e.loading=!1);e.loading=!1,e.$message.error({duration:1e3,message:t.data.message})}).catch(function(t){e.loading=!1,e.$message.error({duration:1e3,message:t.message})})},searchEnterFun:function(){this.tableData=[],this.getGroupList()},clearSearch:function(e){this[e]="","dataSearch"==e&&this.getGroupList()},handleSelectionChange:function(e){this.selectionToTransfer=e},selectToTransfer:function(){this.selectedData=this.uniqueByGroupId(this.selectedData.concat(this.selectionToTransfer)),this.staticSelectedData=[].concat(JSON.parse(JSON.stringify(this.selectedData))),this.getMemberCountByGroups(),this.$emit("handleDataTransferred",this.selectedData,this.selectionToTransfer),this.$refs.originTable.clearSelection()},uniqueByGroupId:function(e){for(var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"memberTagGroupId",n=[e[0]],r=1;r<e.length;r++)if(void 0===t)-1==n.indexOf(e[r])&&n.push(e[r]);else{e:for(var a=!1,o=0;o<n.length;o++)if(e[r][t]==n[o][t]){a=!0;break e}a||n.push(e[r])}return n},handleSelectedSelectionChange:function(e){this.selectionToRemove=[],this.selectionToRemove=e},selectToRemove:function(){var e=this,t=e.selectedData,n=e.selectionToRemove,r=(e.staticSelectedData,new Set(t)),a=new Set(n);e.selectedData=t.concat(n).filter(function(e){return!r.has(e)||!a.has(e)}),e.staticSelectedData.forEach(function(t,r){n.forEach(function(n){n.memberTagGroupId==t.memberTagGroupId&&e.staticSelectedData.splice(r,1)})}),e.searchSelectedByKey(e.dataSearchSelected),e.getMemberCountByGroups(),e.$emit("handleDataLeft",e.selectedData,e.selectionToRemove),e.$refs.selectedTable.clearSelection()},getMemberCountByGroups:function(){var e=this,t=e.selectedData;if(t.length<1)return e.countOfCoverTotal=0,!1;var n=[];t.forEach(function(e){n.push(e.memberTagGroupId)});var r=n.join(",");e.axios.get(e.baseUrl+"/gic-member-tag-web/member-tag-member/findMemberListByGroupIds.json?requestProject="+e.projectName+"&memberTagGroupIds="+r+"&pageName=memberSign").then(function(t){1==t.data.errorCode&&(e.countOfCoverTotal=t.data.result.page.totalCount)})},searchSelectedByKey:function(e){var t=[];this.staticSelectedData.forEach(function(n){n.groupName.toLowerCase().includes(e.toLowerCase())&&t.push(n)}),this.selectedData=t}},filters:{formatTimeYMD:function(e){return e&&"- -"!=e?e.split(" ")[0]:"--"},formatTimeHMS:function(e){return e&&"- -"!=e?e.split(" ")[1]:"--"},formatNum:function(e){return(e+"").replace(/\d{1,3}(?=(\d{3})+$)/g,"$&,")},formatUpdateFrequency:function(e,t){switch(e){case 1:return"每天一次";case 2:var n=["一","二","三","四","五","六","日"];return t?"每周"+n[t-1]:"每周一次";case 3:return t?"每月"+t+"号":"每月一次";default:return"--"}}},beforeMount:function(){var e=this,t=window.location.origin;"-1"!=t.indexOf("localhost")?e.baseUrl="http://gicdev.demogic.com":e.baseUrl=t},mounted:function(){this.getGroupList(),this.defaltSelected.length>0&&(this.selectedData=this.uniqueByGroupId(this.selectedData.concat(this.defaltSelected))),this.getMemberCountByGroups()},watch:{dataSearchSelected:function(e,t){this.searchSelectedByKey(e)}}}},function(e,t,n){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var r=n(2),a={install:function(e,t){e.component(r.a.name,r.a)}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(a),t.default=a},function(e,t,n){"use strict";function r(e){n(3)}var a=n(0),o=n(9),i=n(8),s=r,c=i(a.a,o.a,!1,s,null,null);t.a=c.exports},function(e,t,n){var r=n(4);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);n(6)("3fa644cd",r,!0,{})},function(e,t,n){t=e.exports=n(5)(!1),t.push([e.i,".group-set-transfer{display:flex;width:100%;min-width:712px;background:#fff;padding:10px 30px 20px;box-sizing:border-box}.group-set-transfer a{color:#606266}.group-set-transfer .flex-1{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.group-set-transfer .w_100{width:100%}.group-set-transfer .m-b-26{margin-bottom:26px}.group-set-transfer .input-div{padding:20px 14px}.group-set-transfer>.table-container{height:100%;border:1px solid #dcdfe6;border-radius:4px}.group-set-transfer>.table-container.select-list{min-width:230px}.group-set-transfer>.table-container .el-table tr{cursor:pointer}.group-set-transfer>.table-container .el-table tr .h-18{height:18px;line-height:18px}.group-set-transfer>.table-container .cover-count{height:42px;line-height:42px;text-align:center;border:none;color:#7e8c8d;font-size:14px}.group-set-transfer>.table-container .cover-count .count{color:#606266;margin:0 5px}.group-set-transfer .btn-box{width:62px;position:relative}.group-set-transfer .btn-box .icon-container{height:120px;position:absolute;top:50%;margin-top:-60px;width:100%;padding:13px;box-sizing:border-box}.group-set-transfer .btn-box .icon-container .transfer-icon{color:#fff;margin-left:0;margin-right:0}.group-set-transfer .btn-box .el-button.is-disabled{color:#dcdfe6}.group-set-transfer .selected-list{width:356px;height:100%}",""])},function(e,t){function n(e,t){var n=e[1]||"",a=e[3];if(!a)return n;if(t&&"function"==typeof btoa){var o=r(a);return[n].concat(a.sources.map(function(e){return"/*# sourceURL="+a.sourceRoot+e+" */"})).concat([o]).join("\n")}return[n].join("\n")}function r(e){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(e))))+" */"}e.exports=function(e){var t=[];return t.toString=function(){return this.map(function(t){var r=n(t,e);return t[2]?"@media "+t[2]+"{"+r+"}":r}).join("")},t.i=function(e,n){"string"==typeof e&&(e=[[null,e,""]]);for(var r={},a=0;a<this.length;a++){var o=this[a][0];"number"==typeof o&&(r[o]=!0)}for(a=0;a<e.length;a++){var i=e[a];"number"==typeof i[0]&&r[i[0]]||(n&&!i[2]?i[2]=n:n&&(i[2]="("+i[2]+") and ("+n+")"),t.push(i))}},t}},function(e,t,n){function r(e){for(var t=0;t<e.length;t++){var n=e[t],r=u[n.id];if(r){r.refs++;for(var a=0;a<r.parts.length;a++)r.parts[a](n.parts[a]);for(;a<n.parts.length;a++)r.parts.push(o(n.parts[a]));r.parts.length>n.parts.length&&(r.parts.length=n.parts.length)}else{for(var i=[],a=0;a<n.parts.length;a++)i.push(o(n.parts[a]));u[n.id]={id:n.id,refs:1,parts:i}}}}function a(){var e=document.createElement("style");return e.type="text/css",d.appendChild(e),e}function o(e){var t,n,r=document.querySelector("style["+v+'~="'+e.id+'"]');if(r){if(h)return g;r.parentNode.removeChild(r)}if(b){var o=p++;r=f||(f=a()),t=i.bind(null,r,o,!1),n=i.bind(null,r,o,!0)}else r=a(),t=s.bind(null,r),n=function(){r.parentNode.removeChild(r)};return t(e),function(r){if(r){if(r.css===e.css&&r.media===e.media&&r.sourceMap===e.sourceMap)return;t(e=r)}else n()}}function i(e,t,n,r){var a=n?"":r.css;if(e.styleSheet)e.styleSheet.cssText=x(t,a);else{var o=document.createTextNode(a),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(o,i[t]):e.appendChild(o)}}function s(e,t){var n=t.css,r=t.media,a=t.sourceMap;if(r&&e.setAttribute("media",r),m.ssrId&&e.setAttribute(v,t.id),a&&(n+="\n/*# sourceURL="+a.sources[0]+" */",n+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(a))))+" */"),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var c="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!c)throw new Error("vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.");var l=n(7),u={},d=c&&(document.head||document.getElementsByTagName("head")[0]),f=null,p=0,h=!1,g=function(){},m=null,v="data-vue-ssr-id",b="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,n,a){h=n,m=a||{};var o=l(e,t);return r(o),function(t){for(var n=[],a=0;a<o.length;a++){var i=o[a],s=u[i.id];s.refs--,n.push(s)}t?(o=l(e,t),r(o)):o=[];for(var a=0;a<n.length;a++){var s=n[a];if(0===s.refs){for(var c=0;c<s.parts.length;c++)s.parts[c]();delete u[s.id]}}}};var x=function(){var e=[];return function(t,n){return e[t]=n,e.filter(Boolean).join("\n")}}()},function(e,t){e.exports=function(e,t){for(var n=[],r={},a=0;a<t.length;a++){var o=t[a],i=o[0],s=o[1],c=o[2],l=o[3],u={id:e+":"+a,css:s,media:c,sourceMap:l};r[i]?r[i].parts.push(u):n.push(r[i]={id:i,parts:[u]})}return n}},function(e,t){e.exports=function(e,t,n,r,a,o){var i,s=e=e||{},c=typeof e.default;"object"!==c&&"function"!==c||(i=e,s=e.default);var l="function"==typeof s?s.options:s;t&&(l.render=t.render,l.staticRenderFns=t.staticRenderFns,l._compiled=!0),n&&(l.functional=!0),a&&(l._scopeId=a);var u;if(o?(u=function(e){e=e||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,e||"undefined"==typeof __VUE_SSR_CONTEXT__||(e=__VUE_SSR_CONTEXT__),r&&r.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},l._ssrRegister=u):r&&(u=r),u){var d=l.functional,f=d?l.render:l.beforeCreate;d?(l._injectStyles=u,l.render=function(e,t){return u.call(t),f(e,t)}):l.beforeCreate=f?[].concat(f,u):[u]}return{esModule:i,exports:s,options:l}}},function(e,t,n){"use strict";var r=function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"group-set-transfer"},[n("div",{staticClass:"flex-1 table-container select-list"},[n("div",{staticClass:"input-div"},[n("el-input",{staticClass:"w_100",attrs:{placeholder:"请输入关键字搜索人群","prefix-icon":"el-icon-search",clearable:""},on:{clear:function(t){e.clearSearch("dataSearch")}},nativeOn:{keyup:function(t){return"button"in t||!e._k(t.keyCode,"enter",13,t.key,"Enter")?e.searchEnterFun(t):null}},model:{value:e.dataSearch,callback:function(t){e.dataSearch=t},expression:"dataSearch"}})],1),e._v(" "),n("el-table",{directives:[{name:"loading",rawName:"v-loading",value:e.loading,expression:"loading"},{name:"loadmore",rawName:"v-loadmore",value:e.loadmore,expression:"loadmore"}],ref:"originTable",attrs:{data:e.tableData,"tooltip-effect":"dark",height:e.height-72},on:{"row-click":e.selectRow,"selection-change":e.handleSelectionChange}},[n("el-table-column",{attrs:{type:"selection",width:"55"}}),e._v(" "),n("el-table-column",{attrs:{label:"分组名称","min-width":"170",prop:"groupName"}}),e._v(" "),e.headerList.indexOf("isRealTime")>-1?n("el-table-column",{attrs:{label:"是否实时","min-width":"80px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.isRealTime?"实时":"非实时")+"\n ")]}}])}):e._e(),e._v(" "),e.headerList.indexOf("latestUpdateTime")>-1?n("el-table-column",{attrs:{label:"最近更新时间","min-width":"120px"},scopedSlots:e._u([{key:"default",fn:function(t){return[n("p",{staticClass:"h-18"},[e._v(e._s(e._f("formatTimeYMD")(t.row.latestUpdateTime)))]),e._v(" "),n("p",{staticClass:"h-18"},[e._v(e._s(e._f("formatTimeHMS")(t.row.latestUpdateTime)))])]}}])}):e._e(),e._v(" "),e.headerList.indexOf("updateType")>-1?n("el-table-column",{attrs:{label:"更新频率","min-width":"100px"},scopedSlots:e._u([{key:"default",fn:function(t){return[0==t.row.isRealTime?[e._v("\n "+e._s(e._f("formatUpdateFrequency")(t.row.updateType,t.row.updateDay))+"\n ")]:[e._v("\n --\n ")]]}}])}):e._e(),e._v(" "),e.headerList.indexOf("effectiveStatus")>-1?n("el-table-column",{attrs:{prop:"state",label:"状态","min-width":"60px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.effectiveStatus?"有效":"失效")+"\n ")]}}])}):e._e(),e._v(" "),e.headerList.indexOf("effectiveDate")>-1?n("el-table-column",{attrs:{prop:"recentUpdateDate",label:"到期时间","min-width":"100px"},scopedSlots:e._u([{key:"default",fn:function(t){return[n("p",{staticClass:"h-18"},[e._v(e._s(e._f("formatTimeYMD")(t.row.effectiveDate)))]),e._v(" "),n("p",{staticClass:"h-18"},[e._v(e._s(e._f("formatTimeHMS")(t.row.effectiveDate)))])]}}])}):e._e()],1)],1),e._v(" "),n("div",{staticClass:"btn-box",style:"height:"+e.height+"px"},[n("div",{staticClass:"icon-container"},[n("el-button",{staticClass:"transfer-icon m-b-26",attrs:{size:"mini",type:e.selectionToTransfer.length>0?"primary":"",disabled:e.selectionToTransfer.length<1,icon:"el-icon-arrow-right",circle:""},on:{click:e.selectToTransfer}}),e._v(" "),n("el-button",{staticClass:"transfer-icon",attrs:{size:"mini",type:e.selectionToRemove.length>0?"primary":"",disabled:e.selectionToRemove.length<1,icon:"el-icon-close",circle:""},on:{click:e.selectToRemove}})],1)]),e._v(" "),n("div",{staticClass:"selected-list table-container"},[n("div",{staticClass:"input-div"},[n("el-input",{staticClass:"w_100",attrs:{placeholder:"请输入关键字搜索人群","prefix-icon":"el-icon-search",clearable:""},on:{clear:function(t){e.clearSearch("dataSearchSelected")}},model:{value:e.dataSearchSelected,callback:function(t){e.dataSearchSelected=t},expression:"dataSearchSelected"}})],1),e._v(" "),n("el-table",{ref:"selectedTable",attrs:{data:e.selectedData,height:e.height-114},on:{"row-click":e.selectRowToMove,"selection-change":e.handleSelectedSelectionChange}},[n("el-table-column",{attrs:{type:"selection",width:"55"}}),e._v(" "),n("el-table-column",{attrs:{label:"分组名称",prop:"groupName"}}),e._v(" "),n("el-table-column",{attrs:{label:"是否实时",width:"116px"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v("\n "+e._s(1==t.row.isRealTime?"实时":"非实时")+"\n ")]}}])})],1),e._v(" "),n("p",{staticClass:"cover-count"},[e._v("已选中"),n("span",{staticClass:"count"},[e._v(e._s(e.countOfCoverTotal))]),e._v("人")])],1)])},a=[],o={render:r,staticRenderFns:a};t.a=o}])});
//# sourceMappingURL=vue-gic-member-group.js.map //# sourceMappingURL=vue-gic-member-group.js.map
\ No newline at end of file
dist/vue-gic-member-group.js.map
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
{ {
"name": "@gic-test/vue-gic-member-group", "name": "@gic-test/vue-gic-member-group",
"description": "vue-gic-member-group Plugin", "description": "vue-gic-member-group Plugin",
"version": "1.0.28", "version": "1.0.33",
"license": "MIT", "license": "MIT",
"private": false, "private": false,
"author": "fairyly", "author": "fairyly",
......
src/lib/vue-gic-member-group.vue
<template> <template>
<div class="group-set-transfer"> <div class="group-set-transfer">
<div class="flex-1 table-container"> <div class="flex-1 table-container select-list">
<div class="input-div"> <div class="input-div">
<el-input <el-input
class="w_100" class="w_100"
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
</el-input> </el-input>
</div> </div>
<el-table <el-table
@row-click="selectRow"
v-loading="loading" v-loading="loading"
v-loadmore="loadmore" v-loadmore="loadmore"
ref="originTable" ref="originTable"
...@@ -27,15 +28,7 @@ ...@@ -27,15 +28,7 @@
<el-table-column <el-table-column
label="分组名称" label="分组名称"
min-width="170" min-width="170"
show-overflow-tooltip> prop="groupName">
<template slot-scope="scope">
<el-popover
placement="top-start"
trigger="hover">
<span>{{ scope.row.describle }}</span>
<a slot="reference" class="pointer" :href="'#/memberGroupDetail?memberTagGroupId='+scope.row.memberTagGroupId">{{ scope.row.groupName }}</a>
</el-popover>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
v-if="headerList.indexOf('isRealTime') > -1" v-if="headerList.indexOf('isRealTime') > -1"
...@@ -48,18 +41,16 @@ ...@@ -48,18 +41,16 @@
<el-table-column <el-table-column
v-if="headerList.indexOf('latestUpdateTime') > -1" v-if="headerList.indexOf('latestUpdateTime') > -1"
label="最近更新时间" label="最近更新时间"
min-width="120px" min-width="120px">
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
{{ scope.row.latestUpdateTime | formatTimeYMD }} <p class="h-18">{{ scope.row.latestUpdateTime | formatTimeYMD }}</p>
<p>{{ scope.row.latestUpdateTime | formatTimeHMS }}</p> <p class="h-18">{{ scope.row.latestUpdateTime | formatTimeHMS }}</p>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
v-if="headerList.indexOf('updateType') > -1" v-if="headerList.indexOf('updateType') > -1"
label="更新频率" label="更新频率"
min-width="100px" min-width="100px">
show-overflow-tooltip>
<template slot-scope="scope"> <template slot-scope="scope">
<template v-if="scope.row.isRealTime == 0"> <template v-if="scope.row.isRealTime == 0">
{{scope.row.updateType, scope.row.updateDay | formatUpdateFrequency}} {{scope.row.updateType, scope.row.updateDay | formatUpdateFrequency}}
...@@ -82,27 +73,34 @@ ...@@ -82,27 +73,34 @@
v-if="headerList.indexOf('effectiveDate') > -1" v-if="headerList.indexOf('effectiveDate') > -1"
prop="recentUpdateDate" prop="recentUpdateDate"
label="到期时间" label="到期时间"
min-width="100px" min-width="100px">
show-overflow-tooltip>
<template slot-scope="scope">
{{ scope.row.effectiveDate | formatTimeYMD }}
<p>{{ scope.row.effectiveDate | formatTimeHMS }}</p>
</template>
</el-table-column>
<el-table-column
v-if="headerList.indexOf('handle') > -1"
min-width="60px"
label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<router-link :to="{path:'/memberGroupDetail',query:{memberTagGroupId:scope.row.memberTagGroupId}}" class="edit-btn el-button--text">详情</router-link> <p class="h-18">{{ scope.row.effectiveDate | formatTimeYMD }}</p>
<p class="h-18">{{ scope.row.effectiveDate | formatTimeHMS }}</p>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<div class="btn-box" :style="'height:'+height+'px'"> <div class="btn-box" :style="'height:'+height+'px'">
<div class="icon-container"> <div class="icon-container">
<span class="transfer-icon el-icon-arrow-right m-b-26" @click="selectToTransfer"></span> <el-button
<span class="transfer-icon el-icon-arrow-left" @click="selectToRemove"></span> class="transfer-icon m-b-26"
size="mini"
:type="selectionToTransfer.length > 0 ? 'primary' : ''"
:disabled="selectionToTransfer.length < 1"
icon="el-icon-arrow-right"
@click="selectToTransfer"
circle>
</el-button>
<el-button
class="transfer-icon"
size="mini"
:type="selectionToRemove.length > 0 ? 'primary' : ''"
:disabled="selectionToRemove.length < 1"
icon="el-icon-close"
@click="selectToRemove"
circle>
</el-button>
</div> </div>
</div> </div>
<div class="selected-list table-container"> <div class="selected-list table-container">
...@@ -118,8 +116,8 @@ ...@@ -118,8 +116,8 @@
</div> </div>
<el-table <el-table
ref="selectedTable" ref="selectedTable"
:data="selectedData.filter(data => !dataSearchSelected || data.groupName.toLowerCase().includes(dataSearchSelected.toLowerCase()))" @row-click="selectRowToMove"
tooltip-effect="dark" :data="selectedData"
@selection-change="handleSelectedSelectionChange" @selection-change="handleSelectedSelectionChange"
:height="height - 114"> :height="height - 114">
<el-table-column <el-table-column
...@@ -128,15 +126,7 @@ ...@@ -128,15 +126,7 @@
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="分组名称" label="分组名称"
show-overflow-tooltip> prop="groupName">
<template slot-scope="scope">
<el-popover
placement="top-start"
trigger="hover">
<span>{{ scope.row.describle }}</span>
<a slot="reference" class="pointer" :href="'/memberGroupDetail?memberTagGroupId='+scope.row.memberTagGroupId">{{ scope.row.groupName }}</a>
</el-popover>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="是否实时" label="是否实时"
...@@ -171,7 +161,7 @@ ...@@ -171,7 +161,7 @@
headerList: { headerList: {
type: Array, type: Array,
default() { default() {
return ['isRealTime', 'latestUpdateTime', 'updateType', 'effectiveStatus', 'effectiveDate', 'handle']; return ['isRealTime', 'latestUpdateTime', 'updateType', 'effectiveStatus', 'effectiveDate'];
} }
} }
}, },
...@@ -184,8 +174,10 @@ ...@@ -184,8 +174,10 @@
baseUrl: "", baseUrl: "",
dataSearchSelected: "", dataSearchSelected: "",
selectedData: [], // 穿梭窗已选入数据 selectedData: [], // 穿梭窗已选入数据
staticSelectedData: [],
selectionToTransfer: [], // 穿梭窗选入数据 selectionToTransfer: [], // 穿梭窗选入数据
selectionToRemove: [], // 已选的将要删除的选入数据 selectionToRemove: [], // 已选的将要删除的选入数据
canClick: false,
countOfCoverTotal: 0, countOfCoverTotal: 0,
totalPage: 1, totalPage: 1,
loading: false loading: false
...@@ -203,6 +195,7 @@ ...@@ -203,6 +195,7 @@
* clientHeight 读取元素的可见高度(只读) * clientHeight 读取元素的可见高度(只读)
* 如果元素滚动到底, 下面等式返回true, 没有则返回false: * 如果元素滚动到底, 下面等式返回true, 没有则返回false:
* ele.scrollHeight - ele.scrollTop === ele.clientHeight; * ele.scrollHeight - ele.scrollTop === ele.clientHeight;
*
*/ */
let sign = 1; // 定义默认的向上滚于乡下滚的边界 let sign = 1; // 定义默认的向上滚于乡下滚的边界
const CONDITION = ((this.scrollHeight - this.scrollTop === this.clientHeight) && const CONDITION = ((this.scrollHeight - this.scrollTop === this.clientHeight) &&
...@@ -210,11 +203,9 @@ ...@@ -210,11 +203,9 @@
if(this.scrollTop > sign) { if(this.scrollTop > sign) {
sign = this.scrollTop; sign = this.scrollTop;
// console.log('向下')
} }
if(this.scrollTop < sign) { if(this.scrollTop < sign) {
sign = this.scrollTop; sign = this.scrollTop;
// console.log('向上')
} }
if(CONDITION) { if(CONDITION) {
...@@ -225,19 +216,30 @@ ...@@ -225,19 +216,30 @@
} }
}, },
methods: { methods: {
/**
* 拉到底部加载更多
*/
loadmore() { loadmore() {
// console.log('loadmore');
if (this.currentPage < this.totalPage) { if (this.currentPage < this.totalPage) {
this.currentPage += 1; this.currentPage += 1;
this.getGroupList(); this.getGroupList();
} }
}, },
/**
* 点击整行勾引
*/
selectRow(row, event, column) {
this.$refs.originTable.toggleRowSelection(row);
},
selectRowToMove(row, event, column) {
this.$refs.selectedTable.toggleRowSelection(row);
},
/** /**
* 获取分组列表数据 * 获取分组列表数据
*/ */
getGroupList() { getGroupList() {
console.log(this.headerList);
const that = this; const that = this;
that.loading = true; that.loading = true;
that.axios.get(`${that.baseUrl}/gic-member-tag-web/member-tag-group/findList.json?requestProject=${that.projectName}&pageSize=${that.pageSize}&pageNum=${that.currentPage}&groupName=${that.dataSearch}&effectiveStatus=${1}`) that.axios.get(`${that.baseUrl}/gic-member-tag-web/member-tag-group/findList.json?requestProject=${that.projectName}&pageSize=${that.pageSize}&pageNum=${that.currentPage}&groupName=${that.dataSearch}&effectiveStatus=${1}`)
...@@ -286,14 +288,8 @@ ...@@ -286,14 +288,8 @@
}, },
selectToTransfer() { selectToTransfer() {
if (this.selectionToTransfer.length < 1) {
this.$message.error({
duration: 1000,
message: '请选择分组!'
});
return false;
}
this.selectedData = this.uniqueByGroupId(this.selectedData.concat(this.selectionToTransfer)); // 数组拼接并去重 this.selectedData = this.uniqueByGroupId(this.selectedData.concat(this.selectionToTransfer)); // 数组拼接并去重
this.staticSelectedData = [].concat(JSON.parse(JSON.stringify(this.selectedData)));
this.getMemberCountByGroups(); this.getMemberCountByGroups();
this.$emit('handleDataTransferred', this.selectedData, this.selectionToTransfer); this.$emit('handleDataTransferred', this.selectedData, this.selectionToTransfer);
this.$refs.originTable.clearSelection(); this.$refs.originTable.clearSelection();
...@@ -330,25 +326,29 @@ ...@@ -330,25 +326,29 @@
* 处理已选的将要删除的选入数据 * 处理已选的将要删除的选入数据
*/ */
handleSelectedSelectionChange(val) { handleSelectedSelectionChange(val) {
this.selectionToRemove = [];
this.selectionToRemove = val; this.selectionToRemove = val;
}, },
selectToRemove() { selectToRemove() {
if (this.selectionToRemove.length < 1) { let that = this;
this.$message.error({ let seleced = that.selectedData;
duration: 1000, let setection = that.selectionToRemove;
message: '请选择分组!' let staticSelected = that.staticSelectedData;
});
return false;
}
let seleced = this.selectedData;
let setection = this.selectionToRemove;
let aSet = new Set(seleced); let aSet = new Set(seleced);
let bSet = new Set(setection); let bSet = new Set(setection);
this.selectedData = seleced.concat(setection).filter(v => !aSet.has(v) || !bSet.has(v)); // 两数组非交集部分即为剔除后剩下的数据 that.selectedData = seleced.concat(setection).filter(v => !aSet.has(v) || !bSet.has(v)); // 两数组非交集部分即为剔除后剩下的数据
this.getMemberCountByGroups(); that.staticSelectedData.forEach((father, idx) => {
this.$emit('handleDataLeft', this.selectedData, this.selectionToRemove); setection.forEach(son => {
this.$refs.selectedTable.clearSelection(); if (son.memberTagGroupId == father.memberTagGroupId) {
that.staticSelectedData.splice(idx, 1);
}
});
});
that.searchSelectedByKey(that.dataSearchSelected);
that.getMemberCountByGroups();
that.$emit('handleDataLeft', that.selectedData, that.selectionToRemove);
that.$refs.selectedTable.clearSelection();
}, },
/** /**
...@@ -368,11 +368,20 @@ ...@@ -368,11 +368,20 @@
let ids = idsArr.join(','); let ids = idsArr.join(',');
that.axios.get(`${that.baseUrl}/gic-member-tag-web/member-tag-member/findMemberListByGroupIds.json?requestProject=${that.projectName}&memberTagGroupIds=${ids}&pageName=memberSign`) that.axios.get(`${that.baseUrl}/gic-member-tag-web/member-tag-member/findMemberListByGroupIds.json?requestProject=${that.projectName}&memberTagGroupIds=${ids}&pageName=memberSign`)
.then(res => { .then(res => {
// console.log(res, "count");
if (res.data.errorCode == 1) { if (res.data.errorCode == 1) {
that.countOfCoverTotal = res.data.result.page.totalCount; that.countOfCoverTotal = res.data.result.page.totalCount;
} }
}); });
},
searchSelectedByKey(key) {
let arr = [];
this.staticSelectedData.forEach(data => {
if (data.groupName.toLowerCase().includes(key.toLowerCase())) {
arr.push(data);
}
});
this.selectedData = arr;
} }
}, },
filters: { filters: {
...@@ -419,18 +428,21 @@ ...@@ -419,18 +428,21 @@
this.selectedData = this.uniqueByGroupId(this.selectedData.concat(this.defaltSelected)); // 数组拼接并去重 this.selectedData = this.uniqueByGroupId(this.selectedData.concat(this.defaltSelected)); // 数组拼接并去重
} }
this.getMemberCountByGroups(); this.getMemberCountByGroups();
},
watch: {
dataSearchSelected(now, old) {
this.searchSelectedByKey(now);
}
} }
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
.group-set-transfer { .group-set-transfer {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex; display: flex;
width: 100%; width: 100%;
min-width: 712px;
background: #fff; background: #fff;
padding: 30px; padding: 10px 30px 20px;
box-sizing: border-box; box-sizing: border-box;
a { a {
color: #606266; color: #606266;
...@@ -445,7 +457,7 @@ ...@@ -445,7 +457,7 @@
width: 100%; width: 100%;
} }
.m-b-26 { .m-b-26 {
margin-block-start: 26px; margin-bottom: 26px;
} }
.input-div { .input-div {
padding: 20px 14px; padding: 20px 14px;
...@@ -454,6 +466,16 @@ ...@@ -454,6 +466,16 @@
height: 100%; height: 100%;
border: 1px solid #DCDFE6; border: 1px solid #DCDFE6;
border-radius: 4px; border-radius: 4px;
&.select-list {
min-width: 230px;
}
.el-table tr {
cursor: pointer;
.h-18 {
height: 18px;
line-height: 18px;
}
}
.cover-count { .cover-count {
height: 42px; height: 42px;
line-height: 42px; line-height: 42px;
...@@ -468,32 +490,25 @@ ...@@ -468,32 +490,25 @@
} }
} }
.btn-box { .btn-box {
display: -webkit-flex; width: 62px;
display: flex; position: relative;
-webkit-align-items: center;
align-items: center;
-webkit-justify-content: center;
justify-content: center;
width: 80px;
text-align: center;
.icon-container { .icon-container {
height: 120px;
position: absolute;
top: 50%;
margin-top: -60px;
width: 100%;
padding: 13px;
box-sizing: border-box;
.transfer-icon { .transfer-icon {
display: inline-block;
width: 43px;
height: 43px;
line-height: 44px;
border-radius: 100%;
text-align: center;
border: 1px solid #DCDFE6;
color: #DCDFE6;
font-size: 20px;
cursor: pointer;
&:hover {
border: none;
background: #409EFF;
color: #fff; color: #fff;
// font-size: 20px;
margin-left: 0;
margin-right: 0;
} }
} }
.el-button.is-disabled {
color: #DCDFE6;
} }
} }
.selected-list { .selected-list {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment