harry
/
universal_table
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add image size selection feature

This commit is contained in:
rulingcom 2026-05-13 15:59:46 +08:00
parent 9dcafd268c
commit aa53128c30
7 changed files with 254 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
app/controllers/universal_tables_controller.rb
View File

@ -200,12 +200,20 @@ class UniversalTablesController < ApplicationController
ct = ce.table_column
next if ct.nil?
text = ce.get_frontend_text(ct)
rows << {
"title" => ct.title,
"text" => text,
"order" => ct.order
} if text != ""
end
row_item = {
"title" => ct.title,
"text" => text,
"order" => ct.order
}
if ct.type == "image" && ce.image.present?
row_item["img_src"] = ce.image.url
row_item["img_thumb"] = ce.image.thumb.url
row_item["img_mobile"] = ce.image.mobile.url
end
rows << row_item if text != ""
end
sorted = rows.sort{ |k,v| k["order"] <=> v["order"] }
sorted << {
"title" => t("universal_table.hashtags"),
@ -223,12 +231,20 @@ class UniversalTablesController < ApplicationController
if ct.is_link_to_show
text = "<a href='#{OrbitHelper.url_to_show(e.to_param)}'>#{text}</a>"
end
rows << {
"title" => ct.title,
"text" => text,
"url" => OrbitHelper.url_to_show(e.to_param)
} if text != ""
end
row_item = {
"title" => ct.title,
"text" => text,
"order" => ct.order
}
if ct.type == "image" && ce.image.present?
row_item["img_src"] = ce.image.url
row_item["img_thumb"] = ce.image.thumb.url
row_item["img_mobile"] = ce.image.mobile.url
end
rows << row_item if text != ""
end
rows << {
"title" => t("universal_table.hashtags"),
"text" => e.tags_for_frontend
@ -421,14 +437,22 @@ class UniversalTablesController < ApplicationController
tablecolumns.each do |column|
ce = te.column_entries.where(:table_column_id => column.id).first rescue nil
if !ce.nil?
text = ce.get_frontend_text(column)
if column.is_link_to_show
text = "<a href='#{OrbitHelper.url_to_show(te.to_param)}'>#{text}</a>"
end
text = ce.get_frontend_text(column)
if column.is_link_to_show
text = "<a href='#{OrbitHelper.url_to_show(te.to_param)}'>#{text}</a>"
end
cols << {"text" => text}
col_data = {"text" => text}
if column.type == "image" && ce.image.present?
col_data["img_src"] = ce.image.url
col_data["img_thumb"] = ce.image.thumb.url
col_data["img_mobile"] = ce.image.mobile.url
end
cols << col_data
else
cols << {"text" => ""}
cols << {"text" => ""}
end
end
text = te.hashtags_for_frontend

36
modules/universal_table/index.html.erb
View File

@ -116,7 +116,7 @@
</thead>
<tbody data-level="0" data-list="rows">
<tr data-level="1" data-list="columns">
<td>{{text}}</td>
<td data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -124,7 +124,41 @@
<div>{{export_button}}</div>
{{pagination_goes_here}}
<script>
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'thumb';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>
<style>
.universal-table-index.dtr-inline.collapsed td.dtr-control{

36
modules/universal_table/index2.html.erb
View File

@ -94,7 +94,7 @@
</thead>
<tbody data-level="0" data-list="rows">
<tr data-level="1" data-list="columns">
<td>{{text}}</td>
<td data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -102,7 +102,41 @@
<div>{{export_button}}</div>
{{pagination_goes_here}}
<script>
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'thumb';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>
<style>
.universal-table-index.dtr-inline.collapsed td.dtr-control{

37
modules/universal_table/index3.html.erb
View File

@ -127,7 +127,7 @@
</thead>
<tbody data-level="0" data-list="rows">
<tr data-level="1" data-list="columns">
<td>{{text}}</td>
<td data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -150,4 +150,39 @@
// });
// $('.universal-table-index thead tr').prepend('<th></th>')
// $('.universal-table-index tbody tr').prepend('<td></td>')
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'thumb';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>

37
modules/universal_table/index4.html.erb
View File

@ -121,7 +121,7 @@
</thead>
<tbody data-level="0" data-list="rows">
<tr data-level="1" data-list="columns">
<td>{{text}}</td>
<td data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -144,4 +144,39 @@
// });
// $('.universal-table-index thead tr').prepend('<th></th>')
// $('.universal-table-index tbody tr').prepend('<td></td>')
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'thumb';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>

36
modules/universal_table/index5.html.erb
View File

@ -180,7 +180,7 @@
</thead>
<tbody data-level="0" data-list="rows">
<tr class="tdken" data-level="1" data-list="columns">
<td>{{text}}</td>
<td data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -210,5 +210,39 @@ $(document).ready(function(){
});
});
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'thumb';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>

36
modules/universal_table/show.html.erb
View File

@ -22,7 +22,7 @@
<tbody data-level="0" data-list="entry">
<tr>
<td class="col-sm-12 table-title">{{title}}</td>
<td class="col-sm-12 table-txt">{{text}}</td>
<td class="col-sm-12 table-txt" data-src="{{img_src}}" data-thumb="{{img_thumb}}" data-mobile="{{img_mobile}}">{{text}}</td>
</tr>
</tbody>
</table>
@ -92,5 +92,39 @@ $(document).ready(function () {
});
});
/**
* 圖片大小控制
* 'src' = 原圖
* 'thumb' = 縮圖 (200x200)
* 'mobile' = 行動版 (768px)
*/
const IMAGE_SIZE = 'src';
document.addEventListener('DOMContentLoaded', function() {
const cells = document.querySelectorAll('td[data-src]');
cells.forEach(cell => {
const imgSrc = cell.dataset[IMAGE_SIZE];
if (imgSrc && imgSrc !== '{{img_src}}' && imgSrc !== '{{img_thumb}}' && imgSrc !== '{{img_mobile}}') {
const oldImg = cell.querySelector('img');
if (oldImg) {
oldImg.remove();
}
const img = document.createElement('img');
img.className = 'image-preview';
img.alt = '圖片';
img.src = imgSrc;
cell.appendChild(img);
} else {
cell.removeAttribute('data-src');
cell.removeAttribute('data-thumb');
cell.removeAttribute('data-mobile'); }
});
});
</script>