Skip to content

Instantly share code, notes, and snippets.

Avatar

Tzu-Yin Hong lili668668

View GitHub Profile
View stickyHeader2.vue
<template>
<div>
<table
:style="{ maxWidth: `${bodyWidthString}` }"
>
<thead ref="head">
<tr>
<th
v-for="(header,index) in headers"
:key="index"
@lili668668
lili668668 / stickyHeader.vue
Created Aug 4, 2019
虛擬表格的標題列
View stickyHeader.vue
<template>
<div
ref="viewport"
:style="{ height: `${containerHeight}px` }"
@scroll.passive="onScroll"
>
<table
:class="$style.header"
>
<thead>
@lili668668
lili668668 / offset.js
Created Aug 1, 2019
計算表格位置的程式碼
View offset.js
offsetBody () {
const scrollTop = (this.$refs.viewport as Element).scrollTop
const remainTopNumber = Math.floor(this.remainLineNumber / 2)
const remainTopHeight = remainTopNumber * this.renderLineHeight
const remainBottomHeight = (this.remainLineNumber - remainTopNumber) * this.renderLineHeight
const thresholdHeight = this.thresholdNumber * this.renderLineHeight
const gap = scrollTop - this.bodyTranslateY
const overThreshold = gap < remainTopHeight - thresholdHeight || gap > remainTopHeight + thresholdHeight
const isReachBottom = this.totalHeight - (scrollTop + this.viewportHeight) < remainBottomHeight
const isReachTop = scrollTop < remainTopHeight
@lili668668
lili668668 / scroll.vue
Last active Aug 1, 2019
虛擬滾動表格的解說程式碼
View scroll.vue
<template>
<div
ref="viewport"
:style="{ height: `${viewportHeight}px` }"
@scroll.passive="onScroll"
>
<div
:style="{ height: `${totalHeight}px` }"
>
<section
@lili668668
lili668668 / simple.vue
Last active Aug 1, 2019
虛擬滾動表格解說的範例程式碼
View simple.vue
<template>
<table>
<thead>
<tr v-for="(title, index) in titles">
<th key="index">{{ title }}</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, index) in items">
<td key="index">{{ item }}</td>
View bw.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Bridgewell</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<script>
@lili668668
lili668668 / proposal - 1.js
Last active Jan 8, 2019
Ads API 整合 GraphQL Schema Proposal
View proposal - 1.js
// refer to https://github.com/kdchang/reactjs101/blob/master/Appendix04/README.md
const facebookCampaignType = new graphql.GraphQLObjectType({
name: 'FacebookCampaign',
fields: {
id: { type: graphql.GraphQLString },
name: { type: graphql.GraphQLString },
status: { type: graphql.GraphQLString },
// other fields
}
@lili668668
lili668668 / add_score.js
Last active Dec 23, 2017
合併 學生名單 與 組別名單 與 用學號加分系統 與 zuvio 成績登計系統
View add_score.js
const fs = require('fs')
const csv = require('fast-csv')
var addscore = fs.readFileSync("./addscore.csv").toString()
var students = fs.readFileSync("./student.csv").toString()
var arr = {}
var wa = []
csv
.fromString(students, {headers: true})
@lili668668
lili668668 / Test_Plot.py
Last active Sep 28, 2017
想給予一些比較,所以放上來
View Test_Plot.py
from bs4 import BeautifulSoup
import requests
import pandas as pd
import csv
import numpy as np
import matplotlib
import matplotlib.pyplot as plt
import time
import datetime
@lili668668
lili668668 / add_image.py
Last active Sep 5, 2017
將 kktix 的 csv 裡的檔案連結加工,讓 Google sheet 可以直接觀看圖片,方便檢驗身分
View add_image.py
import csv
import argparse
# 使用 Python3
# python3 add_image.py 檔案路徑
URL_ROW_NAME = "聯絡人 學生資格資料"
parser = argparse.ArgumentParser(description="Input the csv file path.")
parser.add_argument('file_path', metavar="file path", type=str, nargs=1, help="the kktix csv local file path")