Tạo ứng dụng web từ Scratch bằng Python Flask và MySQL:Phần 4

Trong phần trước của loạt bài hướng dẫn này, chúng tôi đã triển khai chức năng cần thiết cho người dùng đã đăng nhập để thêm điều ước. Chúng tôi cũng đã biết cách hiển thị các mong muốn do người dùng nhập trên trang chủ của người dùng.

Trong phần này, chúng tôi sẽ triển khai chức năng chỉnh sửa và xóa các mong muốn do người dùng nhập.

Bắt đầu

Hãy bắt đầu bằng cách sao chép phần trước của hướng dẫn từ GitHub.

 git clone https://github.com/jay3dec/PythonFlaskMySQLApp_Part3.git

Khi mã nguồn đã được nhân bản, hãy điều hướng đến thư mục dự án và khởi động máy chủ web.

 cd PythonFlaskMySQLApp_Part3python app.py

Trỏ trình duyệt của bạn đến http:// localhost:5002 / và bạn sẽ có ứng dụng đang chạy.

Chỉnh sửa Danh sách mong muốn

Bước 1:Hiển thị Biểu tượng Chỉnh sửa

Chúng tôi đã liên kết dữ liệu nhận được bằng jQuery với HTML của chúng tôi. Chúng tôi sẽ sửa đổi mã đó và sử dụng các mẫu jQuery để giúp liên kết dữ liệu dễ dàng hơn. Chúng tôi cũng sẽ thêm một edit vào HTML của chúng tôi để cung cấp một cách cập nhật điều ước. Mở userHome.html và bao gồm tham chiếu đến các mẫu jQuery.

Xóa list-group hiện có div và thay thế nó bằng mã HTML sau:

Bên trong UL với lớp list-group chúng tôi sẽ ràng buộc dữ liệu của chúng tôi. Xác định một listTemplate như được hiển thị trong phần nội dung của HTML:

Sửa đổi jQuery Gọi lại thành công AJAX để liên kết dữ liệu với listTemplate .

Ngoài ra, hãy bao gồm một số kiểu trong userHome.html :

Lưu tất cả các thay đổi và khởi động lại máy chủ. Trỏ trình duyệt của bạn tới http:// localhost:5002 và đăng nhập bằng địa chỉ email và mật khẩu hợp lệ. Sau khi đăng nhập, bạn sẽ có thể nhìn thấy mong muốn do người dùng tạo.

Bước 2:Hiển thị Cửa sổ bật lên Chỉnh sửa

Chúng tôi sẽ sử dụng Bootstrap để hiển thị cửa sổ bật lên nhằm cung cấp giao diện để chỉnh sửa mong muốn. Bao gồm tham chiếu đến Bootstrap trong userHome.html .

