enhance calling code input

Strides-Admin/src/views/driver/DriverDetail.vue

@@ -68,26 +68,24 @@
           </el-col>
           <el-col :xs="24" :md="10" :offset="0">
             <el-form-item label="Phone Number:" prop="phone">
-              <el-row :gutter="0">
-                <el-col :span="7">
-                  <el-select
-                    :disabled="isDispatch"
-                    v-model="form.callingCode">
-                    <el-option
-                      v-for="item in options.callingCode"
-                      :key="item.callingCode"
-                      :label="'+' + item.callingCode"
-                      :value="item.callingCode"
-                    />
-                  </el-select>
-                </el-col>
-                <el-col :span="16" :offset="1">
-                  <el-input
-                    :disabled="isDispatch"
-                    v-model="form.phone"
-                  ></el-input>
-                </el-col>
-              </el-row>
+              <div class="flexc">
+                <el-select
+                  style="min-width: 75px; max-width: 80px;"
+                  :disabled="isDispatch"
+                  v-model="form.callingCode">
+                  <el-option
+                    v-for="item in options.callingCode"
+                    :key="item.callingCode"
+                    :label="'+' + item.callingCode"
+                    :value="item.callingCode"
+                  />
+                </el-select>
+                <el-input
+                  style="margin-left: 10px;"
+                  :disabled="isDispatch"
+                  v-model="form.phone"
+                />
+              </div>
               <!--el-input
                 v-else
                 :disabled="isDispatch"
@@ -220,22 +218,22 @@ export default {
       },
       rules: {
         nickName: [{
-          message: "required",
+          message: "Nickname is required",
           trigger: "blur",
           required: true,
         }],
         email: [{
-          message: "required",
+          message: "Email is required",
           trigger: "blur",
           required: true,
         }],
         phone: [{
-          message: "required",
+          message: "Phone number is required",
           trigger: "blur",
           required: true,
         }],
         fleetCompanyId: [{
-          message: "required",
+          message: "Please select company",
           trigger: "blur",
           required: true,
         }],

Strides-Admin/src/views/user/UserDetail.vue

@@ -589,8 +589,8 @@ export default {
   }
 
   .area-code {
-    width: 75px;
-    margin-right: 15px;
+    width: 80px;
+    margin-right: 10px;
   }
 
   .phone-number {