fix video size
This commit is contained in:
hamid zarghami
@@ -83,7 +83,7 @@ const QuillEditor: FC<QuillEditorProps> = ({
|
||||
quillRef.current.insertEmbed(range.index, 'video', {
|
||||
url: embedUrl,
|
||||
width: '100%',
|
||||
height: '315'
|
||||
height: 'auto'
|
||||
})
|
||||
quillRef.current.setSelection(range.index + 1)
|
||||
} else {
|
||||
@@ -101,7 +101,7 @@ const QuillEditor: FC<QuillEditorProps> = ({
|
||||
quillRef.current.insertEmbed(range.index, 'video', {
|
||||
url: embedUrl,
|
||||
width: '100%',
|
||||
height: '315'
|
||||
height: 'auto'
|
||||
})
|
||||
quillRef.current.setSelection(range.index + 1)
|
||||
} else {
|
||||
@@ -143,10 +143,18 @@ const QuillEditor: FC<QuillEditorProps> = ({
|
||||
.ql-video-wrapper {
|
||||
margin: 1em 0;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
aspect-ratio: 16/9;
|
||||
}
|
||||
.ql-video-wrapper iframe {
|
||||
max-width: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
border: none;
|
||||
}
|
||||
`
|
||||
}} />
|
||||
|
||||
@@ -21,7 +21,7 @@ class VideoBlot extends BlockEmbed {
|
||||
const iframe = document.createElement("iframe");
|
||||
iframe.setAttribute("src", value.url);
|
||||
iframe.setAttribute("width", value.width || "100%");
|
||||
iframe.setAttribute("height", value.height || "315");
|
||||
iframe.setAttribute("height", value.height || "auto");
|
||||
iframe.setAttribute("frameborder", "0");
|
||||
iframe.setAttribute("allowfullscreen", "true");
|
||||
iframe.style.maxWidth = "100%";
|
||||
@@ -38,7 +38,7 @@ class VideoBlot extends BlockEmbed {
|
||||
return {
|
||||
url: iframe.getAttribute("src") || "",
|
||||
width: iframe.getAttribute("width") || "100%",
|
||||
height: iframe.getAttribute("height") || "315",
|
||||
height: iframe.getAttribute("height") || "auto",
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
+22
-1
@@ -162,7 +162,7 @@ tbody tr {
|
||||
|
||||
.ql-container {
|
||||
min-height: 200px !important;
|
||||
max-height: 500px;
|
||||
max-height: none;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@@ -170,3 +170,24 @@ tbody tr {
|
||||
position: relative !important;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
/* استایلهای مخصوص iframe ویدیو */
|
||||
.ql-video-wrapper {
|
||||
margin: 1em 0 !important;
|
||||
text-align: center !important;
|
||||
position: relative !important;
|
||||
width: 100% !important;
|
||||
aspect-ratio: 16/9 !important;
|
||||
min-height: 300px !important;
|
||||
}
|
||||
|
||||
.ql-video-wrapper iframe {
|
||||
position: absolute !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
border-radius: 8px !important;
|
||||
border: none !important;
|
||||
max-width: 100% !important;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import React, { useState } from "react";
|
||||
import {
|
||||
DocumentText,
|
||||
DocumentDownload,
|
||||
Refresh,
|
||||
Activity,
|
||||
InfoCircle
|
||||
@@ -26,7 +25,6 @@ const AccessLogsList: React.FC = () => {
|
||||
filters,
|
||||
updateFilters,
|
||||
resetFilters,
|
||||
exportLogs,
|
||||
refetch,
|
||||
} = useAccessLogs();
|
||||
|
||||
@@ -51,14 +49,6 @@ const AccessLogsList: React.FC = () => {
|
||||
updateFilters({ page });
|
||||
};
|
||||
|
||||
const handleExport = async () => {
|
||||
try {
|
||||
await exportLogs();
|
||||
} catch (error) {
|
||||
console.error("خطا در خروجی گرفتن:", error);
|
||||
}
|
||||
};
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div className="p-6">
|
||||
@@ -98,15 +88,6 @@ const AccessLogsList: React.FC = () => {
|
||||
<Refresh size={16} className={loading ? "animate-spin" : ""} />
|
||||
بروزرسانی
|
||||
</Button>
|
||||
|
||||
<Button
|
||||
onClick={handleExport}
|
||||
disabled={loading || !logs || logs.length === 0}
|
||||
className="flex items-center gap-2 border border-gray-300 bg-white text-gray-700 hover:bg-gray-50"
|
||||
>
|
||||
<DocumentDownload size={16} />
|
||||
خروجی CSV
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -8,10 +8,8 @@ import {
|
||||
AccessLogQuery,
|
||||
OperationType,
|
||||
UserType,
|
||||
HttpMethod,
|
||||
OperationTypeLabels,
|
||||
UserTypeLabels,
|
||||
HttpMethodLabels,
|
||||
} from "../types/AccessLogTypes";
|
||||
|
||||
interface FilterPanelProps {
|
||||
@@ -37,11 +35,6 @@ const FilterPanel: React.FC<FilterPanelProps> = ({
|
||||
label: UserTypeLabels[type],
|
||||
}));
|
||||
|
||||
const httpMethodOptions = Object.values(HttpMethod).map((method) => ({
|
||||
value: method,
|
||||
label: HttpMethodLabels[method],
|
||||
}));
|
||||
|
||||
const statusCodeOptions = [
|
||||
{ value: "200", label: "200 - موفق" },
|
||||
{ value: "201", label: "201 - ایجاد شده" },
|
||||
@@ -138,18 +131,7 @@ const FilterPanel: React.FC<FilterPanelProps> = ({
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* HTTP Method */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
متد HTTP
|
||||
</label>
|
||||
<Select
|
||||
items={[{ value: "", label: "همه" }, ...httpMethodOptions]}
|
||||
value={filters.httpMethod || ""}
|
||||
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => onFiltersChange({ httpMethod: e.target.value as HttpMethod })}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
{/* Status Code */}
|
||||
<div>
|
||||
@@ -164,18 +146,7 @@ const FilterPanel: React.FC<FilterPanelProps> = ({
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* IP Address */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
آدرس IP
|
||||
</label>
|
||||
<Input
|
||||
placeholder="192.168.1.1"
|
||||
value={filters.ipAddress || ""}
|
||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onFiltersChange({ ipAddress: e.target.value })}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
{/* User ID */}
|
||||
<div>
|
||||
@@ -214,37 +185,6 @@ const FilterPanel: React.FC<FilterPanelProps> = ({
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Min Execution Time */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
حداقل زمان اجرا (ms)
|
||||
</label>
|
||||
<Input
|
||||
type="number"
|
||||
placeholder="0"
|
||||
value={filters.minExecutionTime?.toString() || ""}
|
||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onFiltersChange({
|
||||
minExecutionTime: e.target.value ? parseInt(e.target.value) : undefined
|
||||
})}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Max Execution Time */}
|
||||
<div>
|
||||
<label className="block text-sm font-medium text-gray-700 mb-1">
|
||||
حداکثر زمان اجرا (ms)
|
||||
</label>
|
||||
<Input
|
||||
type="number"
|
||||
placeholder="1000"
|
||||
value={filters.maxExecutionTime?.toString() || ""}
|
||||
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onFiltersChange({
|
||||
maxExecutionTime: e.target.value ? parseInt(e.target.value) : undefined
|
||||
})}
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user