Skip to content

V
vue-gic-card
Commit aee75b6a by 无尘
Options

add card plugin

parent 1663ecf5
Showing with 731 additions and 0 deletions
.babelrc 0 → 100644
{
"presets": [
["env", { "modules": false }],
"stage-3"
]
}
.editorconfig 0 → 100644
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
.gitignore 0 → 100644
.DS_Store
node_modules/
npm-debug.log
yarn-error.log
# Editor directories and files
.idea
*.suo
*.ntvs*
*.njsproj
*.sln
\ No newline at end of file
README.md
#
<<<<<<< HEAD
> A Vue.js card select Plugin
## Install
```shell
npm install @gic-test/vue-gic-card -S
```
## how to use
```
// main.js
import vueGicCard from '@gic-test/vue-gic-card'
Vue.use(vueGicCard)
// 使用页面
<div @click="showCard">点击弹窗</div>
<vue-gic-card :projectName="projectName" :showCardDialog="showCardDialog" :cardLimit="cardLimit" :cardType="cardType" @selectCard="selectCard"></vue-gic-card>
data() {
return {
// 可传参数
projectName: '', //当前项目名
showCardDialog: false,
cardLimit: 1, //卡券限制类型 1-限制领取1张的卡券 2- 限制领取 1~100的卡券 3-限制领取>=100 的卡券
cardType: null //卡券类型集合（0：抵金券，1：折扣券，2：兑换券）null-为全部类型 逗号分隔
}
}
methods: {
// 显示卡券弹窗
showCard() {
var that = this
that.showCardDialog = true;
},
// 子组件触发方法
selectCard(val) {
// 模拟检查数据
console.log(val)
var that = this
that.showCardDialog = false;
}
},
```
dist/vue-gic-card.js 0 → 100644
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define("vue-gic-card",[],t):"object"==typeof exports?exports["vue-gic-card"]=t():e["vue-gic-card"]=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=3)}([function(e,t,r){"use strict";var n=r(11),a=r.n(n);t.a={name:"vue-gic-card",props:["showCardDialog","projectName","cardLimit","cardType"],data:function(){return{repProjectName:"gic-web",searchText:"",cardData:[],currentRow:null,radio:null,dialogCard:!1,cardCurrentPage:1,cardPageSize:5,total:0,cardLimitType:"",cardTypes:"",baseUrl:""}},beforeMount:function(){var e=this,t=window.location.origin;console.log("当前host:",t),"-1"!=t.indexOf("localhost")?e.baseUrl="http://gicdev.demogic.com":e.baseUrl=t},methods:{handleCurrentChangeTable:function(e){var t=this;console.log("table: ",e),t.radio=e.coupCardId,t.currentRow=e},cardSizeChange:function(e){console.log("每页 "+e+" 条")},cardCurrentChange:function(e){console.log("当前页: "+e);var t=this;t.cardCurrentPage=e,t.getCardList()},setNewData:function(e){this.dialogCard=e,console.log("弹框是否显示: ",e)},toSearchInput:function(e){var t=this;console.log("搜索值: ",t.searchText,e),t.cardCurrentPage=1,t.getCardList()},clearInput:function(e){var t=this;console.log(e,t.searchText),t.cardCurrentPage=1,t.getCardList()},dialogCardConfirm:function(){var e=this;if(!e.currentRow||!Object.keys(e.currentRow).length||!Object.values(e.currentRow).length)return void e.$message.error({duration:1e3,message:"请选择门店"});e.$emit("selectCard",e.currentRow),e.currentRow={},e.radio=null},handleCardClose:function(){this.dialogCardcancel()},dialogCardcancel:function(){var e=this;e.$confirm("确认关闭?","",{confirmButtonText:"确定",cancelButtonText:"取消",type:""}).then(function(){console.log("点击确认"),e.currentRow={},e.radio=null,e.$emit("selectCard")}).catch(function(){console.log("取消 取消关闭")})},getCardList:function(){var e=this,t={currentPage:e.cardCurrentPage,pageSize:e.cardPageSize,searchParam:e.searchText||"",requestProject:e.repProjectName,cardLimitType:e.cardLimitType,cardTypes:e.cardTypes};e.axios.post(e.baseUrl+"/api-plug/get-coupon-list",a.a.stringify(t)).then(function(t){console.log(t,t.data,t.data.errorCode);var r=t.data;if(0==r.errorCode)return r.result.result.forEach(function(t,r){t.beginDate&&(t.beginDate=e.formatDate(t.beginDate,".")),t.endDate&&(t.endDate=e.formatDate(t.endDate,"."))}),e.cardData=r.result.result,void(e.total=r.result.totalCount);e.$message.error({duration:1e3,message:error.message})}).catch(function(t){console.log(t),e.$message.error({duration:1e3,message:t.message})})},formatDate:function(e,t){function r(e){return e>9?""+e:"0"+e}var n=new Date(e),a=n.getFullYear(),o=n.getMonth()+1,i=n.getDate();return a+t+r(o)+t+r(i)+t}},watch:{showCardDialog:function(e,t){var r=this;console.log("新数据:",e,t),r.setNewData(e)},projectName:function(e,t){this.repProjectName=e||"gic-web"},cardLimit:function(e,t){this.cardLimitType=e},cardType:function(e,t){this.cardTypes=e}},mounted:function(){console.log("传递的参数对象:",this.showCardDialog);var e=this;e.repProjectName=e.projectName||"gic-web",e.cardLimitType=e.cardLimit,e.cardTypes=e.cardType,e.getCardList(),e.setNewData(e.showCardDialog)}}},function(e,t,r){"use strict";var n=Object.prototype.hasOwnProperty,a=function(){for(var e=[],t=0;t<256;++t)e.push("%"+((t<16?"0":"")+t.toString(16)).toUpperCase());return e}();t.arrayToObject=function(e,t){for(var r=t&&t.plainObjects?Object.create(null):{},n=0;n<e.length;++n)void 0!==e[n]&&(r[n]=e[n]);return r},t.merge=function(e,r,a){if(!r)return e;if("object"!=typeof r){if(Array.isArray(e))e.push(r);else{if("object"!=typeof e)return[e,r];(a.plainObjects||a.allowPrototypes||!n.call(Object.prototype,r))&&(e[r]=!0)}return e}if("object"!=typeof e)return[e].concat(r);var o=e;return Array.isArray(e)&&!Array.isArray(r)&&(o=t.arrayToObject(e,a)),Array.isArray(e)&&Array.isArray(r)?(r.forEach(function(r,o){n.call(e,o)?e[o]&&"object"==typeof e[o]?e[o]=t.merge(e[o],r,a):e.push(r):e[o]=r}),e):Object.keys(r).reduce(function(e,n){var o=r[n];return Object.prototype.hasOwnProperty.call(e,n)?e[n]=t.merge(e[n],o,a):e[n]=o,e},o)},t.decode=function(e){try{return decodeURIComponent(e.replace(/\+/g," "))}catch(t){return e}},t.encode=function(e){if(0===e.length)return e;for(var t="string"==typeof e?e:String(e),r="",n=0;n<t.length;++n){var o=t.charCodeAt(n);45===o||46===o||95===o||126===o||o>=48&&o<=57||o>=65&&o<=90||o>=97&&o<=122?r+=t.charAt(n):o<128?r+=a[o]:o<2048?r+=a[192|o>>6]+a[128|63&o]:o<55296||o>=57344?r+=a[224|o>>12]+a[128|o>>6&63]+a[128|63&o]:(n+=1,o=65536+((1023&o)<<10|1023&t.charCodeAt(n)),r+=a[240|o>>18]+a[128|o>>12&63]+a[128|o>>6&63]+a[128|63&o])}return r},t.compact=function(e,r){if("object"!=typeof e||null===e)return e;var n=r||[],a=n.indexOf(e);if(-1!==a)return n[a];if(n.push(e),Array.isArray(e)){for(var o=[],i=0;i<e.length;++i)e[i]&&"object"==typeof e[i]?o.push(t.compact(e[i],n)):void 0!==e[i]&&o.push(e[i]);return o}return Object.keys(e).forEach(function(r){e[r]=t.compact(e[r],n)}),e},t.isRegExp=function(e){return"[object RegExp]"===Object.prototype.toString.call(e)},t.isBuffer=function(e){return null!==e&&void 0!==e&&!!(e.constructor&&e.constructor.isBuffer&&e.constructor.isBuffer(e))}},function(e,t,r){"use strict";var n=String.prototype.replace,a=/%20/g;e.exports={default:"RFC3986",formatters:{RFC1738:function(e){return n.call(e,a,"+")},RFC3986:function(e){return e}},RFC1738:"RFC1738",RFC3986:"RFC3986"}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=r(4),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(5)}var a=r(0),o=r(14),i=r(10),c=n,s=i(a.a,o.a,!1,c,"data-v-1599465a",null);t.a=s.exports},function(e,t,r){var n=r(6);"string"==typeof n&&(n=[[e.i,n,""]]),n.locals&&(e.exports=n.locals);r(8)("78eaa4ac",n,!0,{})},function(e,t,r){t=e.exports=r(7)(!1),t.push([e.i,"#wrap[data-v-1599465a]{background:#fff}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search{margin:10px 15px;font-size:14px;color:#292929;height:36px;line-height:36px}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search>span{float:left;margin-right:10px}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search /deep/.search-input{width:180px}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search /deep/.search-input .el-input__inner{height:36px;line-height:36px}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search .search-btn{margin-left:4px}.attention-textAndImg-wrap[data-v-1599465a] .text-img-search .limit-text{color:#909399;font-size:12px;line-height:1;padding-top:4px;display:inline-block;margin-left:20px}.attention-textAndImg-wrap[data-v-1599465a] .pic-list-box .list-img{width:80px;height:80px}.attention-textAndImg-wrap[data-v-1599465a] .pic-list-box .list-img img{width:100%;height:100%}.attention-textAndImg-wrap[data-v-1599465a] .pic-list-box .card-table{position:relative}.attention-textAndImg-wrap[data-v-1599465a] .el-table thead th,.attention-textAndImg-wrap[data-v-1599465a] .el-table thead tr{background:#f1f3f7}.pagination[data-v-1599465a]{text-align:right;margin-top:20px}.pic-list-box[data-v-1599465a] .el-table__row{cursor:pointer}.attention-textAndImg-wrap[data-v-1599465a] .el-dialog__body{padding:10px 20px}",""])},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["+m+'~="'+e.id+'"]');if(n){if(g)return h;n.parentNode.removeChild(n)}if(y){var o=f++;n=p||(p=a()),t=i.bind(null,n,o,!1),r=i.bind(null,n,o,!0)}else n=a(),t=c.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=b(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 c(e,t){var r=t.css,n=t.media,a=t.sourceMap;if(n&&e.setAttribute("media",n),v.ssrId&&e.setAttribute(m,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 s="undefined"!=typeof document;if("undefined"!=typeof DEBUG&&DEBUG&&!s)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=r(9),u={},d=s&&(document.head||document.getElementsByTagName("head")[0]),p=null,f=0,g=!1,h=function(){},v=null,m="data-vue-ssr-id",y="undefined"!=typeof navigator&&/msie [6-9]\b/.test(navigator.userAgent.toLowerCase());e.exports=function(e,t,r,a){g=r,v=a||{};var o=l(e,t);return n(o),function(t){for(var r=[],a=0;a<o.length;a++){var i=o[a],c=u[i.id];c.refs--,r.push(c)}t?(o=l(e,t),n(o)):o=[];for(var a=0;a<r.length;a++){var c=r[a];if(0===c.refs){for(var s=0;s<c.parts.length;s++)c.parts[s]();delete u[c.id]}}}};var b=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],c=o[1],s=o[2],l=o[3],u={id:e+":"+a,css:c,media:s,sourceMap:l};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,c=e=e||{},s=typeof e.default;"object"!==s&&"function"!==s||(i=e,c=e.default);var l="function"==typeof c?c.options:c;t&&(l.render=t.render,l.staticRenderFns=t.staticRenderFns,l._compiled=!0),r&&(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__),n&&n.call(this,e),e&&e._registeredComponents&&e._registeredComponents.add(o)},l._ssrRegister=u):n&&(u=n),u){var d=l.functional,p=d?l.render:l.beforeCreate;d?(l._injectStyles=u,l.render=function(e,t){return u.call(t),p(e,t)}):l.beforeCreate=p?[].concat(p,u):[u]}return{esModule:i,exports:c,options:l}}},function(e,t,r){"use strict";var n=r(12),a=r(13),o=r(2);e.exports={formats:o,parse:a,stringify:n}},function(e,t,r){"use strict";var n=r(1),a=r(2),o={brackets:function(e){return e+"[]"},indices:function(e,t){return e+"["+t+"]"},repeat:function(e){return e}},i=Date.prototype.toISOString,c={delimiter:"&",encode:!0,encoder:n.encode,serializeDate:function(e){return i.call(e)},skipNulls:!1,strictNullHandling:!1},s=function e(t,r,a,o,i,c,s,l,u,d,p){var f=t;if("function"==typeof s)f=s(r,f);else if(f instanceof Date)f=d(f);else if(null===f){if(o)return c?c(r):r;f=""}if("string"==typeof f||"number"==typeof f||"boolean"==typeof f||n.isBuffer(f))return c?[p(c(r))+"="+p(c(f))]:[p(r)+"="+p(String(f))];var g=[];if(void 0===f)return g;var h;if(Array.isArray(s))h=s;else{var v=Object.keys(f);h=l?v.sort(l):v}for(var m=0;m<h.length;++m){var y=h[m];i&&null===f[y]||(g=Array.isArray(f)?g.concat(e(f[y],a(r,y),a,o,i,c,s,l,u,d,p)):g.concat(e(f[y],r+(u?"."+y:"["+y+"]"),a,o,i,c,s,l,u,d,p)))}return g};e.exports=function(e,t){var r=e,n=t||{};if(null!==n.encoder&&void 0!==n.encoder&&"function"!=typeof n.encoder)throw new TypeError("Encoder has to be a function.");var i=void 0===n.delimiter?c.delimiter:n.delimiter,l="boolean"==typeof n.strictNullHandling?n.strictNullHandling:c.strictNullHandling,u="boolean"==typeof n.skipNulls?n.skipNulls:c.skipNulls,d="boolean"==typeof n.encode?n.encode:c.encode,p=d?"function"==typeof n.encoder?n.encoder:c.encoder:null,f="function"==typeof n.sort?n.sort:null,g=void 0!==n.allowDots&&n.allowDots,h="function"==typeof n.serializeDate?n.serializeDate:c.serializeDate;if(void 0===n.format)n.format=a.default;else if(!Object.prototype.hasOwnProperty.call(a.formatters,n.format))throw new TypeError("Unknown format option provided.");var v,m,y=a.formatters[n.format];"function"==typeof n.filter?(m=n.filter,r=m("",r)):Array.isArray(n.filter)&&(m=n.filter,v=m);var b=[];if("object"!=typeof r||null===r)return"";var x;x=n.arrayFormat in o?n.arrayFormat:"indices"in n?n.indices?"indices":"repeat":"indices";var w=o[x];v||(v=Object.keys(r)),f&&v.sort(f);for(var C=0;C<v.length;++C){var _=v[C];u&&null===r[_]||(b=b.concat(s(r[_],_,w,l,u,p,m,f,g,h,y)))}return b.join(i)}},function(e,t,r){"use strict";var n=r(1),a=Object.prototype.hasOwnProperty,o={allowDots:!1,allowPrototypes:!1,arrayLimit:20,decoder:n.decode,delimiter:"&",depth:5,parameterLimit:1e3,plainObjects:!1,strictNullHandling:!1},i=function(e,t){for(var r={},n=e.split(t.delimiter,t.parameterLimit===1/0?void 0:t.parameterLimit),o=0;o<n.length;++o){var i,c,s=n[o],l=-1===s.indexOf("]=")?s.indexOf("="):s.indexOf("]=")+1;-1===l?(i=t.decoder(s),c=t.strictNullHandling?null:""):(i=t.decoder(s.slice(0,l)),c=t.decoder(s.slice(l+1))),a.call(r,i)?r[i]=[].concat(r[i]).concat(c):r[i]=c}return r},c=function(e,t,r){if(!e.length)return t;var n,a=e.shift();if("[]"===a)n=[],n=n.concat(c(e,t,r));else{n=r.plainObjects?Object.create(null):{};var o="["===a.charAt(0)&&"]"===a.charAt(a.length-1)?a.slice(1,-1):a,i=parseInt(o,10);!isNaN(i)&&a!==o&&String(i)===o&&i>=0&&r.parseArrays&&i<=r.arrayLimit?(n=[],n[i]=c(e,t,r)):n[o]=c(e,t,r)}return n},s=function(e,t,r){if(e){var n=r.allowDots?e.replace(/\.([^.[]+)/g,"[$1]"):e,o=/(\[[^[\]]*])/,i=/(\[[^[\]]*])/g,s=o.exec(n),l=s?n.slice(0,s.index):n,u=[];if(l){if(!r.plainObjects&&a.call(Object.prototype,l)&&!r.allowPrototypes)return;u.push(l)}for(var d=0;null!==(s=i.exec(n))&&d<r.depth;){if(d+=1,!r.plainObjects&&a.call(Object.prototype,s[1].slice(1,-1))&&!r.allowPrototypes)return;u.push(s[1])}return s&&u.push("["+n.slice(s.index)+"]"),c(u,t,r)}};e.exports=function(e,t){var r=t||{};if(null!==r.decoder&&void 0!==r.decoder&&"function"!=typeof r.decoder)throw new TypeError("Decoder has to be a function.");if(r.delimiter="string"==typeof r.delimiter||n.isRegExp(r.delimiter)?r.delimiter:o.delimiter,r.depth="number"==typeof r.depth?r.depth:o.depth,r.arrayLimit="number"==typeof r.arrayLimit?r.arrayLimit:o.arrayLimit,r.parseArrays=!1!==r.parseArrays,r.decoder="function"==typeof r.decoder?r.decoder:o.decoder,r.allowDots="boolean"==typeof r.allowDots?r.allowDots:o.allowDots,r.plainObjects="boolean"==typeof r.plainObjects?r.plainObjects:o.plainObjects,r.allowPrototypes="boolean"==typeof r.allowPrototypes?r.allowPrototypes:o.allowPrototypes,r.parameterLimit="number"==typeof r.parameterLimit?r.parameterLimit:o.parameterLimit,r.strictNullHandling="boolean"==typeof r.strictNullHandling?r.strictNullHandling:o.strictNullHandling,""===e||null===e||void 0===e)return r.plainObjects?Object.create(null):{};for(var a="string"==typeof e?i(e,r):e,c=r.plainObjects?Object.create(null):{},l=Object.keys(a),u=0;u<l.length;++u){var d=l[u],p=s(d,a[d],r);c=n.merge(c,p,r)}return n.compact(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:"attention-textAndImg-wrap"},[r("el-dialog",{attrs:{title:"选择卡券",visible:e.dialogCard,width:"800px","before-close":e.handleCardClose},on:{"update:visible":function(t){e.dialogCard=t}}},[r("div",[r("div",{staticClass:"text-img-search clearfix"},[r("span",[e._v("选择卡券（共"+e._s(e.total)+"条）")]),e._v(" "),r("div",{staticClass:"fl"},[r("el-input",{staticClass:"search-input",attrs:{placeholder:"请输入内容","prefix-icon":"el-icon-search",clearable:""},on:{clear:e.clearInput},nativeOn:{keyup:function(t){return function(t){return e.toSearchInput(t)}(t)}},model:{value:e.searchText,callback:function(t){e.searchText=t},expression:"searchText"}}),e._v(" "),r("p",{staticClass:"limit-text"},[e._v("取限制>1的卡券不支持选择，系统已自动过滤")])],1)]),e._v(" "),r("div",{staticClass:"pic-list-box"},[r("el-table",{ref:"multipleTable",staticClass:"card-table",staticStyle:{width:"100%"},attrs:{data:e.cardData,"tooltip-effect":"dark"},on:{"row-click":e.handleCurrentChangeTable}},[r("el-table-column",{attrs:{label:"",width:"55"},scopedSlots:e._u([{key:"default",fn:function(t){return[r("el-radio",{staticClass:"radio-style",attrs:{label:t.row.coupCardId},model:{value:e.radio,callback:function(t){e.radio=t},expression:"radio"}},[e._v("\n  \n ")])]}}])}),e._v(" "),r("el-table-column",{attrs:{label:"卡券名称"},scopedSlots:e._u([{key:"default",fn:function(t){return[e._v(e._s(t.row.cardName))]}}])}),e._v(" "),r("el-table-column",{attrs:{prop:"subName",label:"备注名"}}),e._v(" "),r("el-table-column",{attrs:{prop:"",label:"领取限制",width:"100"},scopedSlots:e._u([{key:"default",fn:function(t){return[0==t.row.cardEffectiveMode?r("div",[e._v(e._s(t.row.beginDate+"-"+t.row.endDate))]):e._e(),e._v(" "),1==t.row.cardEffectiveMode?r("div",[e._v("领取"+e._s(t.row.startDay+"-"+t.row.limitDay)+"天后,可以使用")]):e._e()]}}])}),e._v(" "),r("el-table-column",{attrs:{prop:"",label:"适用门店",width:"100"},scopedSlots:e._u([{key:"default",fn:function(t){return[0==t.row.storeMode?r("div",[e._v("所有门店")]):e._e(),e._v(" "),1==t.row.storeMode?r("div",[e._v("部分分组")]):e._e(),e._v(" "),2==t.row.storeMode?r("div",[e._v("部分门店")]):e._e()]}}])}),e._v(" "),r("el-table-column",{attrs:{prop:"couponStock",label:"库存",width:"130"}})],1),e._v(" "),r("div",{staticClass:"pagination"},[r("el-pagination",{attrs:{"current-page":e.cardCurrentPage,small:"","page-size":e.cardPageSize,layout:"prev, pager, next",total:e.total},on:{"size-change":e.cardSizeChange,"current-change":e.cardCurrentChange}})],1)],1)]),e._v(" "),r("div",{staticClass:"dialog-footer",attrs:{slot:"footer"},slot:"footer"},[r("el-button",{on:{click:e.dialogCardcancel}},[e._v("取 消")]),e._v(" "),r("el-button",{attrs:{type:"primary"},on:{click:e.dialogCardConfirm}},[e._v("确 定")])],1)])],1)},a=[],o={render:n,staticRenderFns:a};t.a=o}])});
//# sourceMappingURL=vue-gic-card.js.map
\ No newline at end of file
dist/vue-gic-card.js.map 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
index.html 0 → 100644
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>vue-gic-card</title>
</head>
<body>
<div id="app"></div>
<!-- <script src="/dist/build.js"></script> -->
<script src="/dist/vue-gic-card.js"></script>
</body>
</html>
package-lock.json 0 → 100644
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json 0 → 100644
{
"name": "@gic-test/vue-gic-card",
"description": "vue-gic-card Plugin",
"version": "1.0.36",
"license": "MIT",
"private": false,
"main": "dist/vue-gic-card.js",
"scripts": {
"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
},
"dependencies": {
"axios": "^0.18.0",
"vue": "^2.5.11"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
],
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-env": "^1.6.0",
"babel-preset-stage-3": "^6.24.1",
"cross-env": "^5.0.5",
"css-loader": "^0.28.7",
"file-loader": "^1.1.4",
"less-loader": "^4.1.0",
"node-sass": "^4.5.3",
"sass-loader": "^6.0.6",
"vue-loader": "^13.0.5",
"vue-template-compiler": "^2.4.4",
"webpack": "^3.6.0",
"webpack-dev-server": "^2.9.1"
}
}
src/App.vue 0 → 100644
<template>
<div id="app">
<div @click="showCard">点击弹窗</div>
<vue-gic-card :projectName="projectName" :showCardDialog="showCardDialog" :cardLimit="cardLimit" :cardType="cardType" @selectCard="selectCard"></vue-gic-card>
</div>
</template>
<script>
import vueGicCard from './lib/vue-gic-card'
export default {
name: 'app',
data () {
return {
projectName: '', //当前项目名
showCardDialog: false,
cardLimit: 1, //卡券限制类型 1-限制领取1张的卡券 2- 限制领取 1~100的卡券 3-限制领取>=100 的卡券
cardType: null, //卡券类型集合（0：抵金券，1：折扣券，2：兑换券）null-为全部类型 逗号分隔
}
},
components: {
vueGicCard
},
methods: {
// 显示卡券弹窗
showCard() {
var that = this
that.showCardDialog = true;
},
// 子组件触发方法
selectCard(val) {
// 模拟检查数据
console.log(val)
var that = this
that.showCardDialog = false;
}
}
}
</script>
<style lang="scss">
* {
margin: 0;
padding: 0;
}
</style>
src/lib/api.js 0 → 100644
import axios from 'axios';
import qs from 'qs';
axios.defaults.timeout = 10000;
let base = "http://192.168.1.164:8282/gic/";
const timeout = 10000;
let token = ''//sessionStorage.getItem('user');
/*
*
* 统一 get 请求方法
* @url: 请求的 url
* @params: 请求带的参数
* @header: 带 token
*
*/
export const getRequest = (url, params) => {
return axios({
method: 'get',
url: `${base}${url}`,
data: {},
params: params,
headers: {'content-type': 'application/x-www-form-urlencoded'},// "token": token
});
}
src/lib/index.js 0 → 100644
import vueGicCard from './vue-gic-card.vue' // 导入组件
const GicCard = {
install(Vue, options) {
Vue.component(vueGicCard.name, vueGicCard) // vueGicCard.name 组件的name属性
// 类似通过 this.$xxx 方式调用插件的 其实只是挂载到原型上而已
// Vue.prototype.$xxx // 最终可以在任何地方通过 this.$xxx 调用
// 虽然没有明确规定用$开头 但是大家都默认遵守这个规定
}
}
if (typeof window !== 'undefined' && window.Vue) {
window.Vue.use(GicCard);
}
export default GicCard
// export {
// vueGicCard
// }
src/lib/vue-gic-card.vue 0 → 100644
<template>
<div class="attention-textAndImg-wrap">
<el-dialog
title="选择卡券"
:visible.sync="dialogCard"
width="800px"
:before-close="handleCardClose"
>
<div>
<div class="text-img-search clearfix">
<span>选择卡券（共{{total}}条）</span>
<div class="fl">
<el-input
placeholder="请输入内容"
prefix-icon="el-icon-search"
class="search-input"
v-model="searchText"
@keyup.native="(value) => toSearchInput(value)" clearable @clear="clearInput">
</el-input>
<!-- <el-button class="search-btn" type="primary">查询</el-button> -->
<p class="limit-text">取限制>1的卡券不支持选择，系统已自动过滤</p>
</div>
</div>
<div class="pic-list-box">
<el-table
ref="multipleTable"
:data="cardData"
class="card-table"
tooltip-effect="dark"
style="width: 100%"
@row-click="handleCurrentChangeTable">
<el-table-column label="" width="55">
<template slot-scope="scope">
<el-radio class="radio-style" :label="scope.row.coupCardId" v-model="radio">
&nbsp;
</el-radio>
</template>
</el-table-column>
<el-table-column
label="卡券名称">
<template slot-scope="scope">{{ scope.row.cardName }}</template>
</el-table-column>
<el-table-column
prop="subName"
label="备注名">
</el-table-column>
<el-table-column
prop=""
label="领取限制"
width="100">
<template slot-scope="scope">
<div v-if="scope.row.cardEffectiveMode == 0">{{scope.row.beginDate+'-'+ scope.row.endDate}}</div>
<div v-if="scope.row.cardEffectiveMode == 1">领取{{scope.row.startDay +'-'+ scope.row.limitDay}}天后,可以使用</div>
</template>
</el-table-column>
<el-table-column
prop=""
label="适用门店"
width="100">
<template slot-scope="scope">
<div v-if="scope.row.storeMode == 0">所有门店</div>
<div v-if="scope.row.storeMode == 1">部分分组</div>
<div v-if="scope.row.storeMode == 2">部分门店</div>
</template>
</el-table-column>
<el-table-column
prop="couponStock"
label="库存"
width="130">
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
@size-change="cardSizeChange"
@current-change="cardCurrentChange"
:current-page="cardCurrentPage"
small
:page-size="cardPageSize"
layout="prev, pager, next"
:total="total">
</el-pagination>
</div>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogCardcancel">取 消</el-button>
<el-button type="primary" @click="dialogCardConfirm">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
// import { getRequest } from './api';
import qs from 'qs';
export default {
name: 'vue-gic-card',
props: ['showCardDialog','projectName','cardLimit', 'cardType'],
data () {
return {
repProjectName: 'gic-web', // 项目名
searchText: '',
cardData: [],
currentRow: null,
radio: null,
dialogCard: false,
cardCurrentPage: 1,
cardPageSize: 5,
total: 0,
cardLimitType: '',
cardTypes: '',
// 获取 location origin
baseUrl: '',
}
},
beforeMount() {
var that = this
var host = window.location.origin;
console.log("当前host:",host)
if (host.indexOf('localhost') != '-1') {
that.baseUrl = 'http://gicdev.demogic.com';
}else {
that.baseUrl = host
}
},
methods:{
handleCurrentChangeTable(val) { // 当前格发生变化时触发
var that = this
console.log("table: ",val);
that.radio = val.coupCardId;
that.currentRow = val;
},
// 页码变化
cardSizeChange(val){ // 选择分页符
console.log(`每页 ${val} 条`);
},
// 当前页变化
cardCurrentChange(val) {
console.log(`当前页: ${val}`);
var that = this;
that.cardCurrentPage = val;
that.getCardList();
},
// 设置接收参数
setNewData(cardFlag) {
var that = this;
that.dialogCard = cardFlag;
console.log("弹框是否显示: ",cardFlag)
},
// 搜索输入
toSearchInput: function(value) {
var that = this;
console.log("搜索值: ",that.searchText,value)
// 搜索重置当前页 为 1
that.cardCurrentPage = 1;
that.getCardList();
},
// 清空输入
clearInput: function(e) {
var that = this;
console.log(e,that.searchText);
// 搜索重置当前页 为 1
that.cardCurrentPage = 1;
that.getCardList();
},
// 确认
dialogCardConfirm() {
var that = this;
if (!that.currentRow||!Object.keys(that.currentRow).length||!Object.values(that.currentRow).length) {
that.$message.error({
duration: 1000,
message: "请选择门店"
})
return;
}
that.$emit('selectCard',that.currentRow)
that.currentRow = {};
that.radio = null;
},
handleCardClose() {
var that = this;
that.dialogCardcancel();
},
// 取消
dialogCardcancel() {
var that = this;
that.$confirm('确认关闭?', '', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: ''
}).then(() => {
console.log("点击确认")
that.currentRow = {};
that.radio = null;
that.$emit('selectCard')
}).catch(() => {
console.log("取消 取消关闭")
});
},
// 获取卡券列表
getCardList() {
var that = this
var para = {
currentPage: that.cardCurrentPage,
pageSize: that.cardPageSize,
searchParam: that.searchText || '',
requestProject: that.repProjectName,
cardLimitType: that.cardLimitType,
cardTypes: that.cardTypes,
}
that.axios.post(that.baseUrl+'/api-plug/get-coupon-list',qs.stringify(para))
.then((res) => {
console.log(res,res.data,res.data.errorCode)
var resData = res.data
if (resData.errorCode == 0) {
resData.result.result.forEach(function(ele,index){
if (!!ele.beginDate) {
ele.beginDate = that.formatDate(ele.beginDate,'.')
}
if (!!ele.endDate) {
ele.endDate = that.formatDate(ele.endDate,'.')
}
})
that.cardData = resData.result.result
that.total = resData.result.totalCount
return;
}
that.$message.error({
duration: 1000,
message: resData.message
})
})
.catch(function (error) {
console.log(error);
// that.toLogin()
that.$message.error({
duration: 1000,
message: error.message
})
});
},
formatDate(time,flag) {
var that = this
// (0-9)年月数字的显示
function formatDig(num) {
return num > 9 ? '' + num : '0' + num;
}
var myDate = new Date(time);
let y = myDate.getFullYear();
let m = myDate.getMonth()+1;
let d = myDate.getDate();
return y + flag + formatDig(m) + flag + formatDig(d) + flag
}
},
watch: {
showCardDialog: function(newData,oldData){
var that = this;
console.log("新数据:",newData,oldData)
that.setNewData(newData)
},
projectName: function(newData,oldData){
var that = this;
// console.log("新数据:",newData,oldData)
that.repProjectName = newData || 'gic-web';
},
cardLimit: function(newData,oldData){
var that = this;
that.cardLimitType = newData;
},
cardType: function(newData,oldData){
var that = this;
that.cardTypes = newData;
},
},
/* 接收数据 */
mounted(){
console.log("传递的参数对象:",this.showCardDialog)
var that = this;
// 项目名
that.repProjectName = that.projectName || 'gic-web';
that.cardLimitType = that.cardLimit;
that.cardTypes = that.cardType;
that.getCardList()
that.setNewData(that.showCardDialog)
},
}
</script>
<style lang="scss" scoped>
#wrap{
background: #fff;
}
.attention-textAndImg-wrap /deep/{
.text-img-search {
margin: 10px 15px;
font-size: 14px;
color: #292929;
height: 36px;
line-height: 36px;
> span{
float: left;
margin-right: 10px;
}
/deep/.search-input{
width: 180px;
.el-input__inner {
height: 36px;
line-height: 36px;
}
}
.search-btn{
margin-left: 4px;
}
.limit-text{
color: #909399;
font-size: 12px;
line-height: 1;
padding-top: 4px;
display: inline-block;
margin-left: 20px;
}
}
.pic-list-box{
.list-img{
width: 80px;
height: 80px;
img{
width: 100%;
height: 100%;
}
}
.card-table{
position: relative;
.radio-style{
/* position: absolute;
left: 27px;
top: 15px;*/
}
}
}
.el-table thead tr, .el-table thead th {
background: #f1f3f7;
}
}
.pagination{
text-align: right;
margin-top: 20px;
}
.pic-list-box /deep/ .el-table__row{
cursor: pointer;
}
.attention-textAndImg-wrap /deep/ .el-dialog__body{
padding: 10px 20px;
}
</style>
src/main.js 0 → 100644
import Vue from 'vue'
import App from './App.vue'
new Vue({
el: '#app',
render: h => h(App)
})
webpack.config.js 0 → 100644
var path = require('path')
var webpack = require('webpack')
module.exports = {
// entry: './src/main.js',
entry: './src/lib/index.js',
output: {
path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
// filename: 'build.js',
filename: 'vue-gic-card.js',
library: 'vue-gic-card',
libraryTarget: 'umd',
umdNamedDefine: true
},
module: {
rules: [
{
test: /\.css$/,
use: [
'vue-style-loader',
'css-loader'
],
},
{
test: /\.scss$/,
use: [
'vue-style-loader',
'css-loader',
'sass-loader'
],
},
{
test: /\.sass$/,
use: [
'vue-style-loader',
'css-loader',
'sass-loader?indentedSyntax'
],
},
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
// Since sass-loader (weirdly) has SCSS as its default parse mode, we map
// the "scss" and "sass" values for the lang attribute to the right configs here.
// other preprocessors should work out of the box, no loader config like this necessary.
'scss': [
'vue-style-loader',
'css-loader',
'sass-loader'
],
'sass': [
'vue-style-loader',
'css-loader',
'sass-loader?indentedSyntax'
]
}
// other vue-loader options go here
}
},
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]'
}
}
]
},
resolve: {
alias: {
'vue$': 'vue/dist/vue.esm.js'
},
extensions: ['*', '.js', '.vue', '.json']
},
devServer: {
historyApiFallback: true,
noInfo: true,
overlay: true
},
performance: {
hints: false
},
devtool: '#eval-source-map'
}
if (process.env.NODE_ENV === 'production') {
module.exports.devtool = '#source-map'
// http://vue-loader.vuejs.org/en/workflow/production.html
module.exports.plugins = (module.exports.plugins || []).concat([
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true
})
])
}
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