0.0.250
This commit is contained in:
@@ -666,6 +666,30 @@
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
/*file classes*/
|
||||
|
||||
.file_border_cont{
|
||||
padding: 5%;
|
||||
width: 95%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.left_part_file_w{
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right_part_file_w{
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
color: #FFFFFF;
|
||||
font-size: 14px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
/*end*/
|
||||
|
||||
.container_text_message.left{
|
||||
border: 1px solid #FF613A;
|
||||
background: #FFFFFF;
|
||||
|
||||
1
static/img/svg/download_file.svg
Normal file
1
static/img/svg/download_file.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" fill="#FFF"><!--! Font Awesome Pro 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M64 0C28.7 0 0 28.7 0 64V448c0 35.3 28.7 64 64 64H320c35.3 0 64-28.7 64-64V160H256c-17.7 0-32-14.3-32-32V0H64zM256 0V128H384L256 0zM216 232V334.1l31-31c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9l-72 72c-9.4 9.4-24.6 9.4-33.9 0l-72-72c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l31 31V232c0-13.3 10.7-24 24-24s24 10.7 24 24z"/></svg>
|
||||
|
After Width: | Height: | Size: 577 B |
@@ -117,23 +117,104 @@ function countLetters () {
|
||||
//
|
||||
// }
|
||||
|
||||
function attachFilemeassge (el,id_ticket=null,sender,receiver){
|
||||
let file = el.files[0];
|
||||
|
||||
let reader = new FileReader();
|
||||
// function getBase64(file,el) {
|
||||
// const reader = new FileReader()
|
||||
// let file_new = null
|
||||
// let file_new_p = new Promise(function () {
|
||||
// reader.readAsDataURL(file)
|
||||
// reader.onload = function () {
|
||||
// file_new = JSON.stringify({
|
||||
// 'file': reader.result,
|
||||
// 'file_type': el.type,
|
||||
// 'file_name': el.name
|
||||
// })
|
||||
//
|
||||
// }
|
||||
//
|
||||
// })
|
||||
// file_new_p.then(function (){
|
||||
// return file_new
|
||||
// })
|
||||
// }
|
||||
//
|
||||
// async function fileListToBase64(fileList) {
|
||||
// const files_for_data = []
|
||||
//
|
||||
// for (let i = 0; i < fileList.length; i++) {
|
||||
// let el = fileList[i]
|
||||
// files_for_data.push(getBase64(fileList[i],el))
|
||||
// }
|
||||
//
|
||||
// return await Promise.all(files_for_data)
|
||||
// }
|
||||
function getBase64(file,el) {
|
||||
const reader = new FileReader()
|
||||
return new Promise(resolve => {
|
||||
reader.onload = ev => {
|
||||
resolve(file_new = JSON.stringify({
|
||||
'file': reader.result,
|
||||
'file_type': el.type,
|
||||
'file_name': el.name
|
||||
})
|
||||
)
|
||||
}
|
||||
reader.readAsDataURL(file)
|
||||
})
|
||||
}
|
||||
|
||||
async function fileListToBase64(fileList) {
|
||||
// create function which return resolved promise
|
||||
// with data:base64 string
|
||||
|
||||
// here will be array of promisified functions
|
||||
const promises = []
|
||||
// loop through fileList with for loop
|
||||
for (let i = 0; i < fileList.length; i++) {
|
||||
let el = fileList[i]
|
||||
promises.push(getBase64(fileList[i],el))
|
||||
}
|
||||
// array with base64 strings
|
||||
return await Promise.all(promises)
|
||||
}
|
||||
|
||||
async function attachFilemeassge (el,id_ticket=null,sender,receiver){
|
||||
// let file = el.files[0];
|
||||
let fileList = el.files;
|
||||
const files_for_data = await fileListToBase64(fileList)
|
||||
let data = files_for_data
|
||||
sendMessage(id_ticket,sender,receiver,data)
|
||||
// let reader = new FileReader();
|
||||
// let mas_for_for_each = []
|
||||
|
||||
// for (let i = 0;i < el.files.length;i++){
|
||||
// let file_for_data_url_opert = el.files[i]
|
||||
//
|
||||
// reader.readAsDataURL(file_for_data_url_opert);
|
||||
// reader.onload = function() {
|
||||
// // console.log(reader.result);
|
||||
// let file = JSON.stringify({
|
||||
// 'file': reader.result,
|
||||
// 'file_type': el.files[i].type,
|
||||
// 'file_name': el.files[i].name
|
||||
// })
|
||||
// files_for_data.push(file)
|
||||
// };
|
||||
//
|
||||
// reader.onerror = function() {
|
||||
// console.log(reader.error);
|
||||
// };
|
||||
//
|
||||
// }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
|
||||
|
||||
reader.onload = function() {
|
||||
// console.log(reader.result);
|
||||
let data = reader.result
|
||||
sendMessage(id_ticket,sender,receiver,data,file)
|
||||
};
|
||||
|
||||
reader.onerror = function() {
|
||||
console.log(reader.error);
|
||||
};
|
||||
|
||||
|
||||
}
|
||||
@@ -212,9 +293,9 @@ function selectedUserMessenger (ticket_id=null,user_id=null){
|
||||
}
|
||||
|
||||
|
||||
function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){
|
||||
function sendMessage(id_ticket=null,sender,receiver,files=null){
|
||||
// import {sendMessageSocket} from "./chat_sockets";
|
||||
if (!img_post){
|
||||
if (!files){
|
||||
event.preventDefault()
|
||||
}
|
||||
let text = document.querySelector(".enter-message-inp").value
|
||||
@@ -222,7 +303,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){
|
||||
let img = document.querySelector(".attach-file-btn-message").dataset["file_img"]
|
||||
|
||||
|
||||
if (img_post){
|
||||
if (files){
|
||||
|
||||
let data = {}
|
||||
if (id_ticket === null){
|
||||
@@ -230,11 +311,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){
|
||||
'sender': sender,
|
||||
'receiver': receiver,
|
||||
'text': '',
|
||||
'file': JSON.stringify({
|
||||
'file': img_post,
|
||||
'file_type': file.type,
|
||||
'file_name': file.name
|
||||
})
|
||||
'files': files
|
||||
}
|
||||
} else {
|
||||
data = {
|
||||
@@ -242,11 +319,7 @@ function sendMessage(id_ticket=null,sender,receiver,img_post=null,file=null){
|
||||
'sender': sender,
|
||||
'receiver': receiver,
|
||||
'text': '',
|
||||
'file': JSON.stringify({
|
||||
'file': img_post,
|
||||
'file_type': file.type,
|
||||
'file_name': file.name
|
||||
})
|
||||
'files': files
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -62,7 +62,7 @@
|
||||
</div>
|
||||
<div class="right-part-block-enter-message">
|
||||
{# <button class="attach-file-btn-message" onclick="attachFilemeassge(event,this,null,{{ user.id }},{{ cur_receiver.id }})"></button>#}
|
||||
<input style="display: none;" type="file" onchange="attachFilemeassge(this,null,{{ user.id }},{{ cur_receiver.id }})" id="id_choce_file">
|
||||
<input style="display: none;" type="file" onchange="attachFilemeassge(this,null,{{ user.id }},{{ cur_receiver.id }})" id="id_choce_file" multiple>
|
||||
<label for="id_choce_file" class="attach-file-btn-message"></label>
|
||||
<button class="send-message" onclick="sendMessage(null,{{ user.id }},{{ cur_receiver.id }})"></button>
|
||||
{# <button class="send-message" onclick="send_ws_msg('message')"></button>#}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{% load static %}
|
||||
|
||||
|
||||
|
||||
{% include "widgets/w_file.html" %}
|
||||
{% if not messages and ticket %}
|
||||
{% include "widgets/w_message.html" %}
|
||||
{% else %}
|
||||
|
||||
27
templates/widgets/w_file.html
Normal file
27
templates/widgets/w_file.html
Normal file
@@ -0,0 +1,27 @@
|
||||
{% load static %}
|
||||
{% load tt_chat %}
|
||||
|
||||
<div style="width: 100%;">
|
||||
<div class="container-message_support_chat {% get_msg_side user ticket msg %}">
|
||||
<div class="block_avatar_message {% get_msg_side user ticket msg %}">
|
||||
<img src="{% static "delete_later/Avatar.png" %}">
|
||||
</div>
|
||||
<div class="block_text_message {% get_msg_side user ticket msg %}">
|
||||
<div class="container_text_message {% get_msg_side user ticket msg %}">
|
||||
<div class="file_border_cont">
|
||||
<div class="left_part_file_w">
|
||||
<a href="{% static "/img/svg/loader.svg" %}" download><img src="{% static "/img/svg/download_file.svg" %}" style="height:35px"></a>
|
||||
</div>
|
||||
<div class="right_part_file_w">
|
||||
<div>фывыфв</div>
|
||||
<div>1234 кб</div>
|
||||
</div>
|
||||
<div class="clear_both"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="data_send_message {% get_msg_side user ticket msg %}">
|
||||
<span>{% if msg %}{{ msg.modifiedDT }}{% else %}{{ ticket.modifiedDT }}{% endif %}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user