锁库

src/api/editor.js

+/**
+ * Created by rockyl on 2020-02-07.
+ */
+
+import {fetchApi} from "./common";
+
+export async function importView(file) {
+	const response = await fetchApi('/api/parsePSD', {
+		params: {
+			file,
+		},
+		method: 'post',
+		contentType: 'form-data',
+		errMessage: 'Failed to import view',
+	})
+	response.__originFile = file
+	return response
+}
+
+export async function uploadView(file) {
+	const response = await fetchApi('/api/uploadView', {
+		params: {
+			file,
+		},
+		method: 'post',
+		contentType: 'form-data',
+		errMessage: 'Failed to upload view',
+	})
+	response.__originFile = file;
+	return response
+}
+
+export async function uploadFile(file, compress = false, uuid) {
+	let params = { file }
+	if (compress) {
+		params.compress = true
+	}
+	if (uuid) {
+		params.uuid = uuid
+	}
+	const response = await fetchApi('/api/uploadFile', {
+		params,
+		method: 'post',
+		contentType: 'form-data',
+		errMessage: 'Failed to upload file',
+	})
+	response.__originFile = file
+	return response
+}

src/api/index.js

@@ -4,8 +4,14 @@
 
 import * as envApi from './env'
 import * as projectApi from './project'
+import * as editorApi from './editor'
+import * as polarisApi from './polaris'
+import * as packageApi from './package'
 
 export {
 	envApi,
 	projectApi,
+	editorApi,
+	polarisApi,
+	packageApi,
 }

src/api/package.js

@@ -6,11 +6,18 @@
 
 import {fetchApi} from "./common";
 
