{"id":13535963,"url":"https://github.com/yeseason/paco-ui-vue","last_synced_at":"2025-04-02T02:31:58.738Z","repository":{"id":148337875,"uuid":"72703000","full_name":"yeseason/paco-ui-vue","owner":"yeseason","description":null,"archived":false,"fork":false,"pushed_at":"2017-01-12T02:37:28.000Z","size":1499,"stargazers_count":13,"open_issues_count":0,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-11-03T01:32:13.354Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://yeseason.github.io/paco-ui-vue/","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/yeseason.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-11-03T02:55:44.000Z","updated_at":"2023-05-30T08:20:16.000Z","dependencies_parsed_at":"2023-05-11T01:30:26.894Z","dependency_job_id":null,"html_url":"https://github.com/yeseason/paco-ui-vue","commit_stats":null,"previous_names":[],"tags_count":9,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeseason%2Fpaco-ui-vue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeseason%2Fpaco-ui-vue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeseason%2Fpaco-ui-vue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yeseason%2Fpaco-ui-vue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yeseason","download_url":"https://codeload.github.com/yeseason/paco-ui-vue/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246743787,"owners_count":20826601,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T09:00:32.742Z","updated_at":"2025-04-02T02:31:58.730Z","avatar_url":"https://github.com/yeseason.png","language":"Vue","funding_links":[],"categories":["UI组件"],"sub_categories":[],"readme":"# paco-ui-vue\n\nVue Components for PACO-UI\n\n\n## 使用说明\n\n- 引入CSS\n```html\n\u003clink rel=\"stylesheet\" href=\"//hcz.pingan.com/common/css/paco/VERSION/paco.min.css\" charset=\"utf-8\"\u003e\n```\n- 引入fastclick\n```html\n\u003cscript src=\"//npmcdn.com/fastclick@1.0.6/lib/fastclick.js\"\u003e\u003c/script\u003e\n```\n- 引入`paco-ui-vue`库\n\n```bash\n  npm i --save paco-ui-vue@VERSION\n```\n\n\u003e 注：`VERSION`为要使用版本\n\n\nImport all components.\n\n```javascript\nimport Vue from 'vue'\nimport Paco from 'paco-ui-vue';\n\nVue.use(paco)\n\n```\n## 组件说明\n\n- Ad\n```html\n    \u003cAd src=\"http://hcz.pingan.com/common/images/logo.png\" show=\"true\" baksrc=\"http://localhost:9090/dist/93719466a36e57c0a7b206f92deace54.png\" link=\"http://hcz.pingan.com\" title=\"平安好车主\"\u003e开车能赚钱，买车全网最低\u003c/Ad\u003e开车能赚钱，买车全网最低\u003c/Ad\u003e\n\n    src 小图标图片地址\n    show 是否显示图标\n    baksrc 背景图片地址\n    link 连接地址\n```\n\n\n- Announcement\n```html\n\u003cAnnouncement\u003e您的爱车暂无违章记录，请继续保持\u003c/Announcement\u003e\n```\n\n- Button\n```html\n    \u003cpaco-button type=\"primary\" \u003e主按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"secondary\" \u003e次按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"primary\" disabled\u003e不可点击按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"outline\" \u003e按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"outline\" \u003e三字钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"outline\" \u003e四字按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"outline\" \u003e五个字按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"warning\" \u003e警示按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"bottom\" \u003e底部按钮\u003c/paco-button\u003e\n    \u003cpaco-button type=\"warning\" disabled \u003e警示按钮不可点\u003c/paco-button\u003e\n```\n- Illustration\n```html\n  \u003cillustration src=\"src\" show=\"true\" text=\"刷新\"\u003e\u003cp slot=\"title\"\u003e说明文本说明文本说明文本\u003c/p\u003e \u003cp slot=\"desc\"\u003e说明文本\u003c/p\u003e\u003c/illustration\u003e  \n  src 图片地址\n  show 是否显示按钮\n  text 按钮文字\n\n```\n\n- Input\n```html\n   \u003cinputs til=\"输入内容提示\" label=\"true\"\u003e\u003c/inputs\u003e\n    \u003cinputs til=\"输入内容提示\"\u003e提示标签\u003c/inputs\u003e\n    \u003cinputs value=\"已输入内容\"\u003e 五个字标签\u003c/inputs\u003e\n    \u003cinputs til=\"输入内容提示\" wrong=\"true\"\u003e提示标签\u003c/inputs\u003e\n    \u003cinputs til=\"输入内容提示\" camera=\"true\" highlight=\"true\"\u003e提示标签\u003c/inputs\u003e\n    \u003cinputs til=\"输入校验码\" span=\"true\"\u003e校验码\u003c/inputs\u003e\n```\n\n- Search\n```html\n\u003cpaco-search\u003e\u003c/paco-search\u003e \n```\n\n- CheckBox\n```html\n\u003cpaco-check value=\"true\"\u003e同意\u003c/paco-check\u003e\n```\n\n- Mask\n```html\n \u003cMask\u003e\u003c/Mask\u003e\n```\n\n- Line\n```html\n      \u003cLine \u003e\u003c/Line\u003e\n      \u003cLine right\u003e\u003c/Line\u003e\n      \u003cLine left\u003e\u003c/Line\u003e\n      \u003cLine right left\u003e\u003c/Line\u003e\n```\n\n- Loading\n```html\n\u003cLoading :active.sync=\"active\"\u003e\u003c/Loading\u003e\n```\n\n\n- Share\n```html\n\u003cshare :active.sync='active'\u003e\u003c/share\u003e\n```\n\n- Switch\n```html\n\u003cSwitch\u003e\u003c/Switch\u003e\n```\n\n- Tab\n```html\n\u003cTabs type=\"pills\"\u003e\n      \u003cTab title=\"tabname1\" active=true\u003e\n        hello word\n      \u003c/Tab\u003e\n      \u003cTab title=\"tabname2\" \u003e\n        hello andrond\n        \u003cinput type=\"text\" name=\"\"\u003e\n      \u003c/Tab\u003e\n      \u003cTab title=\"tabname3\" \u003e\n        hello ios\n      \u003c/Tab\u003e\n\u003c/Tabs\u003e\n```\n\n- Toast\n```html\n    \u003cpaco-button v-on:click=\"openToast\" type=\"primary\" \u003esuccess\u003c/paco-button\u003e\n    \u003cpaco-button v-on:click=\"openToastfail\" type=\"primary\" \u003efail\u003c/paco-button\u003e\n    \u003cpaco-button v-on:click=\"openToastopps\" type=\"primary\" \u003eopps\u003c/paco-button\u003e\n```\n```javascript\n    openToast(){\n      Toast(\"成功提醒\");\n    },\n    openToastfail(){\n      Toast({\n        message:\"失败提醒\",\n        duration:1000,\n        type:\"fail\"      \n      });\n    },\n    openToastopps(){\n      Toast({\n        message:\"网络无法连接\",\n        duration:5000,\n        type:\"opps\"      \n      });\n    }\n```\n\n- Agreeme\n```html\n    \u003cspan class=\"agree-it\"\u003e\u003cpaco-check value=\"on\"\u003e同意\u003c/paco-check\u003e\u003ca href=\"http://hcz.pingan.com/common/page/provision/loss.html\"\u003e《平安好车主服务协议》\u003c/a\u003e\u003c/span\u003e\n```\n\n- Agreement\n\n```html\n  \u003cagreement\u003e内容\u003c/agreement\u003e\n```\n\n- Card\n\n```html\n  \u003ccard thumbnail=\"true\" src=\"http://placehold.it/688x346/1cabeb/ffffff?text=PACO-UI\"\u003e\n      \u003cspan slot=\"title\"\u003e 标题\u003c/span\u003e\n      \u003cspan slot=\"tips\"\u003e2016-08-08\u003c/span\u003e\n      \u003cspan slot=\"content\"\u003e内容内容内容内容内容内容内容内容内容内容内容内容内容内容\u003c/span\u003e\n  \u003c/card\u003e\n```\n\n- alert\n\n```javascript\nAlert({\n  title:\"温馨提示\",\n  message:\"你确定这么做\"\n},function (action) {\n   console.log(action);\n}\n      \ntitle 标题\nmessage 内容\nshowCancelButton 是否显示取消按钮\n```\n\n- Model\n\n```javascript\n       Model({\n          message:\"\u003cimg class='image' src='http://hcz.pingan.com/common/images/download.png' role='presentation'\u003e\u003cdiv class='desc'\u003e说明方案\u003c/div\u003e\u003cdiv class='tips'\u003e终极辅助说明方案\u003c/div\u003e\",\n          btn:\"主按钮\"\n       },function(action){\n          console.log(action);\n       })\n```\n\n- actionsheet\n\n```javascript\n      Actionsheet({\n\n      },function(action){\n          console.log(action);\n      })\n```\n\n- Result\n\n```javascript\n       \u003cpaco-result description=所提交内容已成功完成验证 title=支付成功 btn=success type=success v-on:handleActions=\"result\"\u003e\u003c/paco-result\u003e\n\n       description 描述\n       title 支付名称\n       btn 按钮名字\n       type 状态 success 成功 failure 失败 warning 警告 waiting 等待 tips 提示\n       v-on:handleActions=“fun” 按钮回调\n\n```\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyeseason%2Fpaco-ui-vue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyeseason%2Fpaco-ui-vue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyeseason%2Fpaco-ui-vue/lists"}