高端PS級VUE前端網頁生成器，網頁設計效率提高800%
l 巔云前端可視化軟件開發背景
網頁設計是一個相對復雜的過程。需要美工PS出圖、切片，HTML前端設計師布局（DIV+CSS），JS代碼開發編寫，一個完整的網頁就需要較長的時間才能完成開發。
這時如果我們有一款可視化的布局器，將常用的一些網頁切成功能塊（如文字塊，圖片塊，新聞列表，產品列塊）然后據當前網頁需求將一些塊拼圖式、拖放式擺放到任意位置?？鞄闯鲆粋€網頁來。且實現這些塊的整體樣式及塊內部HTML子元素自由風格定義。
巔云前端可視化布局系統，就是一個實現了完全自定義的、所見即所得的一個非代碼式前端開發工具。大大提高網頁設計速度。
l 軟件功能說明：
巔云前端雙向可視化布局系統V4.0功能介紹：
技術實現
1、系統采用VUE雙向數據綁定機制及NODE.JS打包
2、tinymce可視化文字編輯
3、Ant-design-vue表單元素
4、DIV自由拖拽，獨創網頁定位標尺線，DIV移動輔助線參考線。
5、實現了拖放式增加DIV，右鍵面板、
6、tinymce即時修改DIV內容，設置區域樣式，設置模塊及部件樣式
7、高要擴展性：DIV類型可通過接口動態載入，獨創動態設置模塊內部哪些元素可以設置樣式。
8、快捷方式：模塊有復制，刪除功能
9、高安全：可隨時撤銷恢復。
10、模塊動畫設置、不同類型模塊的私有設置項，風格調用等靈活擴展實現方案。
11、實現了iframe消息傳遞更好的響應式布局方案，多端適配。
l 軟件安裝：
1、需系統安裝node.js,CD到系統目錄分為innerdemo(內層)，outerdemo（iframe外層）
2、內外層分別運行：npm install及npm run serve及可。
3、訪問方式：http://localhost:8080或8081端口。
黑白雙風格功能界面截圖：
系統目錄結構：
|
Inner /iframe內層目錄/文件 |
說明 |
|
dist |
打包后生成目錄 |
|
node_modules |
Vue類組件安裝庫 |
|
public |
靜態資源 |
|
src |
核心目錄 |
|
-components Module.vue 模塊功能實現 ModuleBox.vue 區域模塊 |
功能組件存
|
|
-assets |
靜態資源 |
|
-App.vue |
主模塊 |
|
Outer/iframe外層目錄/文件 |
說明 |
|
dist |
打包后生成目錄 |
|
node_modules |
Vue類組件安裝庫 |
|
public |
靜態資源 |
|
src |
核心目錄 |
|
-components BoxSet.vue 模塊區域組件 Head.vue 框架頂部組件 ModalImg.vue 框架彈窗組件 Module.vue 添加DIV面板 Rclick.vue 右鍵功能 Ruler.vue 標尺 Setting.vue 模塊區域設置 Spin.vue 加載入動畫 |
功能組件外層指令
|
|
-assets |
靜態資源 |
|
-App.vue |
主模塊 |
特有數據結構：
巔云門戶自助建站系統v8建站平臺版，歷經3年不斷打磨終于上線了。專業PS級大師級高端響應式智能建站平臺軟件，只為網絡公司而生，采用國內知名開源php框架,Thinkphp6+搭載巔云vue.js前端數據響應系統4.0強強聯合,實現了在線自助開通網站，企業站+B2B商城+分類信息、視頻、資訊等門戶網站，完美支持微站小程序且數據統一。
平臺軟件介紹：http://v8.yinxi.net/