-export async function fetchPackages(ids) {
-	return await fetchApi('/api/package/query', {
+export async function fetchPackageInfos(type = 0) {
+	return await fetchApi('/package/query-info/' + type, {
+		errMessage: 'Failed to fetch package infos',
+	})
+}
+
+export async function fetchPackages(schema) {
+	return await fetchApi('/package/query', {
 		params: {
-			ids,
+			schema,
 		},
+		method: 'post',
 		errMessage: 'Failed to fetch packages',
 	})
 }

src/api/polaris.js

+/**
+ * Created by rockyl on 2020-02-07.
+ */
+
+import {fetchApi} from "./common";
+import {getCookie} from "./utils";
+
+export async function saveSkins(params) {
+	return await fetchApi(`/polaris/autoSaveSkins`, {
+		params,
+		method: 'post'
+	})
+}
+
+export async function getProjectSkins(projectId, env) {
+	return await fetchApi(`/polaris/getProjectSkins?projectId=${projectId}&env=${env}`, {
+		method: 'post',
+		params: {
+			cookie: {
+				dev: getCookie('sso_ticket'),
+				test: localStorage.getItem('ticket'),
+				prod: localStorage.getItem('prod_ticket'),
+			}
+		}
+	})
+}
+
+export async function getTestEnvTicket() {
+	return await fetchApi(`/polaris/getTestEnvTicket`, { method: 'get' })
+}
+
+export async function getProdTicket() {
+	return await fetchApi(`/polaris/getProdTicket`, { method: 'get' })
+}
+
+export async function sendDingTalk() {
+	return await fetchApi(`/polaris/sendMessage`, { method: 'post' })
+}

src/api/project.js

@@ -78,79 +78,3 @@ export async function pack(id, debug, packedAssets) {
 		errMessage: 'Failed to pack project',
 	})
 }
-
-export async function importView(file) {
-	const response = await fetchApi('/api/parsePSD', {
-		params: {
-			file,
-		},
-		method: 'post',
-		contentType: 'form-data',
-		errMessage: 'Failed to import view',
-	})
-	response.__originFile = file
-	return response
-}
-
-export async function uploadView(file) {
-	const response = await fetchApi('/api/uploadView', {
-		params: {
-			file,
-		},
-		method: 'post',
-		contentType: 'form-data',
-		errMessage: 'Failed to upload view',
-	})
-	response.__originFile = file;
-	return response
-}
-
-export async function uploadFile(file, compress = false, uuid) {
-	let params = { file }
-	if (compress) {
-		params.compress = true
-	}
-	if (uuid) {
-		params.uuid = uuid
-	}
-	const response = await fetchApi('/api/uploadFile', {
-		params,
-		method: 'post',
-		contentType: 'form-data',
-		errMessage: 'Failed to upload file',
-	})
-	response.__originFile = file
-	return response
-}
-
-export async function saveSkins(params) {
-	return await fetchApi(`/polaris/autoSaveSkins`, {
-		params,
-		method: 'post'
-	})
-}
-
-export async function getProjectSkins(projectId, env) {
-	return await fetchApi(`/polaris/getProjectSkins?projectId=${projectId}&env=${env}`, {
-		method: 'post',
-		params: {
-			cookie: {
-				dev: getCookie('sso_ticket'),
-				test: localStorage.getItem('ticket'),
-				prod: localStorage.getItem('prod_ticket'),
-			}
-		}
-	})
-}
-
-export async function getTestEnvTicket() {
-	return await fetchApi(`/polaris/getTestEnvTicket`, { method: 'get' })
-}
-
-export async function getProdTicket() {
-	return await fetchApi(`/polaris/getProdTicket`, { method: 'get' })
-}
-
-export async function sendDingTalk() {
-	return await fetchApi(`/polaris/sendMessage`, { method: 'post' })
-}
\ No newline at end of file

src/config.js

@@ -5,11 +5,11 @@
 export let API_HOST;
 if (process.env.NODE_ENV === 'development') {
 	//API_HOST = '//10.10.95.74:7777';
-	//API_HOST = '//192.168.1.16:7777';
+	API_HOST = '//192.168.1.16:7777';
 	//API_HOST = '//192.168.0.104:7777';
 	//API_HOST = '//10.10.92.33:7777';
 	//API_HOST = '//localhost:3002';
-	API_HOST = window.__data.apiHost;
+	//API_HOST = window.__data.apiHost;
 	//API_HOST = '';
 } else {
 	API_HOST = window.__data.apiHost;

src/locales/zh-CN.json

@@ -13,6 +13,7 @@
 	"Paste same level":"粘贴(同级)",
 	"Paste child":"粘贴(子级)",
 	"Exit": "退出",
+	"Apply": "应用",
 	"Props": "属性",
 	"Behavior": "行为",
 	"Only mine": "仅我的",
@@ -114,6 +115,7 @@
 	"Builtin event should add directly": "内部事件请直接添加",
 	"Env constant": "自定义常量",
 	"Custom module": "自定义模块",
+	"Package manager": "包管理",
 	"Projectx config": "星速台配置",
 	"Custom module asset mapping": "自定义模块素材映射",
 	"Copy template to clipboard": "复制模板到粘贴板",
@@ -292,5 +294,10 @@
 		"last": "负责末个",
 		"all": "负责全部",
 		"race": "负责最先"
+	},
+	"dependenciesTypes": {
+		"process": "过程库",
+		"custom": "模块库",
+		"script": "脚本库"
 	}
 }
\ No newline at end of file

src/store/modules/package.js