Khi tham chiếu đã được đưa vào, hãy thêm HTML sau vào userHome.html .

       Cập nhật điều ước 
 
     Tiêu đề:  
   Mô tả:  </textareosystem </div>
 </form> </div>
 <div class =" modal-footer "> <button type =" button "class =" btn btn-default "data-allow =" modal "> Đóng </button> <button type =" button "id =" btnUpdate "class =" btn btn-primary "> Cập nhật </button> </div>
 </div>
 </div>
 </div>
 </pre> <p>
 HTML ở trên sẽ đóng vai trò là cửa sổ bật lên. Khi người dùng nhấp vào <code>edit</code> biểu tượng cửa sổ bật lên sẽ hiển thị. Chúng tôi đã thêm các thuộc tính <code>data-target</code> và <code>data-toggle</code> sẽ kích hoạt cửa sổ bật lên phương thức. </P> <pre> <a data-toggle="modal" data-target="#editModal"> <span class ="glyphicon glyphicon-pencil"> </span> </a>
 </pre> <p>
 Lưu các thay đổi trên và khởi động lại ứng dụng. Sau khi đăng nhập vào ứng dụng, hãy nhấp vào <code>edit</code> và bạn sẽ có thể xem cửa sổ bật lên. </P> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425316.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425316.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425483.png" /> <h3> Bước 3:Điền vào Cửa sổ bật lên Chỉnh sửa </h3> <p>
 Khi người dùng nhấp vào biểu tượng chỉnh sửa, chúng tôi sẽ hiển thị cửa sổ bật lên cập nhật với <code>title</code> và <code>description</code> cập nhật. Để bắt đầu, trước tiên chúng ta cần ID điều ước để tìm nạp các chi tiết điều ước cụ thể sau khi người dùng nhấp vào biểu tượng chỉnh sửa. Vì vậy, hãy sửa đổi mã mẫu jQuery để bao gồm một thuộc tính bổ sung <code>data-id</code> trên phần tử neo chỉnh sửa. </P> <pre> <a data-id=${Id} onclick="Edit(this)"> <span class ="glyphicon glyphicon-pencil"> </span> </a>
 </pre> <p>
 Chúng tôi cũng đã đính kèm một <code>onclick</code> sự kiện để gọi phương thức <code>Edit</code> . Bên trong chức năng Chỉnh sửa, chúng tôi sẽ thực hiện một cuộc gọi AJAX tới một phương thức python có tên là <code>getWishById</code> sẽ trả về chi tiết mong muốn. </P> <pre> function Edit (elm) {$ .ajax ({url:'/ getWishById', data:{id:$ (elm) .attr ('data-id')}, type:'POST', success:function (res) {console.log (res);}, error:function (error) {console.log (error);}});} </pre> <p>
 Tiếp theo, mở <code>app.py</code> và tạo một phương thức có tên là <code>getWishById</code> . Sử dụng phương pháp này, chúng tôi sẽ nhận được các chi tiết mong muốn cụ thể từ cơ sở dữ liệu. </P> <pre> @ app.route ('/ getWishById', method =['POST']) def getWishById ():try:if session.get ('user'):_id =request.form ['id'] _user =session.get ('user') conn =mysql.connect () cursor =conn.cursor () cursor.callproc ('sp_GetWishById', (_ id, _user)) result =cursor.fetchall () wish =[] wish.append ({'Id':result [0] [0], 'Title':result [0] [1], 'Description':result [0] [2]}) return json.dumps (wish) else:return render_template ('error.html', error ='Truy cập trái phép') ngoại trừ Ngoại lệ là e:return render_template ('error.html', error =str (e)) </pre> <p>
 Như bạn có thể thấy trong phương pháp trên, chúng tôi đã chuyển ID mong muốn vào phương thức này và nó lấy dữ liệu từ cơ sở dữ liệu bằng cách sử dụng <code>user ID</code> và <code>wish ID</code> . Khi dữ liệu đã được tìm nạp, nó sẽ chuyển đổi dữ liệu đó thành một danh sách và sau đó trả về dưới dạng <code>JSON</code> dữ liệu. </P> <p>
 Tiếp theo, hãy tạo thủ tục lưu trữ MySQL bắt buộc để tìm nạp dữ liệu từ cơ sở dữ liệu. </P> <pre> DELIMITER $$ CREATE DEFINER =`root` @` localhost` PROCEDURE `sp_GetWishById` (TRONG p_wish_id bigint, Trong p_user_id bigint) BEGINselect * từ tbl_wish trong đó wish_id =p_wish_id và wish_user_id =p_pre_id; END </user> <p>
 Đoạn mã được hiển thị ở trên là thủ tục được lưu trữ để nhận chi tiết điều ước cụ thể bằng cách sử dụng <code>wish ID</code> và <code>user ID</code> . </P> <p>
 Lưu các thay đổi và khởi động lại máy chủ. Sau khi đăng nhập vào ứng dụng, hãy nhấp vào <code>edit</code> biểu tượng và bạn sẽ có thông tin chi tiết được đăng nhập trong bảng điều khiển trình duyệt của mình. </P> <p>
 Để liên kết dữ liệu đã nhận với cửa sổ bật lên HTML, trước tiên hãy xóa <code>data-target</code> và <code>data-toggle</code> thuộc tính từ thẻ liên kết biểu tượng chỉnh sửa. Sau đó, thêm mã sau vào <code>Edit</code> Gọi lại thành công hàm JavaScript để điền cửa sổ bật lên và kích hoạt nó. </P> <pre> // Phân tích cú pháp dữ liệu chuỗi JSON đã nhận =JSON.parse (res); // Điền vào cửa sổ bật lên $ ('# editTitle'). val (data [0] ['Title']); $ ('# editDescription '). val (data [0] [' Description ']); // Kích hoạt Pop Up $ (' # editModal '). modal (); </pre> <p>
 Lưu các thay đổi và khởi động lại máy chủ. Sau khi đăng nhập vào ứng dụng, hãy thử nhấp vào biểu tượng chỉnh sửa và bạn sẽ có cửa sổ bật lên với tiêu đề và mô tả. </P> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425492.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425492.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425432.png" /> <h3> Bước 4:Cập nhật Chi tiết Điều ước </h3> <p>
 Để triển khai chức năng cập nhật, trước tiên hãy tạo một thủ tục được lưu trữ MySQL. </P> <pre> DELIMITER $$ CREATE DEFINER =`root` @` localhost` PROCEDURE `sp_updateWish` (IN p_title varchar (45), IN p_description varchar (1000), IN p_wish_id bigint, Trong p_user_id bigint) BEGINcập nhật tbl_wish set wish_title =p wish_description =p_description trong đó wish_id =p_wish_id và wish_user_id =p_user_id; HẾT $$ DELIMITER; </pre> <p>
 Như đã thấy trong quy trình được lưu trữ ở trên, chúng tôi sẽ chuyển vào <code>title</code> đã sửa đổi và <code>description</code> cùng với <code>ID</code> mong muốn và người dùng cập nhật thông tin chi tiết trong cơ sở dữ liệu. </P> <p>
 Tiếp theo, hãy tạo một phương thức mới có tên là <code>updateWish</code> để cập nhật thông tin chi tiết. Đây là <code>updateWish</code> phương pháp:</P> <pre> @ app.route ('/ updateWish', method =['POST']) def updateWish ():try:if session.get ('user'):_user =session.get ('user') _title =request.form ['title'] _description =request.form ['description'] _wish_id =request.form ['id'] conn =mysql.connect () cursor =conn.cursor () cursor.callproc ('sp_updateWish', (_title, _description, _wish_id, _user)) data =cursor.fetchall () if len (data) là 0:conn.commit () return json.dumps ({'status':'OK'}) else:return json. kết xuất ({'status':'ERROR'}) ngoại trừ Ngoại lệ là e:return json.dumps ({'status':'Truy cập trái phép'}) cuối cùng là:cursor.close () conn.close () </pre> <p>
 Như đã thấy trong đoạn mã trên, sau khi xác thực phiên hợp lệ, chúng tôi đã thu thập dữ liệu đã đăng và gọi thủ tục được lưu trữ <code>sp_updateWish</code> để cập nhật thông tin chi tiết. </P> <p>
 Để gọi <code>updateWish</code> , chúng tôi cần đính kèm một sự kiện trên <code>Update</code> bấm vào nút. Vì vậy, hãy đặt tên cho nút cập nhật là <code>btnUpdate</code> và đính kèm <code>onclick</code> sự kiện như hình:</P> <pre> $ ('# btnUpdate'). click (function () {$ .ajax ({url:'/ updateWish', data:{title:$ ('# editTitle'). val (), description:$ ( '#editDescription'). val (), id:localStorage.getItem ('editId')}, gõ:'POST', thành công:function (res) {$ ('# editModal'). modal ('hide'); // Điền lại lưới}, error:function (error) {console.log (error);}})}); </pre> <p>
 Như đã thấy trong đoạn mã trên, chúng tôi đã thu thập <code>editId</code> từ <code>localStorage</code> , vì vậy bên trong <code>Edit</code> hàm lưu <code>ID</code> vào <code>localStorage</code> . </P> <pre> localStorage.setItem ('editId', $ (elm) .attr ('data-id')); </pre> <p>
 Kết thúc <code>getWish</code> Lệnh gọi AJAX vào một hàm để chúng tôi có thể gọi lại hàm đó sau khi dữ liệu đã được cập nhật. </P> <pre> function GetWished () {$ .ajax ({url:'/ getWish', type:'GET', Success:function (res) {var wishObj =JSON.parse (res); $ ('# ulist') .empty (); $ ('# listTemplate'). tmpl (wishObj) .appendTo ('# ulist');}, error:function (error) {console.log (error);}});} </pre> <p>
 Gọi cho <code>GetWishes</code> trong lệnh gọi lại thành công của <code>update</code> Cuộc gọi AJAX. </P> <pre> $ ('# btnUpdate'). click (function () {$ .ajax ({url:'/ updateWish', data:{title:$ ('# editTitle'). val (), description:$ ( '#editDescription'). val (), id:localStorage.getItem ('editId')}, gõ:'POST', thành công:function (res) {$ ('# editModal'). modal ('hide'); // Điền lại lưới GetWished ();}, error:function (error) {console.log (error);}})}); </pre> <p>
 Lưu tất cả các thay đổi và khởi động lại máy chủ. Sau khi đăng nhập vào ứng dụng, hãy thử chỉnh sửa các mong muốn có sẵn do người dùng tạo. </P> <h2> Xóa điều ước </h2> <h3> Bước 1:Hiển thị Cửa sổ bật lên Xác nhận </h3> <p>
 Thêm mã HTML sau vào <code>userHome.html</code> . </P> <pre> <div class ="modal fade" id ="deleteModal" tabindex ="- 1" role ="hộp thoại" aria-labellingby ="deleteModalLabel" aria-hidden ="true"> <div class ="modal-hộp thoại "> <div class =" modal-content "> <div class =" modal-header "style =" text-align:center; "> <h4 class =" modal-title "style =" color:red; " id ="deleteModalLabel"> Bạn sẽ Xóa dữ liệu này vĩnh viễn !! </h4> </div>
 <div class ="modal-footer"> <button type ="button" class ="btn btn-default" data- bác bỏ ="modal"> Hủy </button> <button type ="button" class ="btn btn-primary"> Xóa </button> </div>
 </div>
 </div>
 </div>
 </trước> <p>
 Thêm biểu tượng xóa bên trong <code>listTemplate</code> bằng cách thêm HTML sau:</P> <pre> <a data-id=${Id} onclick="ConfirmDelete(this)"> <span class ="glyphicon glyphicon-dirty"> </span> </a>
 </pre> <p>
 Khi nhấp vào biểu tượng xóa ở trên, chúng tôi sẽ gọi một hàm JavaScript có tên là <code>ConfirmDelete</code> nơi chúng tôi sẽ kích hoạt cửa sổ bật lên xác nhận. </P> <pre> function ConfirmDelete (elem) {localStorage.setItem ('deleteId', $ (elem) .attr ('data-id')); $ ('# deleteModal'). modal ();} </pre> <p>
 Lưu các thay đổi và khởi động lại máy chủ. Sau khi đăng nhập, hãy nhấp vào biểu tượng xóa trong danh sách mong muốn và bạn sẽ có thể thấy cửa sổ bật lên xác nhận. </P> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425448.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425448.png" /> <img src="http://www.sqldat.com/article/uploadfiles/202205/2022051217425468.png" /> <h3> Bước 2:Xóa điều ước </h3> <p>
 Để triển khai chức năng Xóa mong muốn, trước tiên hãy tạo thủ tục được lưu trữ trong MySQL để xóa. </P> <pre> DELIMITER $$ SỬ DỤNG `BucketList` $$ TẠO THỦ TỤC` sp_deleteWish` (TRONG p_wish_id bigint, IN p_user_id bigint) BEGINxóa khỏi tbl_wish nơi wish_id =p_wish_id và wish_user_id =p_user_id; END $$ DELIMITER; </<p>
 Quy trình trên lấy ID mong muốn và ID người dùng và xóa điều ước tương ứng khỏi cơ sở dữ liệu. </P> <p>
 Tiếp theo, hãy tạo một phương thức bên trong <code>app.py</code> để gọi thủ tục <code>sp_deleteWish</code> . </P> <p>
 Chúng tôi sẽ tạo một phương thức có tên là <code>deleteWish</code> để xóa điều ước. </P> <pre> @ app.route ('/ deleteWish', method =['POST']) def deleteWish ():try:if session.get ('user'):_id =request.form ['id'] _user =session.get ('user') conn =mysql.connect () cursor =conn.cursor () cursor.callproc ('sp_deleteWish', (_ id, _user)) result =cursor.fetchall () nếu len (kết quả) là 0 :conn.commit () return json.dumps ({'status':'OK'}) else:return json.dumps ({'status':'An Lỗi xảy ra'}) else:return render_template ('error.html' , error ='Truy cập trái phép') ngoại trừ Ngoại lệ là e:return json.dumps ({'status':str (e)}) cuối cùng:cursor.close () conn.close () </pre> <p>
 Trong phương pháp trên, chúng tôi đã xác thực phiên đầu tiên. Khi chúng tôi đã xác thực phiên người dùng, sử dụng ID mong muốn và ID người dùng, chúng tôi đã gọi thủ tục được lưu trữ <code>sp_deleteWish</code> . </P> <p>
 Để gọi phương thức trên <code>deleteWish</code> , thêm một <code>onclick</code> vào nút Xóa trong cửa sổ bật lên xác nhận xóa. </P> <pre> <button type ="button" class ="btn btn-primary" onclick ="Delete ()"> Xóa </button> </pre> <p>
 Tạo một hàm JavaScript được gọi là <code>Delete</code> và bên trong Delete thực hiện cuộc gọi AJAX tới phương thức python <code>deleteWish</code> . </P> <pre> function Delete () {$ .ajax ({url:'/ deleteWish', data:{id:localStorage.getItem ('deleteId')}, gõ:'POST', thành công:function (res) {var result =JSON.parse (res); if (result.status =='OK') {$ ('# deleteModal'). Modal ('hide'); GetWished ();} else {alert (result.status);} }, error:function (error) {console.log (error);}});} </pre> <p>
 Khi gọi lại thành công <code>Delete</code> ở trên chức năng, chúng tôi sẽ kiểm tra trạng thái được trả về và nếu ổn, chúng tôi sẽ ẩn cửa sổ bật lên của phương thức và tải lại các mong muốn. </P> <p>
 Lưu các thay đổi và khởi động lại máy chủ. Sau khi đăng nhập vào ứng dụng, hãy thử xóa điều ước khỏi trang chủ của người dùng. </P> <br>
                </section>
            </article>

            <section id="turn-page" class="vicensefg">
                <div class="page up fviflexalign">
                    <i class="prev"></i>
                    <a class='LinkPrevArticle' href='http://vi.sqldat.com/zxs/qol/1013018557.html' >Tạo ứng dụng web từ Scratch bằng Python Flask và MySQL:Phần 5 </a>         
                </div>
                <div class="page down fviflexalign">
                    <a class='LinkNextArticle' href='http://vi.sqldat.com/zxs/qol/1013018559.html'  >Tạo ứng dụng web từ Scratch bằng Python Flask và MySQL:Phần 3 </a>    
                    <i class="next"></i>
                </div>
             </section>

             <div class="ad5">

<script language='javascript' src='http://www.sqldat.com/css/ad/8.js'></script>


             </div>

        

        </section>


        

    </section>




    <section class="bottom viwcontainer aviwflexbetween">

        <section class="vitype_list right"> 

            <ol>
               <li><a class='childclass' href='http://vi.sqldat.com/zxs/sqe/' target="_self">Database</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/qol/' target="_self">Mysql</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/aye/' target="_self">Oracle</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/ywr/' target="_self">Sqlserver</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/cal/' target="_self">PostgreSQL</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/nks/' target="_self">Access</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/kie/' target="_self">SQLite</a></li>  <li><a class='childclass' href='http://vi.sqldat.com/zxs/vtb/' target="_self">MariaDB</a></li>
             </ol>

        </section>

        <section class="left">
            <ol class="viarticle_list">

	 <li class="flexstartvit">
                    <i></i>
                    <a href="https://vi.sqldat.com/zxs/qol/1013002283.html">
                        <p class="vitextover" title="Làm cách nào để có được số hàng trong bảng MySQL bằng PHP? ">Làm cách nào để có được số hàng trong bảng MySQL bằng PHP? </p>
                    </a>
                </li>
 <li class="flexstartvit">
                    <i></i>
                    <a href="https://vi.sqldat.com/zxs/qol/1013002874.html">
                        <p class="vitextover" title="SQL:Tạo một bảng quan hệ với 2 auto_increment khác nhau ">SQL:Tạo một bảng quan hệ với 2 auto_increment khác nhau </p>
                    </a>
                </li>
 <li class="flexstartvit">
                    <i></i>
                    <a href="https://vi.sqldat.com/zxs/qol/1013002131.html">
                        <p class="vitextover" title="PHP PDO:bộ ký tự, đặt tên? ">PHP PDO:bộ ký tự, đặt tên? </p>
                    </a>
                </li>
 <li class="flexstartvit">
                    <i></i>
                    <a href="https://vi.sqldat.com/zxs/qol/1013000613.html">
                        <p class="vitextover" title="Cách cài đặt MySQL 8.0 trên CentOS 8 / RHEL 8 ">Cách cài đặt MySQL 8.0 trên CentOS 8 / RHEL 8 </p>
                    </a>
                </li>
 <li class="flexstartvit">
                    <i></i>
                    <a href="https://vi.sqldat.com/zxs/qol/1013003077.html">
                        <p class="vitextover" title="Khi nào sử dụng STRAIGHT_JOIN với MySQL ">Khi nào sử dụng STRAIGHT_JOIN với MySQL </p>
                    </a>
                </li>
               
              



            </ol>
        </section>




    </section>

    <ul class="bbyeowrvhul85">

        <li class="bgyreogd13"></li>
    </ul>
    <section class="vilist1 vitarticle1_list vitbottom2 aviwflexbetween viwcontainer">
              
	
    
    <ul class="aviwflexbetween">
            <li>
                <section class="fviflexalign">
                    <div class="colviibox">
                        <img  src='http://www.sqldat.com/article/uploadfiles/202205/2022051310480799.png'  width='300' height='220' border='0'>
                    </div>
                    <a href="https://vi.sqldat.com/zxs/nks/1013018770.html">
                        <p class="row cvirow-3">
                           Bốn lầm tưởng phổ biến về công nghệ đám mây     
                        
                        <strong class="yeowngstew"></strong></p>
                    </a>
                </section>
            </li>
        </ul>

    
    <ul class="aviwflexbetween">
            <li>
                <section class="fviflexalign">
                    <div class="colviibox">
                        <img  src='http://www.sqldat.com/article/uploadfiles/202205/2022051118031798.png'  width='300' height='220' border='0'>
                    </div>
                    <a href="https://vi.sqldat.com/zxs/qol/1013014189.html">
                        <p class="row cvirow-3">
                           Cách xem trạng thái và biến hệ thống trong MySQL Workbench bằng GUI     
                        
                        <strong class="yeowngstew"></strong></p>
                    </a>
                </section>
            </li>
        </ul>

    
    <ul class="aviwflexbetween">
            <li>
                <section class="fviflexalign">
                    <div class="colviibox">
                        <img  src='http://www.sqldat.com/article/uploadfiles/202205/2022051117330517_S.png'  width='300' height='220' border='0'>
                    </div>
                    <a href="https://vi.sqldat.com/zxs/sqe/1013013783.html">
                        <p class="row cvirow-3">
                           Nhiệm vụ không đồng bộ với Django và Celery     
                        
                        <strong class="yeowngstew"></strong></p>
                    </a>
                </section>
            </li>
        </ul>

    
    <ul class="aviwflexbetween">
            <li>
                <section class="fviflexalign">
                    <div class="colviibox">
                        <img  src='http://www.sqldat.com/article/uploadfiles/202205/2022051214482295_S.jpg'  width='300' height='220' border='0'>
                    </div>
                    <a href="https://vi.sqldat.com/zxs/cal/1013016999.html">
                        <p class="row cvirow-3">
                           Cách quản lý cơ sở dữ liệu PostgreSQL của bạn từ CLI ClusterControl     
                        
                        <strong class="yeowngstew"></strong></p>
                    </a>
                </section>
            </li>
        </ul>




    </section>


    


    <footer>
        <section class="viwcontainer aviwflexbetween vifooter_info fviflexalign">
            <a href="https://vi.sqldat.com" class="vibottom_logo">
                <img src="http://www.sqldat.com/css/img/logo.svg" alt="">
            </a>

            <span class="flexstartvit">
               © BẢN QUYỀN
                <a href="https://vi.sqldat.com">http://vi.sqldat.com</a>
                ĐÃ ĐĂNG KÝ BẢN QUYỀN
            </span>
           
        </section>


    </footer>

    <script language='javascript' src='http://www.sqldat.com/css/ad/c.js'></script>
</body>

</html>