傾斜をつけた割り勘計算ツールを作ってみた - Qiita
はじめに 忘年会等の飲み会イベントで幹事を任されるのは若手の宿命。 かく言う私も例外ではありませんでした。私の勤務先の場合、社員の年齢差が大きいため傾斜をつけることがほとんど。ただ、この傾斜計算、参加者全員分の年次を把握したり傾斜の具合を微調節したりと意外に面倒で時間をとられます。 いい感じのサービスがないか検索してみたものの、PCサイト用のものはスマホでレウアウトが崩れるし、スマホ向けにはネイティブアプリばかりでPCからは利用できず。意外にもPC・スマホ双方で適切に動くものは見つけられませんでした。 ないなら作ればいい、そこで会社向けに作ったのがこの割り勘計算ツール。 先日公開した割り勘計算ツール(https://t.co/w2j6PD7ZHu)のベースとなった、会社向けver。 各組織の事前に登録しておる社員を選択できて、年次情報をもとに傾斜を計算してくれる仕組み。 pic.twitt
vue.js, apolloで無限スクロール（Infinite Scroll）を実装する - Qiita
vue.jsとapolloを使って以下のような無限スクロールを実装します。 （正確にはスクロール位置検知での自動追加読み込み） フロントの説明のみになります。バックエンドのgraphQL APIサーバーはGraphCMS使っています。 デモページはこちら。 https://vue-sample-blog.firebaseapp.com/infiniteScrollDemo （スマホで動かなかったので修正します） 無限スクロール[Infinite Scroll]とは？ よくある画面下部までスクロールした際に、自動で次のコンテンツが読み込まれるやつです。 スマホアプリとかのUIで採用される場合が多いですね。 利点は、ページングがないので離脱を防ぎやすいなど。 欠点は、プラウザの戻るとの相性が悪いなど。 vue.js apolloでの実装 今回の元データはこちらで作成したブログを使っています。
Vue.js(Vuetify)でCSSを一切書かずにセレクトボタンのコンポーネントを作りました - Qiita
現在、VuetifyというVue.jsのコンポーネントライブラリを実験的に利用しています。 標準でも豊富なUIライブラリが準備されておりとても役に立っています。 いくつかの入力コンポーネントを利用していますが、縦に選択肢が並ぶセレクトボックスを利用したいニーズがあり(※こんなイメージ) vuetifyのライブラリにはイメージにピッタリ当てはまるものが無かったためセレクトボタンコンポーネントを作ってみました。 (v-btn-toggleというものがイメージに近しかったのですが、スタイルシートを当てないと縦に並ぶものが作れず・・~~スタイルシートが不得意なので（いいわけ）~~どうしてもvutifyのプロパティだけで作りたかったのです。もはや意地ですww) ###それで、できたのがこちら↓ GitHub // 特約選択欄:1セレクトボックス Vue.component('v-btn-select
カードコンポーネント — Vuetify
V-cardコンポーネントは、見出し、テキスト、画像、アクション用に、シンプルなインターフェイスを提供する汎用性の高いコンポーネントです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
vue-crm
GitHub - harryho/vue-crm: Simple reusable CRM built on Vue 2 PWA template and Vuetify UI
Vue Material Admin Template
vuetify-todo-pwa
GitHub - davidgaroro/vuetify-todo-pwa: ✔️ A simple Todo PWA built with Vue CLI 3 + Vuex + Vuetify.
vuetify-swipeout
GitHub - davidgaroro/vuetify-swipeout: 👆 A swipe out example built with Vue CLI 3 + Vuetify + Swiper.
GitHub - tookit/vue-material-admin: A vue material design admin template
Vue.jsとVueRouterとVuetifyでナビゲーション付きページのシンプルなサンプル - garicchi.com
vuetifyでcard内のavatarを中心に持ってくる - Qiita
GitHub - ClickerMonkey/dayspan-vuetify-example: A standalone example of a Calendar app using dayspan-vuetify
Dayspan Vuetify - Vuetify Scheduler / Calendar Components - Made with Vue.js
sample-blog
GitHub - kawamataryo/vue-sample-blog: headlessCMS、vue、apolloのsample blog
GitHub - ClickerMonkey/dayspan-vuetify: A collection of components that visualizes DaySpan Calendars and Schedules using Vuetify
Vue.js いろいろまとめ - Qiita
