fix(website): Fix Issue with Switching PHP Runtime Environment

Author: zhengkunwang223

backend/app/service/website.go

@@ -1343,6 +1343,14 @@ func (w WebsiteService) ChangePHPVersion(req request.WebsitePHPVersionReq) error
 	if runtime.Resource == constant.ResourceLocal || oldRuntime.Resource == constant.ResourceLocal {
 		return buserr.New("ErrPHPResource")
 	}
+	client, err := docker.NewDockerClient()
+	if err != nil {
+		return err
+	}
+	defer client.Close()
+	if !checkImageExist(client, runtime.Image) {
+		return buserr.WithName("ErrImageNotExist", runtime.Name)
+	}
 	appInstall, err := appInstallRepo.GetFirst(commonRepo.WithByID(website.AppInstallID))
 	if err != nil {
 		return err

frontend/src/views/website/website/config/php/config/index.vue

@@ -2,7 +2,6 @@
     <div v-loading="loading">
         <el-form :model="form" :rules="variablesRules" ref="phpFormRef" label-position="top">
             <el-row v-loading="loading">
-                <el-col :span="1"><br /></el-col>
                 <el-col :span="9">
                     <el-form-item label="short_open_tag" prop="short_open_tag">
                         <el-select v-model="form.short_open_tag">

frontend/src/views/website/website/config/php/function/index.vue

@@ -1,7 +1,7 @@
 <template>
     <div>
         <el-row>
-            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8" :offset="1">
+            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8">
                 <el-form :model="form" :rules="rules" ref="formRef">
                     <el-form-item prop="funcs">
                         <el-input

frontend/src/views/website/website/config/php/index.vue

@@ -10,7 +10,7 @@
             <Upload :id="id" v-if="index == '2'"></Upload>
         </el-tab-pane>
         <el-tab-pane :label="$t('runtime.version')" name="3">
-            <Version :id="id" :runtimeID="runtimeID" v-if="index == '3'"></Version>
+            <Version :id="id" v-if="index == '3'"></Version>
         </el-tab-pane>
     </el-tabs>
 </template>

frontend/src/views/website/website/config/php/upload/index.vue

@@ -1,7 +1,7 @@
 <template>
     <div v-loading="loading">
         <el-row>
-            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8" :offset="1">
+            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8">
                 <el-form :model="form" :rules="rules" ref="phpFormRef">
                     <el-form-item prop="uploadSize">
                         <el-input clearable type="number" v-model.number="form.uploadSize" maxlength="15">

frontend/src/views/website/website/config/php/version/index.vue

@@ -1,7 +1,7 @@
 <template>
     <div v-loading="loading">
         <el-row>
-            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8" :offset="1">
+            <el-col :xs="20" :sm="12" :md="10" :lg="10" :xl="8">
                 <el-form>
                     <el-form-item :label="$t('runtime.version')">
                         <el-select v-model="versionReq.runtimeID" style="width: 100%">
@@ -33,18 +33,14 @@ import { SearchRuntimes } from '@/api/modules/runtime';
 import { onMounted, reactive, ref } from 'vue';
 import { Runtime } from '@/api/interface/runtime';
 import { Website } from '@/api/interface/website';
-import { ChangePHPVersion } from '@/api/modules/website';
+import { ChangePHPVersion, GetWebsite } from '@/api/modules/website';
 import i18n from '@/lang';
 import { MsgSuccess } from '@/utils/message';
 const props = defineProps({
     id: {
         type: Number,
         default: 0,
     },
-    runtimeID: {
-        type: Number,
-        default: 0,
-    },
 });
 
 const runtimeReq = reactive<Runtime.RuntimeReq>({ page: 1, pageSize: 200, type: 'php' });
@@ -92,16 +88,23 @@ const submit = async () => {
             try {
                 await ChangePHPVersion(versionReq);
                 MsgSuccess(i18n.global.t('commons.msg.updateSuccess'));
+                getWebsiteDetail();
             } catch (error) {}
             loading.value = false;
         });
     } catch (error) {}
 };
 
+const getWebsiteDetail = async () => {
+    const res = await GetWebsite(props.id);
+    versionReq.runtimeID = res.data.runtimeID;
+    oldRuntimeID.value = res.data.runtimeID;
+};
+
 onMounted(() => {
-    versionReq.runtimeID = props.runtimeID;
     versionReq.websiteID = props.id;
-    oldRuntimeID.value = props.runtimeID;
+
+    getWebsiteDetail();
     getRuntimes();
 });
 </script>