+import db from "../../utils/db-storage";
+import {packageApi} from "../../api";
+import maxSatisfying from "semver/ranges/max-satisfying";
+
+/**
+ * Created by rockyl on 2020-01-04.
+ */
+
+export const typeMapping = [
+	'',
+	'process',
+	'custom',
+	'script',
+];
+
+export const packageStore = {
+	state: {
+		packageInfos: {
+			process: [],
+			custom: [],
+			script: [],
+		},
+		packages: [],
+	},
+	mutations: {
+		updatePackageInfos(state, packageInfos) {
+			for (let i = 1, li = typeMapping.length; i < li; i++) {
+				state.packageInfos[typeMapping[i]].splice(0);
+			}
+			for (let packageInfo of packageInfos) {
+				packageInfo.versions = packageInfo.versions.split(',');
+				state.packageInfos[typeMapping[packageInfo.type]].push(packageInfo)
+			}
+		},
+		updatePackages(state, packages) {
+			state.packages = packages ? JSON.parse(packages) : [];
+		},
+	},
+	getters: {
+		getPackage: (state) => (packageId, version) => {
+			let packageVersions = state.packages[packageId];
+			if (packageVersions) {
+				return packageVersions[version];
+			}
+		}
+	},
+	actions: {
+		async loadPackageInfos({state, commit}, id) {
+			const packageInfos = await packageApi.fetchPackageInfos();
+			commit('updatePackageInfos', packageInfos);
+			console.log(packageInfos);
+		},
+		async loadPackages({state, commit, dispatch}, id) {
+			dispatch('loadPackageInfos');
+			let packages = await db.get('packages', id);
+			commit('updatePackages', packages);
+		},
+		async applyModifyDependencies({state, commit, getters}, dependencies) {
+			let schema = {};
+			for (let packageId in dependencies) {
+				let version = dependencies[packageId];
+				let packageData = getters.getPackage(packageId, version);
+				if (!packageData) {
+					schema[packageId] = version;
+				}
+			}
+			if (Object.keys(schema).length > 0) {
+				console.log(schema);
+				await packageApi.fetchPackages(schema);
+			}
+		}
+	},
+};
+
+export function fillLastVersion(dependencies, packageInfos) {
+	for (let group in packageInfos) {
+		for (let packageInfo of packageInfos[group]) {
+			const {package_id, versions} = packageInfo;
+			if (!dependencies[package_id]) {
+				dependencies[package_id] = maxSatisfying(versions, '*');
+			}
+		}
+	}
+}

src/store/modules/packages.js

-import db from "../../utils/db-storage";
-
-/**
- * Created by rockyl on 2020-01-04.
- */
-
-export const packagesStore = {
-	state: {},
-	actions: {
-		async loadPackages({state, commit}, id) {
-			let packages = await db.get('packages', id);
-			commit('updatePackages', packages);
-		},
-
-	},
-};

src/store/modules/project.js

@@ -3,20 +3,19 @@
  */
 import Vue from "vue"
 import JSZip from "jszip"
-import {projectApi} from "../../api"
+import {projectApi, editorApi} from "../../api"
 import path from "path"
 import generateUUID from "uuid/v4"
 import {getCmpProps, flattenViews, getCmpByUUID} from '../../utils/common'
 import {clonePureObj, getMockServeEnabled, saveAs} from "../../utils"
 import {template} from "../../template"
-import {importView, uploadFile, uploadView} from "../../api/project"
 import events from "@/global-events"
 import {packImages} from "../../utils/sheet-pack"
 import {addBehavior, deleteProcessMeta, findProcess} from "./behavior"
 
 import db from "../../utils/db-storage"
 import {preprocess} from "../../views/Preview/preview-preprocess"
-import {packagesStore} from "./packages"
+import {fillLastVersion, packageStore} from "./package"
 import {fetchApi} from "../../api/common"
 import {toZeroing} from "psd-parse-web"
 
