12.2

src/main/index.js

@@ -21,7 +21,7 @@ function createWindow() {
   })
   mainWindow.on('ready-to-show', () => {
     mainWindow.show()
-    mainWindow.webContents.openDevTools()
+    // mainWindow.webContents.openDevTools()
   })
   mainWindow.webContents.setWindowOpenHandler((details) => {
     shell.openExternal(details.url)
@@ -62,7 +62,7 @@ app.whenReady().then(() => {
     let errorList = []
     for (let index = 0; index < pathList.length; index++) {
       let element = pathList[index];
-      let folderPath = path.join("E:\\test\\", element);
+      let folderPath = path.join("D:\\test\\", element);
       try {
         fs.mkdirSync(`${folderPath}\\`, { recursive: true });
         successList.push(element)
@@ -78,8 +78,8 @@ app.whenReady().then(() => {
     // 获取应用程序的用户数据目录
     let successList = []
     let errorList = []
-    let oldfolderPath = path.join("E:\\test\\", pathObj.oldPath);
+    let oldfolderPath = path.join("D:\\test\\", pathObj.oldPath);
-    let newfolderPath = path.join("E:\\test\\", pathObj.newPath);
+    let newfolderPath = path.join("D:\\test\\", pathObj.newPath);
     try {
       fs.rename(`${oldfolderPath}\\`, `${newfolderPath}\\`, error => {
         if (error) {
@@ -98,7 +98,7 @@ app.whenReady().then(() => {
     // 获取应用程序的用户数据目录
     let successList = []
     let errorList = []
-    let folderPath = path.join("E:\\test\\", pathObj.name);
+    let folderPath = path.join("D:\\test\\", pathObj.name);
     fs.rm(folderPath, { recursive: true, force: true }, function (err) {
       if (err) {
         errorList.push(pathObj)
@@ -116,7 +116,7 @@ app.whenReady().then(() => {
     let errorList = []
     for (let index = 0; index < pathList.length; index++) {
       let element = pathList[index];
-      let destinationFilePath = path.join("E:\\test\\", element.path);
+      let destinationFilePath = path.join("D:\\test\\", element.path);
       let sourceFilePath = element.prePath;
       try {
         fs.copyFileSync(sourceFilePath, destinationFilePath);
@@ -139,12 +139,12 @@ app.whenReady().then(() => {
   })
   // 打开文件
   ipcMain.on('openFile', (e, pathStr) => {
-    let filePath = path.join("E:\\test\\", pathStr);
+    let filePath = path.join("D:\\test\\", pathStr.replace("D:\\test\\", ""));
     shell.openPath(filePath)
   })
   // 下载文件
   ipcMain.on('downloadFile', (e, pathStr) => {
-    let filePath = path.join("E:\\test\\", pathStr);
+    let filePath = path.join("D:\\test\\", pathStr);
     // 读取文件后传给前端
     fs.readFile(filePath, function (err, data) {
       if (err) {
@@ -155,6 +155,41 @@ app.whenReady().then(() => {
       }
     });
   });
+  // 批量导入
+  ipcMain.on('inputDataList', (e, paramsStr) => {
+    let { pathList, tableList } = JSON.parse(paramsStr)
+    // 获取应用程序的用户数据目录
+    let successFolderList = []
+    let errorFolderList = []
+    for (let index = 0; index < pathList.length; index++) {
+      let element = pathList[index];
+      let folderPath = path.join("D:\\test\\", element);
+      try {
+        fs.mkdirSync(`${folderPath}\\`, { recursive: true });
+        successFolderList.push(element)
+      } catch (error) {
+        errorFolderList.push(element)
+      }
+    }
+    // 获取应用程序的用户数据目录
+    let successFileList = []
+    let errorFileList = []
+    for (let index = 0; index < tableList.length; index++) {
+      let element = tableList[index];
+      let destinationFilePath = path.join("D:\\test\\", element.path.replace("D:\\test\\", ""));
+      let sourceFilePath = element.prePath;
+      // 读取文件大小
+      let fileSize = fs.statSync(sourceFilePath).size;
+      element.size = fileSize
+      try {
+        fs.copyFileSync(sourceFilePath, destinationFilePath);
+        successFileList.push(element)
+      } catch (error) {
+        errorFileList.push(element)
+      }
+    }
+    mainWindow.webContents.send(`inputDataListResult`, JSON.stringify({ successFolderList, errorFolderList, successFileList, errorFileList }))
+  })
 })
 app.commandLine.appendSwitch('autoplay-policy', 'no-user-gesture-required');
 // Quit when all windows are closed, except on macOS. There, it's common

src/renderer/src/assets/js/db.js

@@ -4,6 +4,6 @@ export const myDatabase = new Dexie('myDatabase');
 
 // 定义数据库版本
 myDatabase.version(1).stores({
-  treeList: '++id, label, currentId, path, status, preId, delete, fileList, prepreId, level, note, create_at, update_at',
+  treeList: '++id, label, currentId, &path, status, preId, delete, fileList, prepreId, level, note, create_at, update_at',
-  fileList: '++id, treeId, xiangmuName, juanName, fileName, fileType, uploadTime, status, path, note, create_at, update_at'
+  fileList: '++id, treeId, xiangmuName, juanName, fileName, fileType, uploadTime, status, &path, note, create_at, update_at'
 });

src/renderer/src/assets/json/file.json

@@ -102,8 +102,8 @@
         "label": "正常"
       },
       {
-        "value": "注销",
+        "value": "已注销",
-        "label": "注销"
+        "label": "已注销"
       }
     ],
     "tableShow": true,

src/renderer/src/components/treecomponent.vue

@@ -76,13 +76,12 @@ export default {
     return {
       _: _,
       dayjs: dayjs,
-      textLength: 20,
+      textLength: 14,
       nodeClickId: ""
     }
   },
   methods: {
     nodeClick(node) {
-      console.log(84, node);
       this.nodeClickId = node.id
       this.$emit("nodeClick", node)
     },

src/renderer/src/views/dangan.vue

@@ -67,12 +67,12 @@
                 <span>新增文件</span>
               </el-button>
             </el-col>
-            <el-col :span="10">
+            <el-col :span="9">
               <el-input v-model="wenjianObj.wenjianName" style="width: 100%;" placeholder="请输入文件名" clearable>
                 <template #prepend>文件名：</template>
               </el-input>
             </el-col>
-            <el-col :span="8">
+            <el-col :span="9" style="position: relative;top:-3px;">
               <el-button type="primary" @click="searchTable">
                 <el-icon>
                   <Search />
@@ -85,6 +85,17 @@
                 </el-icon>
                 <span>重置</span>
               </el-button>
+              <div class="inputClass uploadClass">
+                <el-upload :show-file-list="false" v-model="fileOriData" :before-upload="beforeAvatarUpload"
+                  :http-request="successSubmit" accept=".xls,.xlsx,.csv">
+                  <el-button type="success">
+                    <el-icon>
+                      <Upload />
+                    </el-icon>
+                    <span>导入历史数据</span>
+                  </el-button>
+                </el-upload>
+              </div>
             </el-col>
           </el-row>
         </div>
@@ -126,6 +137,7 @@ import { v5 } from "uuid";
 import tableHeaderLocal from '../assets/json/file.json'
 import { myDatabase } from '../assets/js/db.js'
 import dayjs from 'dayjs'
+import * as XLSX from 'xlsx';
 import tablecomponent from "../components/tablecomponent.vue"
 import treecomponent from "../components/treecomponent.vue"
 import formcomponent from "../components/formcomponent.vue"
@@ -211,10 +223,10 @@ export default {
           value: "正常"
         },
         {
-          label: "注销",
+          label: "已注销",
           color: "#f56c6c",
           class: "unregisterClass",
-          value: "注销"
+          value: "已注销"
         },
       ],
       level1: [],
@@ -252,9 +264,174 @@ export default {
       preNodeTemp: {},
       treeLoading: false,
       tableLoading: false,
+      deleteXiangmuIdList: [],
+      deleteFileIdList: [],
+      fileOriData: "",
+      inputTreeList: [],
+      inputPathList: [],
+      inputTableList: []
+
     }
   },
   methods: {
+    /**
+      * 上传表格检查
+      */
+    beforeAvatarUpload(rawFile) {
+      let imgList = ['text/csv', 'application/vnd.ms-excel', "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"]
+      if (imgList.indexOf(rawFile.type) === -1) {
+        this.$msgbox.alert('请上传excel,csv格式的表格文件!')
+        return false
+      } else if (rawFile.size / 1024 / 1024 > 50) {
+        this.$msgbox.alert('表格文件的大小为小于50MB,数据过多时会处理过慢')
+        return true
+      }
+      return true
+    },
+    //表格增加数据
+    async successSubmit(opts) {
+      let that = this
+      let file = opts.file
+      this.fileDealData = []
+      let fileReader = new FileReader()
+      fileReader.onload = async function () {
+        let data = this.result
+        let workbook = XLSX.read(data, { type: 'binary' })
+        let sheetName = workbook.SheetNames[0]
+        let sheetData = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName])
+        let xiangmuObj = _.groupBy(sheetData, "项目名")
+        let excludeList = ["123123", "test2222", "主卷"]
+        let xiangmuList = []
+        for (let key in xiangmuObj) {
+          if (key && !excludeList.includes(key)) {
+            xiangmuList.push(key)
+          }
+        }
+        let { pathList, treeList } = that.bulkAddXiangmu(xiangmuList)
+        let { tableList, successList } = that.bulkAddFile(treeList, sheetData)
+        that.inputTreeList = _.cloneDeep(treeList)
+        that.inputTableList = _.cloneDeep(tableList)
+        that.inputPathList = _.cloneDeep(pathList)
+        that.inputData(treeList, pathList, tableList)
+      }
+      fileReader.onerror = function (error) {
+        ElMessage({
+          message: `Error reading file:, ${error}`,
+          type: 'error',
+        })
+      }
+      fileReader.readAsArrayBuffer(file)
+    },
+    // 批量新增项目
+    bulkAddXiangmu(nameList) {
+      let treeList = []
+      let pathList = []
+      for (let i = 0; i < nameList.length; i++) {
+        let xianmguName = nameList[i];
+        let firstId = v5(xianmguName, this.uuidNameSpace)
+        for (let i = 0; i < this.level2.length; i++) {
+          let level2Item = this.level2[i];
+          let level2Str = `${xianmguName}${level2Item}`
+          let level2uuid = v5(level2Str, this.uuidNameSpace)
+          for (let j = 0; j < this.level3[level2Item].length; j++) {
+            let level3Item = this.level3[level2Item][j];
+            let level3Str = `${xianmguName}${level2Item}${level3Item}`
+            let level3uuid = v5(level3Str, this.uuidNameSpace)
+            treeList.push({
+              label: level3Item,
+              currentId: level3uuid,
+              path: `${xianmguName}\\${level2Item}\\${level3Item}`,
+              delete: false,
+              preId: level2uuid,
+              prepreId: firstId,
+              level: 3,
+              create_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+              update_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+            })
+            pathList.push(`${xianmguName}\\${level2Item}\\${level3Item}`)
+          }
+          treeList.push({
+            label: level2Item,
+            currentId: level2uuid,
+            path: `${xianmguName}\\${level2Item}`,
+            delete: false,
+            preId: firstId,
+            prepreId: "",
+            level: 2,
+            create_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+            update_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+          })
+        }
+        treeList.push({
+          label: xianmguName,
+          currentId: firstId,
+          path: `${xianmguName}`,
+          delete: false,
+          preId: "",
+          prepreId: "",
+          level: 1,
+          create_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+          update_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+        })
+      }
+      return { pathList, treeList }
+    },
+
+    // 批量新增文件
+    bulkAddFile(treeList, tableDataList) {
+      let tableList = []
+      let successList = []
+      for (let i = 0; i < tableDataList.length; i++) {
+        let fileItem = tableDataList[i];
+        let juanNameLIst = _.split(fileItem["文件名"], "·")
+        if (juanNameLIst) {
+          let pdfText = juanNameLIst[juanNameLIst.length - 1];
+          // 使用正则表达式只保留汉字
+          let chineseCharsOnly = pdfText.match(/[\u4e00-\u9fa5]+/g);
+          let juanName = chineseCharsOnly ? chineseCharsOnly.join('') : '';
+          let treeItem = _.find(treeList, o => o.path === `${fileItem["项目名"]}\\${fileItem["卷名"]}\\${juanName}`)
+          let path = _.split(fileItem["储存位置"], "_")
+          let fileType = _.find(this.fileList, o => o.label === path[1].split(".")[1])
+          let prepath = _.split(fileItem["储存位置"], "uploadPath/")
+          if (treeItem) {
+            successList.push(i)
+            tableList.push({
+              treeId: treeItem.currentId,
+              pretreeId: treeItem.preId,
+              prepretreeId: treeItem.prepreId,
+              xiangmuName: fileItem["项目名"],
+              juanName: `${fileItem["卷名"]}_${juanName}`,
+              fileName: path[1],
+              fileType: (fileType || {}).value,
+              uploadTime: fileItem["上传时间"],
+              status: fileItem["状态"],
+              size: "",
+              path: `D:\\test\\${fileItem["项目名"]}\\${fileItem["卷名"]}\\${juanName}\\${path[1]}`,
+              prePath: `D:\\uploadPath\\${prepath[1].replaceAll("/", "\\")}`,
+              note: fileItem["备注"],
+              create_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+              update_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
+            })
+          }
+        }
+      }
+      return { tableList, successList }
+    },
+    // inputData
+    async inputData(treeList, pathList, tableList) {
+      try {
+        await myDatabase.treeList.bulkAdd(treeList)
+        await myDatabase.fileList.bulkAdd(tableList)
+        window.electron.ipcRenderer.send('inputDataList', JSON.stringify({ pathList, tableList }))
+      } catch (error) {
+        ElMessage({
+          message: error,
+          type: "error"
+        })
+        this.searchTree()
+        this.searchTable()
+      }
+    },
     // 清空左侧并搜索
     clearAndSearchTree() {
       this.treeNode = {}
@@ -420,20 +597,10 @@ export default {
             }
           }
           // 删除项目
-          await myDatabase.treeList.bulkDelete(idList)
+          this.deleteXiangmuIdList = _.cloneDeep(idList)
+          this.deleteFileIdList = _.cloneDeep(fileIdList)
           window.electron.ipcRenderer.send('delFloder', JSON.stringify({ name: node.label }))
-          // 查找要删除的文件列表id并删除
+
-          let delfiltIdList = []
-          let fileCollection = myDatabase.fileList
-          fileCollection = fileCollection.filter((equip) => fileIdList.includes(equip.treeId))
-          let delfiltList = await collection.toArray();
-          for (let i = 0; i < delfiltList.length; i++) {
-            let fileItem = delfiltList[i];
-            delfiltIdList.push(fileItem.id)
-          }
-          await myDatabase.fileList.bulkDelete(delfiltIdList)
-          await this.searchTree()
-          await this.searchTable()
         })
         .catch((e) => {
           ElMessage({
@@ -447,10 +614,65 @@ export default {
       this.treeNode = _.cloneDeep(node)
       this.searchTable()
     },
-    //导出(树状)
+    // 导出数据
-    async exportData(params = {}, isAll = false) {
+    async exportData() {
+      let listCopy = _.cloneDeep(this.tableData)
+      let lilstLocal = []
+      if (listCopy.length) {
+        for (let i = 0; i < listCopy.length; i++) {
+          let listItem = listCopy[i];
+          let item = {
+            "项目名": listItem.xiangmuName,
+            "一级卷名": _.split(listItem.juanName, "_")[0],
+            "二级卷名": _.split(listItem.juanName, "_")[1],
+            "文件名": listItem.fileName,
+            "文件路径": `D:\\test\\${listItem.path}`,
+            "文件类型": _.find(this.fileList, { value: listItem.fileType }).label,
+            "文件大小": this.genSize(listItem.size),
+            "文件状态": listItem.status,
+            "上传时间": listItem.uploadTime,
+            "备注": listItem.note,
+
+          }
+          lilstLocal.push({ ...item })
+        }
+        let jsonWorkSheet = XLSX.utils.json_to_sheet(lilstLocal);
+        let workBook = {
+          SheetNames: ["sheet1"],
+          Sheets: {
+            ["sheet1"]: jsonWorkSheet,
+          }
+        };
+        XLSX.writeFile(workBook, `文件信息${dayjs().format("YYYY-MM-DD_HH-mm-ss")}.xls`);
+      } else {
+        ElMessage({
+          type: 'error',
+          message: '当前表格无数据，请有数据后在导出',
+        })
+      }
 
     },
+    // 文件大小
+    genSize(num) {
+      // 文件的大小
+      if (_.isNaN(Number(num))) {
+        return "";
+      }
+      let bytes = Number(num);
+      if (bytes >= 1024 ** 4) {
+        return `${(bytes / 1024 ** 4).toFixed(2)}TB`;
+      }
+      if (bytes >= 1024 ** 3) {
+        return `${(bytes / 1024 ** 3).toFixed(2)}GB`;
+      }
+      if (bytes >= 1024 ** 2) {
+        return `${(bytes / 1024 ** 2).toFixed(2)}MB`;
+      }
+      if (bytes >= 1024) {
+        return `${(bytes / 1024).toFixed(2)}KB`;
+      }
+      return `${bytes}B`;
+    },
     //新增文件
     async addFile() {
       if (_.get(this.treeNode, 'level') !== 3) {
@@ -462,7 +684,7 @@ export default {
         let pathList = _.compact(_.split(this.treeNode.path, '\\'))
         this.addFileForm = {
           visible: true,
-          title: `文件路径：E:\\${_.get(this.treeNode, 'path')}`,
+          title: `文件路径：D:\\${_.get(this.treeNode, 'path')}`,
           disabled: false,
           type: "add",
           formHeader: this.formHeader,
@@ -497,7 +719,7 @@ export default {
     async editFile(row) {
       this.addFileForm = {
         visible: true,
-        title: `编辑文件：E:\\test\\${row.xiangmuName}\\${_.join(_.split(row.juanName, "_"), "\\")}\\${row.fileName}`,
+        title: `编辑文件：D:\\test\\${row.xiangmuName}\\${_.join(_.split(row.juanName, "_"), "\\")}\\${row.fileName}`,
         disabled: false,
         type: "put",
         formHeader: this.formHeader,
@@ -513,7 +735,10 @@ export default {
           file: [
             {
               name: row.fileName,
-              url: `E:\\test\\${row.xiangmuName}\\${_.join(_.split(row.juanName, "_"), "\\")}\\${row.fileName}`,
+              type: row.fileType,
+              size: row.size,
+              path: `D:\\test\\${row.xiangmuName}\\${_.join(_.split(row.juanName, "_"), "\\")}\\${row.fileName}`,
+              url: `D:\\test\\${row.xiangmuName}\\${_.join(_.split(row.juanName, "_"), "\\")}\\${row.fileName}`,
             }
           ],
           fileType: row.fileType,
@@ -528,7 +753,7 @@ export default {
     //注销
     async unregisterFile(row) {
       let org = row.status
-      row.status = org === "注销" ? "正常" : "注销"
+      row.status = org === "已注销" ? "正常" : "已注销"
       await myDatabase.fileList.put({ ...row })
       await this.searchTable()
     },
@@ -616,7 +841,6 @@ export default {
           await myDatabase.treeList.bulkAdd(treeList)
           this.canceldanganDialog()
           pathList = _.uniq(pathList)
-          console.log(619, pathList, JSON.stringify(pathList));
           // 在d盘中新建文件夹
           window.electron.ipcRenderer.send('createFloder', JSON.stringify(pathList))
           await this.searchTree()
@@ -632,7 +856,6 @@ export default {
         if (xianmguName) {
           for (let i = 0; i < preNodeTemp.children.length; i++) {
             let level2Item = preNodeTemp.children[i];
-            console.log(635, level2Item);
             for (let j = 0; j < level2Item.children.length; j++) {
               let level3Item = level2Item.children[j];
               let level3ItemTemp = {
@@ -686,7 +909,6 @@ export default {
         try {
           // 在E盘中更新文件夹
           let params = { oldPath: preNodeTemp.label, newPath: xianmguName }
-          console.log(688, params);
           window.electron.ipcRenderer.send('putFloder', JSON.stringify(params))
           await this.searchTree()
         } catch (error) {
@@ -741,7 +963,6 @@ export default {
       } else if (this.addFileForm.type === "put") {
         let formData = _.cloneDeep(this.addFileForm.formData)
         let pathArr = _.split(formData.path, "\\")
-        console.log(744, pathArr);
         let fileItem = {
           id: formData.id,
           treeId: formData.treeId,
@@ -749,13 +970,13 @@ export default {
           prepretreeId: formData.prepretreeId,
           xiangmuName: formData.xiangmuName,
           juanName: formData.juanName,
-          fileName: formData.file[0].raw.name,
+          fileName: _.get(formData.file, [0, "raw", "name"], _.get(formData.file, [0, "name"], "")),
-          fileType: formData.file[0].raw.type,
+          fileType: _.get(formData.file, [0, "raw", "type"], _.get(formData.file, [0, "type"], "")),
           uploadTime: formData.uploadTime,
           status: formData.status,
-          size: formData.file[0].raw.size,
+          size: _.get(formData.file, [0, "raw", "size"], _.get(formData.file, [0, "size"], "")),
-          path: `${_.join(pathArr.splice(0, pathArr.length - 1), "\\")}\\${formData.file[0].name}`,
+          path: `${_.join(pathArr.splice(0, pathArr.length - 1), "\\")}\\${_.get(formData.file, [0, "raw", "name"], _.get(formData.file, [0, "name"], ""))}`,
-          prePath: formData.file[0].raw.path,
+          prePath: _.get(formData.file, [0, "raw", "path"], _.get(formData.file, [0, "path"], "")),
           note: formData.note,
           create_at: formData.create_at,
           update_at: dayjs().format('YYYY-MM-DD HH:mm:ss'),
@@ -789,7 +1010,6 @@ export default {
       window.electron.ipcRenderer.on('putFloderResult', async (eve, res) => {
         let resObj = JSON.parse(res)
         let preNodeTemp = _.cloneDeep(that.preNodeTemp)
-        console.log(788, resObj, preNodeTemp);
         if (resObj.errorList.length) {
           ElMessage({
             message: `文件夹${resObj.errorList[0].oldPath}修改为${resObj.errorList[0].newPath}，修改失败`,
@@ -864,7 +1084,7 @@ export default {
         await that.searchTree()
       })
       // 监听删除文件夹
-      window.electron.ipcRenderer.on('delFloderResult', (eve, res) => {
+      window.electron.ipcRenderer.on('delFloderResult', async (eve, res) => {
         let resObj = JSON.parse(res)
         if (resObj.errorList.length) {
           ElMessage({
@@ -876,7 +1096,19 @@ export default {
             message: `文件夹${resObj.successList[0].name}删除成功`,
             type: 'success',
           })
-          that.searchTree()
+          await myDatabase.treeList.bulkDelete(that.deleteXiangmuIdList)
+          // 查找要删除的文件列表id并删除
+          let delfiltIdList = []
+          let fileCollection = myDatabase.fileList
+          fileCollection = fileCollection.filter((equip) => that.deleteFileIdList.includes(equip.treeId))
+          let delfiltList = await fileCollection.toArray();
+          for (let i = 0; i < delfiltList.length; i++) {
+            let fileItem = delfiltList[i];
+            delfiltIdList.push(fileItem.id)
+          }
+          await myDatabase.fileList.bulkDelete(delfiltIdList)
+          await this.searchTree()
+          await this.searchTable()
         }
       })
       // 监听创建文件
@@ -925,6 +1157,11 @@ export default {
         a.remove();
         window.URL.revokeObjectURL(url);
       })
+      // 监听导入数据
+      window.electron.ipcRenderer.on('inputDataListResult', async (eve, res) => {
+        that.searchTree()
+        that.searchTable()
+      })
     },
 
   },
@@ -940,6 +1177,16 @@ export default {
 </script>
 <style scoped>
 .rightClass {
-  padding: 4px 0px;
+  padding: 2px 0px;
+}
+
+.uploadClass {
+  top: 2px;
+}
+
+.inputClass {
+  display: inline-block;
+  margin-left: 8px;
+  position: relative;
 }
 </style>