@@ -88,7 +87,7 @@ function copyBaseRoot(node) {
 
 export const projectStore = {
 	modules: {
-		packages: packagesStore,
+		package: packageStore,
 	},
 	state: {
 		id: '',
@@ -120,13 +119,6 @@ export const projectStore = {
 		},
 		makeDirty() {
 
-		},
-		updatePackages(state, packages) {
-			state.packages = packages ? JSON.parse(packages) : {
-				processes: [],
-				customs: [],
-				scripts: [],
-			};
 		},
 		updateProject(state, project) {
 			const {id, name, creator, data} = project;
@@ -161,6 +153,8 @@ export const projectStore = {
 				Vue.set(localData, 'dependencies', {});
 			}
 
+			fillLastVersion(state.data.dependencies, state.package.packageInfos);
+
 			state.mockServeEnabled = getMockServeEnabled(id);
 			updateMock(localData.mock);
 		},
@@ -177,11 +171,13 @@ export const projectStore = {
 			state.data.dataMapping = value;
 		},
 		modifyCustoms(state, value) {
-			console.log(value);
 			state.data.customs = value;
 		},
 		modifyProjectDetails(state) {
 
+		},
+		modifyDependencies(state, value) {
+			state.data.dependencies = value;
 		},
 		/**
 		 * 激活组件
@@ -698,7 +694,7 @@ export const projectStore = {
 		async importPsd({commit}, {file, action}) {
 			const result = await toZeroing(file);
 			let viewFile = new File([result], 'view.json');
-			const {view, assets} = await uploadView(viewFile);
+			const {view, assets} = await editorApi.uploadView(viewFile);
 			switch (action) {
 				case 0: //单视图
 					view.name = file.name.substring(0, file.name.lastIndexOf('.'));
@@ -713,7 +709,7 @@ export const projectStore = {
 			commit('importAssets', assets)
 		},
 		async importView({commit}, {file, action}) {
-			const {view, assets} = await importView(file);
+			const {view, assets} = await editorApi.importView(file);
 			switch (action) {
 				case 0: //单视图
 					view.name = file.name.substring(0, file.name.lastIndexOf('.'));
@@ -795,7 +791,7 @@ async function uploadFiles(files) {
 	for (let file of files) {
 		events.$emit('upload-indicator', true);
 		ps.push(
-			uploadFile(file).catch(e => {
+			editorApi.uploadFile(file).catch(e => {
 				failedList.push(file);
 			}).finally(() => {
 				events.$emit('upload-indicator', false);
@@ -826,7 +822,7 @@ async function packAssets(assets) {
 
 	for (let asset of newAssets) {
 		if (asset.file) {
-			const {url} = await uploadFile(asset.file, true).catch(e => {
+			const {url} = await editorApi.uploadFile(asset.file, true).catch(e => {
 				failedList.push(asset);
 			});
 			let sheetConfig = {
@@ -836,7 +832,7 @@ async function packAssets(assets) {
 			}
 			let sheetConfigFile = new File([JSON.stringify(sheetConfig)], 'sheet.json', {type: 'plain/text'})
 
-			const {url: sheetConfigUrl} = await uploadFile(sheetConfigFile, false, asset.sheetUUID).catch(e => {
+			const {url: sheetConfigUrl} = await editorApi.uploadFile(sheetConfigFile, false, asset.sheetUUID).catch(e => {
 				failedList.push(asset)
 			})
 			asset.url = sheetConfigUrl

src/themes/light/editor.scss

@@ -92,6 +92,17 @@
 
 }
 
+.package-manager {
+	.item{
+		border-bottom: 1px solid $--border-color-base;
+		padding-bottom: 5px;
+
+		.update-time{
+			margin-right: 5px;
+		}
+	}
+}
+
 .string-input-container {
 	flex: 1;
 	height: 28px;

src/views/Editor/dialogs/DetailsDialog.vue

@@ -16,8 +16,11 @@
 			<el-tab-pane :label="$t('Data mapping')" name="data-mapping">
 				<data-mapping-editor ref="dataMappingEditor"/>
 			</el-tab-pane>
-			<el-tab-pane :label="$t('Custom module')" name="custom">
+			<!--<el-tab-pane :label="$t('Custom module')" name="custom">
 				<custom-module-editor ref="customModuleEditor"/>
+			</el-tab-pane>-->
+			<el-tab-pane :label="$t('Package manager')" name="package-manager">
+				<package-manager-editor ref="packageManager"/>
 			</el-tab-pane>
 			<el-tab-pane :label="$t('Projectx config')" name="projectx">
 				<projectx-config ref="projectxConfig" />
@@ -40,18 +43,21 @@
 	import CustomModuleEditor from "./editors/CustomModuleEditor";
 	import DataMappingEditor from "./editors/DataMappingEditor";
 	import ProjectxConfig from "./editors/ProjectxConfig";
+	import PackageManagerEditor from "./editors/PackageManagerEditor";
 
 	const refs = [
 		'projectEditor',
 		'envEditor',
 		'dataMappingEditor',
-		'customModuleEditor',
-		"projectxConfig"
+		//'customModuleEditor',
+		'packageManager',
+		'projectxConfig',
 	];
 
 	export default {
 		name: "DetailsDialog",
-		components: {DataMappingEditor, CustomModuleEditor, EnvEditor, ProjectEditor,
+		components: {
+			PackageManagerEditor, DataMappingEditor, CustomModuleEditor, EnvEditor, ProjectEditor,
 			ProjectxConfig},
 		data() {
 			return {

src/views/Editor/dialogs/ProjectxOptions.vue

@@ -68,7 +68,7 @@ import {
   getTestEnvTicket,
   getProdTicket,
   sendDingTalk
-} from "../../../../src/api/project";
+} from "../../../../src/api/polaris";
 export default {
   name: "ProjectxOptions",
   props: {

src/views/Editor/dialogs/editors/PackageManagerEditor.vue

+<template>
+	<div style="height: 100%;display: flex;flex-direction: column;">
+		<el-tabs style="flex: 1;height: 0;" class="tabs" v-model="activeName">
+			<el-tab-pane v-for="(group, key) in packageInfos" :label="$t('dependenciesTypes')[key]" :name="key">
+				<el-scrollbar v-if="editData" class="scrollbar" wrap-class="wrap-x-hidden" view-class="view package-manager">
+					<div class="mapping-list">
+						<div class="list">
+							<div class="item" v-for="packageInfo in group">
+								<div style="flex: 1;">
+									{{packageInfo.package_id}}
+								</div>
+								<el-tag class="update-time" size="mini" type="success">{{moment(packageInfo.update_time)}}</el-tag>
+								<el-select size="mini" v-model="editData[packageInfo.package_id]">
+									<el-option v-for="(version, index) in packageInfo.versions"
+									           :key="index"
+									           :value="version"
+									           :label="version"
+									></el-option>
+								</el-select>
+							</div>
+						</div>
+					</div>
+				</el-scrollbar>
+			</el-tab-pane>
+		</el-tabs>
+		<div style="margin-top: 5px;">
+			<el-button size="mini" @click="applyModify" type="primary">{{$t('Apply')}}</el-button>
+			<el-button size="mini" @click="resetModify">{{$t('Reset')}}</el-button>
+		</div>
+	</div>
+
+</template>
+
+<script>
+	import {mapState, mapMutations, mapActions} from 'vuex'
+	import {clonePureObj} from "../../../../utils";
+	import moment from "moment";
+
+	export default {
+		name: "PackageManagerEditor",
+		data() {
+			return {
+				activeName: 'process',
+				editData: null,
+			}
+		},
+		computed: {
+			...mapState({
+				dependencies: state => state.project.data.dependencies,
+				packageInfos: state => {
+					console.log(state.project);
+					return state.project.package.packageInfos;
+				},
+			}),
+		},
+		methods: {
+			moment(time) {
+				return moment(time).format('YYYY-MM-DD HH:mm:ss');
+			},
+			edit() {
+				this.editData = clonePureObj(this.dependencies);
+			},
+			save() {
+				this.modifyDependencies(this.editData);
+			},
+			async applyModify() {
+				await this.applyModifyDependencies(this.editData);
+			},
+			resetModify() {
+				this.edit();
+			},
+			...mapMutations([
+				'modifyDependencies',
+			]),
+			...mapActions([
+				'applyModifyDependencies',
+			]),
+		}
+	}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file